move files to locations describing their function
This commit is contained in:
parent
8a590a9bad
commit
89b22bccba
6 changed files with 148 additions and 261 deletions
|
@ -1,5 +1,5 @@
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<script src="../../scripts/pages/open/popup.JS" type="module"></script>
|
<script src="../../scripts/pages/open/popup.js" type="module"></script>
|
||||||
</head>
|
</head>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
@ -1,5 +1,8 @@
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<script src="../../scripts/pages/open/settings.JS" type="module"></script>
|
<script
|
||||||
</head>
|
src="../../scripts/pages/open/settings.js"
|
||||||
|
type="module"
|
||||||
|
></script>
|
||||||
|
</head>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
@ -1,66 +1,75 @@
|
||||||
<html>
<head>
|
<html>
|
||||||
<script type="module" src="../scripts/external/jquery.js"></script>
|
|
||||||
<script type="module" src="../scripts/settings.js"></script>
|
<head>
|
||||||
<title data-text="term_preferences"></title>
|
<script type="module" src="../scripts/external/jquery.js"></script>
|
||||||
|
<script type="module" src="../scripts/pages/settings.js"></script>
|
||||||
|
|
||||||
|
<title data-text="term_preferences"></title>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<main class="window-body has-space">
|
<main class="window-body has-space">
|
||||||
<menu role="tablist" for="settings_content">
|
<menu role="tablist" for="settings_content">
|
||||||
<button role="tab" for="settings" data-text="general"></button>
|
<button role="tab" for="settings" data-text="general"></button>
|
||||||
<button role="tab" for="filters" data-text="filters"></button>
|
<button role="tab" for="filters" data-text="filters"></button>
|
||||||
<button role="tab" for="storage" data-text="storage"></button>
|
<button role="tab" for="storage" data-text="storage"></button>
|
||||||
<button role="tab" for="about" data-text="about"></button>
|
<button role="tab" for="about" data-text="about"></button>
|
||||||
</menu>
|
</menu>
|
||||||
<section class="view_main" id="settings_content">
|
<section class="view_main" id="settings_content">
|
||||||
<section role="tabpanel" id="settings">
|
<section role="tabpanel" id="settings">
|
||||||
<fieldset>
|
<fieldset>
|
||||||
<legend data-text="general"></legend>
|
<legend data-text="general"></legend>
|
||||||
<form class="field-row">
|
<form class="field-row">
|
||||||
<input type="checkbox" id="settings_general_showApplicable" data-store="settings,general,showApplicable">
|
<input type="checkbox" id="settings_general_showApplicable"
|
||||||
<label for="settings_general_showApplicable" data-text="settings_general_showApplicable"></label>
|
data-store="settings,general,showApplicable">
|
||||||
</form>
|
<label for="settings_general_showApplicable"
|
||||||
<form class="field-row">
|
data-text="settings_general_showApplicable"></label>
|
||||||
<input type="checkbox" id="settings_general_injectToPage" data-store="settings,general,injectToPage">
|
</form>
|
||||||
<label for="settings_general_injectToPage" data-text="settings_general_injectToPage"></label>
|
<form class="field-row">
|
||||||
</form>
|
<input type="checkbox" id="settings_general_injectToPage"
|
||||||
</fieldset>
|
data-store="settings,general,injectToPage">
|
||||||
<fieldset>
|
<label for="settings_general_injectToPage" data-text="settings_general_injectToPage"></label>
|
||||||
<legend data-text="behavior"></legend>
|
</form>
|
||||||
<form class="field-row">
|
</fieldset>
|
||||||
<input type="checkbox" id="settings_behavior_autoRun" data-store="settings,behavior,autoRun">
|
<fieldset>
|
||||||
<label for="settings_behavior_autoRun" data-text="settings_behavior_autoRun"></label>
|
<legend data-text="behavior"></legend>
|
||||||
</form>
|
<form class="field-row">
|
||||||
</fielset>
|
<input type="checkbox" id="settings_behavior_autoRun" data-store="settings,behavior,autoRun">
|
||||||
</section>
|
<label for="settings_behavior_autoRun" data-text="settings_behavior_autoRun"></label>
|
||||||
<section role="tabpanel" id="filters">
|
</form>
|
||||||
<fieldset>
|
</fielset>
|
||||||
<legend data-text="filters"></legend>
|
</section>
|
||||||
<label data-text="settings_filters_description"></label>
|
<section role="tabpanel" id="filters">
|
||||||
<div class="field-row action-buttons">
|
<fieldset>
|
||||||
<button data-action="filters,update" data-text="settings_filters_update"></button>
|
<legend data-text="filters"></legend>
|
||||||
<button data-action="open,settings,filters" data-text="settings_filters_open"></button>
|
<label data-text="settings_filters_description"></label>
|
||||||
</div>
|
<div class="field-row action-buttons">
|
||||||
</fieldset>
|
<button data-action="filters,update" data-text="settings_filters_update"></button>
|
||||||
</section>
|
<button data-action="open,settings,filters" data-text="settings_filters_open"></button>
|
||||||
<section role="tabpanel" id="storage">
|
</div>
|
||||||
<fieldset>
|
</fieldset>
|
||||||
<legend data-text="storage"></legend>
|
</section>
|
||||||
<label data-text="settings_storage_description"></label>
|
<section role="tabpanel" id="storage">
|
||||||
<div class="field-row action-buttons">
|
<fieldset>
|
||||||
<button data-text="settings_storage_clear" data-action="storage,clear"></button>
|
<legend data-text="storage"></legend>
|
||||||
</div>
|
<label data-text="settings_storage_description"></label>
|
||||||
</fieldset>
|
<div class="field-row action-buttons">
|
||||||
</section>
|
<button data-text="settings_storage_clear" data-action="storage,clear"></button>
|
||||||
<section role="tabpanel" id="about">
|
</div>
|
||||||
<img data-image="about_app_logo" />
|
</fieldset>
|
||||||
<p data-text="extension_name"></p>
|
</section>
|
||||||
<p data-text="GUI_status_version"></p>
|
<section role="tabpanel" id="about">
|
||||||
<p data-text="extension_description"></p>
|
<img data-image="about_app_logo" />
|
||||||
<div class="field-row action-buttons">
|
<p data-text="extension_name"></p>
|
||||||
<button data-text="help" data-action="open,help"></button>
|
<p data-text="GUI_status_version"></p>
|
||||||
</div>
|
<p data-text="extension_description"></p>
|
||||||
</section>
|
<div class="field-row action-buttons">
|
||||||
</section>
|
<button data-text="help" data-action="open,help"></button>
|
||||||
</main>
|
</div>
|
||||||
</div>
|
</section>
|
||||||
</body></html>
|
</section>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
|
|
|
@ -3,22 +3,20 @@
|
||||||
*/
|
*/
|
||||||
|
|
||||||
// Import modules.
|
// Import modules.
|
||||||
import texts from './read.JS';
|
import windowman from "../windowman.js";
|
||||||
import windowman from './windowman.JS';
|
|
||||||
let secretariat = await import(chrome.runtime.getURL("scripts/secretariat.js"));
|
let secretariat = await import(chrome.runtime.getURL("scripts/secretariat.js"));
|
||||||
|
|
||||||
|
|
||||||
function start() {
|
function start() {
|
||||||
windowman.prepare();
|
windowman.prepare();
|
||||||
}
|
}
|
||||||
/* Populate the strings on the page. */
|
/* Populate the strings on the page. */
|
||||||
function say(element) {
|
function say(element) {
|
||||||
// document.title
|
// document.title
|
||||||
}
|
}
|
||||||
|
|
||||||
function main() {
|
function main() {
|
||||||
let tab = start();
|
let tab = start();
|
||||||
say(tab);
|
say(tab);
|
||||||
}
|
}
|
||||||
|
|
||||||
main();
|
main();
|
61
gui/scripts/pages/settings.js
Normal file
61
gui/scripts/pages/settings.js
Normal file
|
@ -0,0 +1,61 @@
|
||||||
|
/* Settings.js
|
||||||
|
Build the interface for the settings
|
||||||
|
*/
|
||||||
|
|
||||||
|
// Import modules.
|
||||||
|
import { windowman } from "../windowman.js";
|
||||||
|
let secretariat = await import(chrome.runtime.getURL("scripts/secretariat.js"));
|
||||||
|
|
||||||
|
// Import configuration file.
|
||||||
|
// const config = chrome.runtime.getURL('gui/layouts/settings.json');
|
||||||
|
|
||||||
|
let pref_pane = 0;
|
||||||
|
|
||||||
|
function start() {
|
||||||
|
windowman.prepare();
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Generate the appropriate strings. */
|
||||||
|
function say() {
|
||||||
|
windowman.fill();
|
||||||
|
}
|
||||||
|
|
||||||
|
/*
|
||||||
|
Arrange the interface.
|
||||||
|
*/
|
||||||
|
function arrange() {
|
||||||
|
async function click() {
|
||||||
|
let last_opened = (
|
||||||
|
await Promise.all([secretariat.read([`view`, window.location.href], 1)])
|
||||||
|
)[0];
|
||||||
|
if (!last_opened) {
|
||||||
|
last_opened = "settings";
|
||||||
|
}
|
||||||
|
|
||||||
|
document.querySelector(`[role="tab"][for="${last_opened}"]`).click();
|
||||||
|
}
|
||||||
|
|
||||||
|
// click!
|
||||||
|
// document.querySelector(`menu button[role="tab"][aria-controls="${last_opened}"]`).click();
|
||||||
|
click();
|
||||||
|
}
|
||||||
|
|
||||||
|
/*
|
||||||
|
Define the mapping of each button.
|
||||||
|
*/
|
||||||
|
function events() {
|
||||||
|
windowman.events();
|
||||||
|
}
|
||||||
|
|
||||||
|
function main() {
|
||||||
|
let tab = start();
|
||||||
|
say();
|
||||||
|
events();
|
||||||
|
|
||||||
|
arrange();
|
||||||
|
|
||||||
|
/*arrange();
|
||||||
|
events();*/
|
||||||
|
}
|
||||||
|
|
||||||
|
main();
|
|
@ -1,184 +0,0 @@
|
||||||
/* Settings.js
|
|
||||||
Build the interface for the settings
|
|
||||||
*/
|
|
||||||
|
|
||||||
// Import modules.
|
|
||||||
import texts from './read.JS';
|
|
||||||
import {windowman} from './windowman.JS';
|
|
||||||
let secretariat = await import(chrome.runtime.getURL("scripts/secretariat.js"));
|
|
||||||
|
|
||||||
// Import configuration file.
|
|
||||||
// const config = chrome.runtime.getURL('gui/layouts/settings.json');
|
|
||||||
|
|
||||||
let pref_pane = 0;
|
|
||||||
|
|
||||||
|
|
||||||
function start() {
|
|
||||||
windowman.prepare();
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Generate the appropriate strings. */
|
|
||||||
function say() {
|
|
||||||
windowman.fill();
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Add the UI design. */
|
|
||||||
//function design(element) {
|
|
||||||
// Set the event of the window.
|
|
||||||
/*function controls() {
|
|
||||||
document.getElementById(element[`titlebar`][`controls`][`Close`][`ID`]).onclick = function(){element.terminate(false)};
|
|
||||||
}
|
|
||||||
|
|
||||||
function menu() {
|
|
||||||
element.inject(null, 'navbar', element[`content`], `menu`, null, null, {'role': 'tablist'})
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Add the content. */
|
|
||||||
/*function content() {
|
|
||||||
let page_layout = jsonData;
|
|
||||||
|
|
||||||
windowman_builder.tabs(Object.keys(page_layout));
|
|
||||||
|
|
||||||
function tabs(tab_names, parent_element) {
|
|
||||||
(tab_names).forEach((tab_name) => {
|
|
||||||
// Create the elements for each tab content.
|
|
||||||
let inserted_element = element.inject(texts.localized(`term_`.concat(tab_name)), texts.localized(`term_`.concat(tab_name)), element[`content`], `section`, null, null, {'role': `tabpanel`});
|
|
||||||
|
|
||||||
// Create the menu elements.
|
|
||||||
element.inject(texts.localized(`term_`.concat(tab_name)), texts.localized(`term_`.concat(tab_name)), element[`content`][`navbar`], `button`, null, null, {'aria-controls': inserted_element});
|
|
||||||
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
/*
|
|
||||||
Add each item for each preference page, but do not fill in their default preferences.
|
|
||||||
|
|
||||||
@param {dictionary} layout the layout
|
|
||||||
*//*
|
|
||||||
function eachItem(layout) {
|
|
||||||
(layout).forEach((tab) => {
|
|
||||||
// let inserted_element = element.inject(texts.localized(`term_`.concat(tab_name)), texts.localized(`term_`.concat(tab_name)), element[`content`], `section`, null, null, {'role': `tabpanel`});
|
|
||||||
let current_tab = element[`content`][`navbar`][texts.localized(`term_`.concat(tab_name))];
|
|
||||||
|
|
||||||
(Object.keys(current_tab)).forEach((element_item) => {
|
|
||||||
|
|
||||||
})
|
|
||||||
|
|
||||||
// element.update(element[`content`][`navbar`][texts.localized(`term_`.concat(tab_name))], texts.localized(`term_`.concat(tab_name)));
|
|
||||||
// Create the elements for each tab content.
|
|
||||||
element.inject(texts.localized(`term_`.concat(tab)), texts.localized(`term_`.concat(tab_name)), element[`content`], `section`, null, null, {'role': `tabpanel`});
|
|
||||||
|
|
||||||
// Create the menu elements.
|
|
||||||
element.inject(texts.localized(`term_`.concat(tab_name)), texts.localized(`term_`.concat(tab_name)), element[`content`][`navbar`], `button`, null, null, {'aria-controls': inserted_element});
|
|
||||||
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
tabs(Object.keys(page_layout));
|
|
||||||
}
|
|
||||||
|
|
||||||
function action_buttons() {
|
|
||||||
element.inject(`action_buttons`, `footer`, element[`content`], `footer`, [`field-row`], null, {'style': 'justify-content: flex-end'});
|
|
||||||
|
|
||||||
let button_names = ['apply', 'cancel'];
|
|
||||||
|
|
||||||
(button_names).forEach((button_name) => {
|
|
||||||
// Create the elements for each tab content.
|
|
||||||
element.inject(null, texts.localized(`term_`.concat(button_name)), element[`content`][`footer`], `button`);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
controls();
|
|
||||||
menu();
|
|
||||||
content();
|
|
||||||
action_buttons();
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Populate the strings on the page. */
|
|
||||||
/*function say(element) {
|
|
||||||
document.title = texts.localized(`GUI_title_preferences`);
|
|
||||||
element.update(element[`titlebar`][`title`], texts.localized(`GUI_title_preferences`));
|
|
||||||
|
|
||||||
|
|
||||||
function content() {
|
|
||||||
fetch(config)
|
|
||||||
.then((response) => response.json())
|
|
||||||
.then((jsonData) => {
|
|
||||||
let page_layout = jsonData;
|
|
||||||
|
|
||||||
function tabs(tab_names) {
|
|
||||||
(tab_names).forEach((tab_name) => {
|
|
||||||
// Create the elements for each tab content.
|
|
||||||
element.update(element[`content`][`navbar`][texts.localized(`term_`.concat(tab_name))], texts.localized(`term_`.concat(tab_name)));
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
tabs(Object.keys(page_layout));
|
|
||||||
})
|
|
||||||
.catch((error) => {
|
|
||||||
console.error(error);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// Controls
|
|
||||||
/*
|
|
||||||
let tab_names = ['preferences', 'filters', 'about'];
|
|
||||||
(tab_names).forEach((tab_name) => {
|
|
||||||
element.update(element[`content`][`navbar`][texts.localized(`term_`.concat(tab_name))], texts.localized(`term_`.concat(tab_name)));
|
|
||||||
});
|
|
||||||
|
|
||||||
function action_buttons() {
|
|
||||||
let button_names = ['apply', 'cancel'];
|
|
||||||
|
|
||||||
(button_names).forEach((button_name) => {
|
|
||||||
// Create the elements for each tab content.
|
|
||||||
element.update(element[`content`][`footer`][texts.localized(`term_`.concat(button_name))], texts.localized(`term_`.concat(button_name)));
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
content();
|
|
||||||
action_buttons();
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
*/
|
|
||||||
|
|
||||||
/*
|
|
||||||
Arrange the interface.
|
|
||||||
*/
|
|
||||||
function arrange() {
|
|
||||||
async function click() {
|
|
||||||
let last_opened = (await Promise.all([secretariat.read([`view`, window.location.href], 1)]))[0];
|
|
||||||
if (!last_opened) {last_opened = 'settings'};
|
|
||||||
|
|
||||||
document.querySelector(`[role="tab"][for="${last_opened}"]`).click();
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// click!
|
|
||||||
// document.querySelector(`menu button[role="tab"][aria-controls="${last_opened}"]`).click();
|
|
||||||
click();
|
|
||||||
}
|
|
||||||
|
|
||||||
/*
|
|
||||||
Define the mapping of each button.
|
|
||||||
*/
|
|
||||||
function events() {
|
|
||||||
windowman.events();
|
|
||||||
};
|
|
||||||
|
|
||||||
function main() {
|
|
||||||
let tab = start();
|
|
||||||
say();
|
|
||||||
events();
|
|
||||||
|
|
||||||
arrange();
|
|
||||||
|
|
||||||
|
|
||||||
/*arrange();
|
|
||||||
events();*/
|
|
||||||
}
|
|
||||||
|
|
||||||
main();
|
|
Loading…
Add table
Add a link
Reference in a new issue