summaryrefslogtreecommitdiff
path: root/html/options.html
diff options
context:
space:
mode:
Diffstat (limited to 'html/options.html')
-rw-r--r--html/options.html416
1 files changed, 0 insertions, 416 deletions
diff --git a/html/options.html b/html/options.html
deleted file mode 100644
index e317032..0000000
--- a/html/options.html
+++ /dev/null
@@ -1,416 +0,0 @@
-<!DOCTYPE html>
-<!--
- SPDX-License-Identifier: GPL-3.0-or-later OR CC-BY-SA-4.0
-
- Extension's settings page
-
- This file is part of Haketilo.
-
- Copyright (C) 2021 Wojtek Kosior <koszko@koszko.org>
-
- File is dual-licensed. You can choose either GPLv3+, CC BY-SA or both.
-
- This program is free software: you can redistribute it and/or modify
- it under the terms of the GNU General Public License as published by
- the Free Software Foundation, either version 3 of the License, or
- (at your option) any later version.
-
- This program is distributed in the hope that it will be useful,
- but WITHOUT ANY WARRANTY; without even the implied warranty of
- MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
- GNU General Public License for more details.
-
- You should have received a copy of the GNU General Public License
- along with this program. If not, see <https://www.gnu.org/licenses/>.
-
- I, Wojtek Kosior, thereby promise not to sue for violation of this file's
- licenses. Although I request that you do not make use of this code in a
- proprietary program, I am not going to enforce this in court.
- -->
-<html>
- <head>
- <meta charset="utf-8"/>
- <title>Haketilo options</title>
-#LOADCSS html/reset.css
-#LOADCSS html/base.css
-#LOADCSS html/table.css
- <style>
- body {
- width: 100%;
- }
-
- /* tabbed view */
- #show_repos:not(:checked) ~ #repos,
- #show_pages:not(:checked) ~ #pages,
- #show_bags:not(:checked) ~ #bags,
- #show_scripts:not(:checked) ~ #scripts {
- display: none;
- }
-
- #show_repos:checked ~ div #repos_lbl,
- #show_pages:checked ~ div #pages_lbl,
- #show_bags:checked ~ div #bags_lbl,
- #show_scripts:checked ~ div #scripts_lbl {
- background: #4CAF50;
- color: white;
- }
-
- #tab_heads>* {
- font-size: 130%;
- padding: 10px;
- display: inline-block;
- cursor: pointer;
- }
-
- #tab_heads {
- -moz-user-select: none;
- user-select: none;
- }
-
- #import_but {
- font: unset;
- font-size: 130%;
- float: right;
- margin: 0;
- border-radius: 0;
- }
-
- div.tab {
- min-width: 50vw;
- width: fit-content;
- padding-left: 6px;
- }
-
- /* popup window with list of selectable components */
- .popup {
- position: fixed;
- width: 100vw;
- height: 100vh;
- left: 0;
- top: 0;
- background-color: rgba(60,60,60,0.4);
- z-index: 1;
- overflow: auto;
- vertical-align: center;
- horizontal-align: center;
- }
-
- .popup_frame {
- background-color: #f0f0f0;
- margin: 5vh auto;
- padding: 15px;
- border: solid #333 4px;
- border-radius: 15px;
- width: -moz-fit-content;
- width: fit-content;
- }
-
- .work_li .table_wrapper::before {
- background: linear-gradient(#e0f0f0, #555);
- }
-
- .work_li .table_wrapper::after {
- background: linear-gradient(#555, #e0f0f0);
- }
-
- .table_wrapper.always_scrollbar>* {
- border-left: solid #454 8px;
- max-height: 80vh;
- overflow-y: scroll;
- }
-
- .table_wrapper .table_wrapper.always_scrollbar>*,
- .popup_frame .table_wrapper.always_scrollbar>* {
- max-height: 60vh;
- }
-
- .popup_frame .table_wrapper table {
- min-width: 30vw;
- }
-
- .popup_frame .table_wrapper {
- margin: 0 auto;
- }
-
- td:first-child {
- max-width: 70vw;
- overflow: hidden;
- }
-
- tr.work_li>td:first-child {
- padding-right: 0;
- max-width: unset;
- }
-
- tr.work_li>td>div {
- background-color: #e0f0f0;
- border-left: solid #454 5px;
- border-right: solid #454 2px;
- padding: 5px 10px;
- }
-
- .form_grid {
- display: grid;
- grid-template-columns: auto auto;
- }
-
- .form_grid>label {
- grid-column: 1 / span 1;
- margin-right: 10px;
- }
-
- .form_grid label {
- line-height: 34px; /* center text vertically */
- }
-
- .form_grid>input, .form_grid>span {
- grid-column: 2 / span 1;
- }
-
- .form_grid>label[for="script_contents_field"],
- .form_grid>* {
- grid-column: 1 / span 2;
- }
-
- .form_grid>textarea {
- min-width: 70vw;
- resize: none;
- }
-
- .form_disabled>* {
- opacity: 0.5;
- pointer-events: none;
- }
-
- .form_disabled_msg {
- display: none;
- font-style: italic;
- }
-
- .form_disabled .form_disabled_msg {
- opacity: initial;
- pointer-events: initial;
- display: initial;
- }
- </style>
- </head>
- <body>
- <template>
- <tr id="item_li" class="nowrap">
- <td></td>
- <td><div class="button"> Edit </div></td>
- <td><div class="button"> Remove </div></td>
- <td><div class="button"> Export </div></td>
- </tr>
- <tr id="bag_component_li" class="nowrap">
- <td></td>
- <td><div class="button"> Remove </div></td>
- </tr>
- <tr id="chbx_component_li" class="nowrap">
- <td>
- <input type="checkbox" style="display: inline;"></input>
- <span></span>
- </td>
- </tr>
- <tr id="radio_component_li" class="nowrap">
- <td>
- <input type="radio" style="display: inline;" name="page_components"></input>
- <span></span>
- </td>
- </tr>
- </template>
-
- <!-- Mind the show_*s ids below - their format is assumed in js code -->
- <input type="radio" name="tabs" id="show_repos"></input>
- <input type="radio" name="tabs" id="show_pages" checked></input>
- <input type="radio" name="tabs" id="show_bags"></input>
- <input type="radio" name="tabs" id="show_scripts"></input>
- <div id="tab_heads" class="has_bottom_line">
- <label for="show_repos" id="repos_lbl"> Repos </label>
- <label for="show_pages" id="pages_lbl"> Pages </label>
- <label for="show_bags" id="bags_lbl"> Bags </label>
- <label for="show_scripts" id="scripts_lbl"> Scripts </label>
- <button id="import_but" style="margin-left: 40px;"> Import </button>
- </div>
- <div id="repos" class="tab">
- <div class="table_wrapper tight_table has_bottom_line has_upper_line">
- <div>
- <table>
- <tbody id="repos_ul">
- <tr id="work_repo_li" class="hide work_li">
- <td colspan="4">
- <div class="form_grid">
- <label for="repo_url_field">URL: </label>
- <input id="repo_url_field"></input>
- <div>
- <button id="save_repo_but" type="button"> Save </button>
- <button id="discard_repo_but" type="button"> Cancel </button>
- </div>
- </div>
- </td>
- </tr>
- </tbody>
- </table>
- </div>
- </div>
- <button id="add_repo_but" type="button"> Add repository </button>
- </div>
- <div id="pages" class="tab">
- <div class="table_wrapper tight_table has_bottom_line has_upper_line">
- <div>
- <table>
- <tbody id="pages_ul">
- <tr id="work_page_li" class="hide work_li">
- <td colspan="4">
- <div class="form_grid">
- <label for="page_url_field">URL: </label>
- <input id="page_url_field"></input>
- <label>Payload: </label>
- <span class="nowrap">
- <span id="page_payload"></span>
- <button id="select_page_components_but">
- Choose payload
- </button>
- </span>
- <div id="allow_native_scripts_container" class="nowrap">
- <input id="page_allow_chbx" type="checkbox" style="display: inline;"></input>
- <label for="page_allow_chbx">Allow native scripts</label>
- <span class="form_disabled_msg">
- (only possible when no payload is used)
- </span>
- </div>
- <div>
- <button id="save_page_but" type="button"> Save </button>
- <button id="discard_page_but" type="button"> Cancel </button>
- </div>
- </div>
- </td>
- </tr>
- </tbody>
- </table>
- </div>
- </div>
- <button id="add_page_but" type="button"> Add page </button>
- <br/>
-#INCLUDE html/default_blocking_policy.html
- </div>
- <div id="bags" class="tab">
- <div class="table_wrapper tight_table has_bottom_line has_upper_line">
- <div>
- <table>
- <tbody id="bags_ul">
- <tr id="work_bag_li" class="hide work_li">
- <td colspan="4">
- <div class="form_grid">
- <label for="bag_name_field"> Name: </label>
- <input id="bag_name_field"></input>
- <div class="table_wrapper tight_table has_bottom_line has_upper_line">
- <div>
- <table>
- <tbody id="bag_components_ul">
- <tr id="empty_bag_component_li" class="hide"></tr>
- </tbody>
- </table>
- </div>
- </div>
- <div>
- <button id="select_bag_components_but">
- Add scripts
- </button>
- </div>
- <div>
- <button id="save_bag_but"> Save </button>
- <button id="discard_bag_but"> Cancel </button>
- </div>
- </div>
- </td>
- </tr>
- </tbody>
- </table>
- </div>
- </div>
- <button id="add_bag_but" type="button"> Add bag </button>
- </div>
- <div id="scripts" class="tab">
- <div class="table_wrapper tight_table has_bottom_line has_upper_line">
- <div>
- <table>
- <tbody id="scripts_ul">
- <tr id="work_script_li" class="hide work_li">
- <td colspan="4">
- <div class="form_grid">
- <label for="script_name_field"> Name: </label>
- <input id="script_name_field"></input>
- <label for="script_url_field"> URL: </label>
- <input id="script_url_field"></input>
- <label for="script_sha256_field"> SHA256: </label>
- <input id="script_sha256_field"></input>
- <aside>
- Note: URL and SHA256 are ignored if script text is provided.
- </aside>
- <label for="script_contents_field"> contents: </label>
- <textarea id="script_contents_field" rows="20" cols="80"></textarea>
- <div>
- <button id="save_script_but"> Save </button>
- <button id="discard_script_but"> Cancel </button>
- </div>
- </div>
- </td>
- </tr>
- </tbody>
- </table>
- </div>
- </div>
- <button id="add_script_but" type="button"> Add script </button>
- </div>
-
- <div id="chbx_components_window" class="hide popup" position="absolute">
- <div class="popup_frame">
- <div class="table_wrapper tight_table has_bottom_line has_upper_line">
- <div>
- <table>
- <tbody id="chbx_components_ul">
- </tbody>
- </table>
- </div>
- </div>
- <button id="commit_bag_components_but"> Add </button>
- <button id="cancel_bag_components_but"> Cancel </button>
- </div>
- </div>
-
- <div id="radio_components_window" class="hide popup" position="absolute">
- <div class="popup_frame">
- <div class="table_wrapper tight_table always_scrollbar has_bottom_line has_upper_line">
- <div>
- <table>
- <tbody id="radio_components_ul">
- <tr id="radio_component_none_li">
- <td>
- <input id="radio_component_none_input" type="radio" style="display: inline;" name="page_components"></input>
- <span>(None)</span>
- </td>
- </tr>
- </tbody>
- </table>
- </div>
- </div>
- <button id="commit_page_components_but"> Choose </button>
- <button id="cancel_page_components_but"> Cancel </button>
- </div>
- </div>
-
- <div id="import_window" class="hide popup" position="absolute">
- <div class="popup_frame">
- <h2> Settings import </h2>
-#INCLUDE html/import_frame.html
- </div>
- </div>
-
- <a id="file_downloader" class="hide"></a>
- <form id="file_opener_form" style="visibility: hidden;">
- <input type="file" id="file_opener"></input>
- </form>
-#LOADJS html/options_main.js
- </body>
-</html>