move files to locations describing their function
This commit is contained in:
buzz-lightsnack-2007
parent
8a590a9bad
commit
89b22bccba
6 changed files with 148 additions and 261 deletions
|
|
@ -1,5 +1,5 @@
|
|||
<html>
|
||||
<head>
|
||||
<script src="../../scripts/pages/open/popup.JS" type="module"></script>
|
||||
</head>
|
||||
<head>
|
||||
<script src="../../scripts/pages/open/popup.js" type="module"></script>
|
||||
</head>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,8 @@
|
|||
<html>
|
||||
<head>
|
||||
<script src="../../scripts/pages/open/settings.JS" type="module"></script>
|
||||
</head>
|
||||
<head>
|
||||
<script
|
||||
src="../../scripts/pages/open/settings.js"
|
||||
type="module"
|
||||
></script>
|
||||
</head>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -1,66 +1,75 @@
|
|||
<html>
<head>
|
||||
<script type="module" src="../scripts/external/jquery.js"></script>
|
||||
<script type="module" src="../scripts/settings.js"></script>
|
||||
<title data-text="term_preferences"></title>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<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>
|
||||
|
||||
<body>
|
||||
<main class="window-body has-space">
|
||||
<menu role="tablist" for="settings_content">
|
||||
<button role="tab" for="settings" data-text="general"></button>
|
||||
<button role="tab" for="filters" data-text="filters"></button>
|
||||
<button role="tab" for="storage" data-text="storage"></button>
|
||||
<button role="tab" for="about" data-text="about"></button>
|
||||
</menu>
|
||||
<section class="view_main" id="settings_content">
|
||||
<section role="tabpanel" id="settings">
|
||||
<fieldset>
|
||||
<legend data-text="general"></legend>
|
||||
<form class="field-row">
|
||||
<input type="checkbox" id="settings_general_showApplicable" data-store="settings,general,showApplicable">
|
||||
<label for="settings_general_showApplicable" data-text="settings_general_showApplicable"></label>
|
||||
</form>
|
||||
<form class="field-row">
|
||||
<input type="checkbox" id="settings_general_injectToPage" data-store="settings,general,injectToPage">
|
||||
<label for="settings_general_injectToPage" data-text="settings_general_injectToPage"></label>
|
||||
</form>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend data-text="behavior"></legend>
|
||||
<form class="field-row">
|
||||
<input type="checkbox" id="settings_behavior_autoRun" data-store="settings,behavior,autoRun">
|
||||
<label for="settings_behavior_autoRun" data-text="settings_behavior_autoRun"></label>
|
||||
</form>
|
||||
</fielset>
|
||||
</section>
|
||||
<section role="tabpanel" id="filters">
|
||||
<fieldset>
|
||||
<legend data-text="filters"></legend>
|
||||
<label data-text="settings_filters_description"></label>
|
||||
<div class="field-row action-buttons">
|
||||
<button data-action="filters,update" data-text="settings_filters_update"></button>
|
||||
<button data-action="open,settings,filters" data-text="settings_filters_open"></button>
|
||||
</div>
|
||||
</fieldset>
|
||||
</section>
|
||||
<section role="tabpanel" id="storage">
|
||||
<fieldset>
|
||||
<legend data-text="storage"></legend>
|
||||
<label data-text="settings_storage_description"></label>
|
||||
<div class="field-row action-buttons">
|
||||
<button data-text="settings_storage_clear" data-action="storage,clear"></button>
|
||||
</div>
|
||||
</fieldset>
|
||||
</section>
|
||||
<section role="tabpanel" id="about">
|
||||
<img data-image="about_app_logo" />
|
||||
<p data-text="extension_name"></p>
|
||||
<p data-text="GUI_status_version"></p>
|
||||
<p data-text="extension_description"></p>
|
||||
<div class="field-row action-buttons">
|
||||
<button data-text="help" data-action="open,help"></button>
|
||||
</div>
|
||||
</section>
|
||||
</section>
|
||||
</main>
|
||||
</div>
|
||||
</body></html>
|
||||
<main class="window-body has-space">
|
||||
<menu role="tablist" for="settings_content">
|
||||
<button role="tab" for="settings" data-text="general"></button>
|
||||
<button role="tab" for="filters" data-text="filters"></button>
|
||||
<button role="tab" for="storage" data-text="storage"></button>
|
||||
<button role="tab" for="about" data-text="about"></button>
|
||||
</menu>
|
||||
<section class="view_main" id="settings_content">
|
||||
<section role="tabpanel" id="settings">
|
||||
<fieldset>
|
||||
<legend data-text="general"></legend>
|
||||
<form class="field-row">
|
||||
<input type="checkbox" id="settings_general_showApplicable"
|
||||
data-store="settings,general,showApplicable">
|
||||
<label for="settings_general_showApplicable"
|
||||
data-text="settings_general_showApplicable"></label>
|
||||
</form>
|
||||
<form class="field-row">
|
||||
<input type="checkbox" id="settings_general_injectToPage"
|
||||
data-store="settings,general,injectToPage">
|
||||
<label for="settings_general_injectToPage" data-text="settings_general_injectToPage"></label>
|
||||
</form>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend data-text="behavior"></legend>
|
||||
<form class="field-row">
|
||||
<input type="checkbox" id="settings_behavior_autoRun" data-store="settings,behavior,autoRun">
|
||||
<label for="settings_behavior_autoRun" data-text="settings_behavior_autoRun"></label>
|
||||
</form>
|
||||
</fielset>
|
||||
</section>
|
||||
<section role="tabpanel" id="filters">
|
||||
<fieldset>
|
||||
<legend data-text="filters"></legend>
|
||||
<label data-text="settings_filters_description"></label>
|
||||
<div class="field-row action-buttons">
|
||||
<button data-action="filters,update" data-text="settings_filters_update"></button>
|
||||
<button data-action="open,settings,filters" data-text="settings_filters_open"></button>
|
||||
</div>
|
||||
</fieldset>
|
||||
</section>
|
||||
<section role="tabpanel" id="storage">
|
||||
<fieldset>
|
||||
<legend data-text="storage"></legend>
|
||||
<label data-text="settings_storage_description"></label>
|
||||
<div class="field-row action-buttons">
|
||||
<button data-text="settings_storage_clear" data-action="storage,clear"></button>
|
||||
</div>
|
||||
</fieldset>
|
||||
</section>
|
||||
<section role="tabpanel" id="about">
|
||||
<img data-image="about_app_logo" />
|
||||
<p data-text="extension_name"></p>
|
||||
<p data-text="GUI_status_version"></p>
|
||||
<p data-text="extension_description"></p>
|
||||
<div class="field-row action-buttons">
|
||||
<button data-text="help" data-action="open,help"></button>
|
||||
</div>
|
||||
</section>
|
||||
</section>
|
||||
</main>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -3,22 +3,20 @@
|
|||
*/
|
||||
|
||||
// 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"));
|
||||
|
||||
|
||||
function start() {
|
||||
windowman.prepare();
|
||||
windowman.prepare();
|
||||
}
|
||||
/* Populate the strings on the page. */
|
||||
function say(element) {
|
||||
// document.title
|
||||
// document.title
|
||||
}
|
||||
|
||||
function main() {
|
||||
let tab = start();
|
||||
say(tab);
|
||||
let tab = start();
|
||||
say(tab);
|
||||
}
|
||||
|
||||
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