major moving around of files
This commit is contained in:
		
							parent
							
								
									4686f89010
								
							
						
					
					
						commit
						8f0f7fb923
					
				
					 15 changed files with 303 additions and 240 deletions
				
			
		
							
								
								
									
										5
									
								
								gui/pages/open/popup.htm
									
										
									
									
									
										Normal file
									
								
							
							
						
						
									
										5
									
								
								gui/pages/open/popup.htm
									
										
									
									
									
										Normal file
									
								
							|  | @ -0,0 +1,5 @@ | ||||||
|  | <html> | ||||||
|  |   <head> | ||||||
|  |     <script src="../../scripts/pages/open/popup.JS" type="module"></script> | ||||||
|  |   </head> | ||||||
|  | </html> | ||||||
							
								
								
									
										5
									
								
								gui/pages/open/settings.htm
									
										
									
									
									
										Normal file
									
								
							
							
						
						
									
										5
									
								
								gui/pages/open/settings.htm
									
										
									
									
									
										Normal file
									
								
							|  | @ -0,0 +1,5 @@ | ||||||
|  | <html> | ||||||
|  |   <head> | ||||||
|  |         <script src="../../scripts/pages/open/settings.JS" type="module"></script> | ||||||
|  |   </head> | ||||||
|  | </html> | ||||||
							
								
								
									
										70
									
								
								gui/pages/settings.htm
									
										
									
									
									
										Normal file
									
								
							
							
						
						
									
										70
									
								
								gui/pages/settings.htm
									
										
									
									
									
										Normal file
									
								
							|  | @ -0,0 +1,70 @@ | ||||||
|  | <html>
<head> | ||||||
|  | 	<script type="module" src="../scripts/external/jquery.js"></script> | ||||||
|  | 	<script type="module" src="../scripts/settings.js"></script> | ||||||
|  | </head> | ||||||
|  | <body> | ||||||
|  | 	<main class="window-body has-space"> | ||||||
|  | 		<menu role="tablist"> | ||||||
|  |   		<button role="tab" aria-controls="settings" data-text="general"></button> | ||||||
|  |   		<button role="tab" aria-controls="filters" data-text="filters"></button> | ||||||
|  |   		<button role="tab" aria-controls="storage" data-text="storage"></button> | ||||||
|  | 			<button role="tab" aria-controls="about" data-text="about"></button> | ||||||
|  | 		</menu> | ||||||
|  | 		<section class="view_main"> | ||||||
|  | 			<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,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> | ||||||
|  | 		<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> | ||||||
|  | 		<footer class="field-row action-buttons"> | ||||||
|  | 			<button class="default" data-text="apply" data-action="action,discard"></button> | ||||||
|  |       <button data-text="cancel" data-action="action,discard"></button> | ||||||
|  | 		</footer> | ||||||
|  | 	</main> | ||||||
|  | 	</div> | ||||||
|  | </body></html> | ||||||
							
								
								
									
										0
									
								
								gui/pages/settings/filters.htm
									
										
									
									
									
										Normal file
									
								
							
							
						
						
									
										0
									
								
								gui/pages/settings/filters.htm
									
										
									
									
									
										Normal file
									
								
							|  | @ -1,4 +1,3 @@ | ||||||
| <html>
<head> | <html>
<head> | ||||||
|   <script type="module" src="scripts/external/jquery.js"></script> |    | ||||||
|   <script type="module" src="scripts/popup.js">
</script> |  | ||||||
| </head></html> | </head></html> | ||||||
|  |  | ||||||
|  | @ -1,5 +0,0 @@ | ||||||
| <html> |  | ||||||
|   <head> |  | ||||||
|     <script src="scripts/popup_r.JS" type="module"></script> |  | ||||||
|   </head> |  | ||||||
| </html> |  | ||||||
|  | @ -1,7 +1,7 @@ | ||||||
| import {windowman} from './windowman.JS'; | import {windowman} from '../../windowman.JS'; | ||||||
| 
 | 
 | ||||||
| function redirect() { | function redirect() { | ||||||
|   new windowman(`gui/popup.htm`); |   new windowman(`gui/pages/settings.htm`); | ||||||
| 
 | 
 | ||||||
|   window.close(); |   window.close(); | ||||||
| } | } | ||||||
|  | @ -1,9 +1,9 @@ | ||||||
| // Open the settings in a pop-up window.
 | // Open the settings in a pop-up window.
 | ||||||
| 
 | 
 | ||||||
| import {windowman} from './windowman.JS'; | import {windowman} from '../../windowman.JS'; | ||||||
| 
 | 
 | ||||||
| function redirect() { | function redirect() { | ||||||
|   new windowman(`gui/settings.htm`); |   new windowman(`gui/pages/settings.htm`); | ||||||
| 
 | 
 | ||||||
|   window.close(); |   window.close(); | ||||||
| } | } | ||||||
|  | @ -5,49 +5,20 @@ | ||||||
| // Import modules.
 | // Import modules.
 | ||||||
| import texts from './read.JS'; | 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")); | ||||||
| 
 | 
 | ||||||
| 
 | 
 | ||||||
|      // Import modules.
 | function start() { | ||||||
|      let secretariat = await import(chrome.runtime.getURL("scripts/secretariat.js")); | 	windowman.prepare(); | ||||||
|       | } | ||||||
|      let pref_pane = 0; | /* Populate the strings on the page. */ | ||||||
| 
 | function say(element) { | ||||||
| 
 | 	// document.title
 | ||||||
|      function start() { | } | ||||||
|           windowman.prepare(); |  | ||||||
| 
 |  | ||||||
|           return(new windowman(`body`, null, null, {'Close': true})); |  | ||||||
|      } |  | ||||||
| 
 |  | ||||||
|      /* 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)}; |  | ||||||
|           } |  | ||||||
| 
 |  | ||||||
| 
 |  | ||||||
|            |  | ||||||
| 
 |  | ||||||
|           // TODO work on the content; perhaps, it must read from JSON of valid prefs
 |  | ||||||
| 
 |  | ||||||
|           controls(); |  | ||||||
| 
 |  | ||||||
|      } |  | ||||||
| 
 |  | ||||||
|      /* Populate the strings on the page. */ |  | ||||||
|      function say(element) { |  | ||||||
|           element.update(element[`titlebar`][`title`], texts.localized(`GUI_title_preferences`)); |  | ||||||
| 
 |  | ||||||
|      }; |  | ||||||
| 
 |  | ||||||
|      function main() { |  | ||||||
|           let tab = start(); |  | ||||||
|           design(tab); |  | ||||||
|           say(tab); |  | ||||||
|      } |  | ||||||
| 
 |  | ||||||
|      main(); |  | ||||||
| 
 |  | ||||||
| 
 | 
 | ||||||
|  | function main() { | ||||||
|  | 	let tab = start(); | ||||||
|  | 	say(tab); | ||||||
|  | } | ||||||
| 
 | 
 | ||||||
|  | main(); | ||||||
|  |  | ||||||
|  | @ -4,32 +4,37 @@ | ||||||
| let messages = {}; | let messages = {}; | ||||||
| let message = ""; | let message = ""; | ||||||
| 
 | 
 | ||||||
| 
 |  | ||||||
| 
 |  | ||||||
| export default class texts { | export default class texts { | ||||||
|   static localized (message_name, params = []) { |   /* This reads the message from its source. This is a fallback for the content scripts, who doesn't appear to read classes. | ||||||
|  | 
 | ||||||
|  |   @param {string} message the message name | ||||||
|  |   @param {boolean} autofill fill in the message with the template name when not found | ||||||
|  |   @param {list} params the parameters | ||||||
|  |   @return {string} the message | ||||||
|  |   */ | ||||||
|  | 
 | ||||||
|  |   static localized (message_name, autofill = false, params = []) { | ||||||
|     if (params) { |     if (params) { | ||||||
|       message = chrome.i18n.getMessage(message_name, params); |       message = chrome.i18n.getMessage(message_name, params); | ||||||
|     } else { |     } else { | ||||||
|       message = chrome.i18n.getMessage(message_name); |       message = chrome.i18n.getMessage(message_name); | ||||||
|     } |     } | ||||||
| 
 | 
 | ||||||
|  |     // When the message is not found, return the temporary text.
 | ||||||
|  |     if (!message && autofill) { | ||||||
|  |       message = message_name; | ||||||
|  |     } | ||||||
|  | 
 | ||||||
|     return(message); |     return(message); | ||||||
|   } |   } | ||||||
| } | } | ||||||
| 
 | 
 | ||||||
| /* This reads the message from its source. This is a fallback for the content scripts, who doesn't appear to read classes. |  | ||||||
| 
 | 
 | ||||||
| @param {string} source the source name, with accepted parameters "localized" and "fallback" |  | ||||||
| @param {string} message the message name |  | ||||||
| @return {string} the message |  | ||||||
| */ |  | ||||||
| export function read(message_name, params) { | export function read(message_name, params) { | ||||||
| 
 | 
 | ||||||
|   let message; |   let message; | ||||||
| 
 | 
 | ||||||
|     message = texts.localized(message_name, params); |   message = texts.localized(message_name, params); | ||||||
|     break; |  | ||||||
| 
 | 
 | ||||||
|   return (message); |   return (message); | ||||||
| 
 | 
 | ||||||
|  |  | ||||||
|  | @ -1,104 +1,173 @@ | ||||||
| /* Settings.js | /* Settings.js | ||||||
|   Build the interface for the settings | 	Build the interface for the settings | ||||||
| */ | */ | ||||||
| 
 | 
 | ||||||
| // Import modules.
 | // Import modules.
 | ||||||
| import texts from './read.JS'; | 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"));
 | ||||||
|  | 
 | ||||||
|  | // Import configuration file.
 | ||||||
|  | // const config = chrome.runtime.getURL('gui/layouts/settings.json');
 | ||||||
|  | 
 | ||||||
|  | let pref_pane = 0; | ||||||
| 
 | 
 | ||||||
| 
 | 
 | ||||||
|      // Import modules.
 | function start() { | ||||||
|      let secretariat = await import(chrome.runtime.getURL("scripts/secretariat.js")); | 	windowman.prepare(); | ||||||
|  | } | ||||||
| 
 | 
 | ||||||
|      let pref_pane = 0; | /* 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}); | ||||||
|  | 
 | ||||||
|  | 					}); | ||||||
|  | 				} | ||||||
| 
 | 
 | ||||||
| 
 | 
 | ||||||
|      function start() { | 				tabs(Object.keys(page_layout)); | ||||||
|           windowman.prepare(); | 			} | ||||||
| 
 | 
 | ||||||
|           return(new windowman(`body`, null, null, {'Close': true})); | 			function action_buttons() { | ||||||
|      } | 				 element.inject(`action_buttons`, `footer`, element[`content`], `footer`, [`field-row`], null, {'style': 'justify-content: flex-end'}); | ||||||
| 
 | 
 | ||||||
|      /* Add the UI design. */ | 				 let button_names = ['apply', 'cancel']; | ||||||
|      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() { | 				 (button_names).forEach((button_name) => { | ||||||
|                element.inject(null, 'navbar', element[`content`], `menu`, null, null, {'role': 'tablist'}) | 						// Create the elements for each tab content.
 | ||||||
|           } | 						element.inject(null, texts.localized(`term_`.concat(button_name)), element[`content`][`footer`], `button`); | ||||||
|  | 				 }); | ||||||
|  | 			} | ||||||
| 
 | 
 | ||||||
|           function tabs() { | 			controls(); | ||||||
|                let tab_names = ['preferences', 'filters', 'about']; | 			menu(); | ||||||
|  | 			content(); | ||||||
|  | 			action_buttons(); | ||||||
|  | 		} | ||||||
| 
 | 
 | ||||||
|                (tab_names).forEach((tab_name) => { | 		/* Populate the strings on the page. */ | ||||||
|                     // Create the elements for each tab content. 	
 | 		/*function say(element) { | ||||||
|                     let inserted_element = element.inject(texts.localized(`term_`.concat(tab_name)), texts.localized(`term_`.concat(tab_name)), element[`content`], `section`, null, null, {'role': `tabpanel`}); | 			document.title = texts.localized(`GUI_title_preferences`); | ||||||
| 
 | 			element.update(element[`titlebar`][`title`], texts.localized(`GUI_title_preferences`)); | ||||||
|                     // 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}); |  | ||||||
|                      |  | ||||||
|                }); |  | ||||||
|           } |  | ||||||
| 
 |  | ||||||
|           function action_buttons() { |  | ||||||
|                element.inject(null, `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`); |  | ||||||
|                });                |  | ||||||
|           } |  | ||||||
| 
 |  | ||||||
|           // TODO work on the content; perhaps, it must read from JSON of valid prefs
 |  | ||||||
| 
 |  | ||||||
|           controls(); |  | ||||||
|           menu(); |  | ||||||
|           tabs(); |  | ||||||
|           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`)); |  | ||||||
| 
 |  | ||||||
|           // 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))); |  | ||||||
|                });                |  | ||||||
|           }; |  | ||||||
|            |  | ||||||
|           action_buttons(); |  | ||||||
|      }; |  | ||||||
| 
 |  | ||||||
|      function openLast() { |  | ||||||
|           let last_opened = 'Preferences'; |  | ||||||
|            |  | ||||||
|      } |  | ||||||
| 
 |  | ||||||
|      function main() { |  | ||||||
|           let tab = start(); |  | ||||||
|           design(tab); |  | ||||||
|           say(tab); |  | ||||||
|      } |  | ||||||
| 
 |  | ||||||
|      main(); |  | ||||||
| 
 | 
 | ||||||
| 
 | 
 | ||||||
|  | 			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() { | ||||||
|  | 			let last_opened = secretariat.read(`last`); | ||||||
|  | 			if (!last_opened) {last_opened = 'settings'}; | ||||||
|  | 
 | ||||||
|  | 			// click!
 | ||||||
|  | 			document.querySelector(`menu button[role="tab"][aria-controls="${last_opened}"]`).click(); | ||||||
|  | 
 | ||||||
|  | 		} | ||||||
|  | 
 | ||||||
|  | 		function events() { | ||||||
|  | 			 | ||||||
|  | 		}; | ||||||
|  | 
 | ||||||
|  | 		function main() { | ||||||
|  | 			let tab = start(); | ||||||
|  | 			say(); | ||||||
|  | 
 | ||||||
|  | 			document.addEventListener('DOMContentLoaded', function() { | ||||||
|  | 					arrange(); | ||||||
|  | 			}); | ||||||
|  | 		} | ||||||
|  | 
 | ||||||
|  | 		main(); | ||||||
|  |  | ||||||
|  | @ -6,17 +6,20 @@ import texts from "./read.JS"; | ||||||
| class windowman { | class windowman { | ||||||
|      /* Initialize the window frame. */ |      /* Initialize the window frame. */ | ||||||
| 	static prepare() { | 	static prepare() { | ||||||
|           try { |     try { | ||||||
|                let UI = {'library': chrome.runtime.getURL('gui/styles/interface.external.css'), 'script': chrome.runtime.getURL('gui/scripts/external/interface.external.js')}; |          let UI = {'library': [chrome.runtime.getURL('gui/styles/interface.external.css'), chrome.runtime.getURL('gui/styles/ui.css')], 'script': chrome.runtime.getURL('gui/scripts/external/interface.external.js')}; | ||||||
| 
 | 
 | ||||||
|                $(`head`).append(`<link rel="stylesheet" type="text/css" href="${UI.library}">`); | 				 (UI.library).forEach((source) => { | ||||||
|                $(`head`).append(`<script type="module" src="${UI.script}"></script>`); | 					 	$(`head`).append(`<link rel="stylesheet" type="text/css" href="${source}">`); | ||||||
|           } catch(error) { | 				 }) | ||||||
|                console.error(texts.localized(`error_fileNotFound`, [error])); |  | ||||||
|           } |  | ||||||
| 
 | 
 | ||||||
| 					// Prevent scaling, similar to a real window. 
 |          $(`head`).append(`<script type="module" src="${UI.script}"></script>`); | ||||||
| 					$(`head`).append(`<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />`); |     } catch(error) { | ||||||
|  |          console.error(texts.localized(`error_fileNotFound`, [error])); | ||||||
|  |     } | ||||||
|  | 
 | ||||||
|  | 		// Prevent scaling, similar to a real window.
 | ||||||
|  | 		$(`head`).append(`<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />`); | ||||||
| 	} | 	} | ||||||
| 
 | 
 | ||||||
| 
 | 
 | ||||||
|  | @ -28,6 +31,22 @@ class windowman { | ||||||
| 	    height: (height) ? height: 600, | 	    height: (height) ? height: 600, | ||||||
| 	  }); | 	  }); | ||||||
| 	} | 	} | ||||||
|  | 
 | ||||||
|  | 	static fill() { | ||||||
|  | 
 | ||||||
|  | 		function text() { | ||||||
|  | 			let text_elements = document.querySelectorAll("[data-text]"); | ||||||
|  | 
 | ||||||
|  | 			text_elements.forEach((text_element) => { | ||||||
|  | 				let text_inserted = texts.localized(text_element.getAttribute(`data-text`), (text_element.hasAttribute(`data-text-parameter`)) ? eval(text_element.getAttribute(`data-text-parameter`)) : null ); | ||||||
|  | 				if (!text_inserted) {text_inserted = texts.localized(`term_`.concat(text_element.getAttribute(`data-text`)));} | ||||||
|  | 
 | ||||||
|  | 				text_element.innerText = text_inserted; | ||||||
|  | 			}) | ||||||
|  | 		} | ||||||
|  | 
 | ||||||
|  | 		text(); | ||||||
|  | 	} | ||||||
| } | } | ||||||
| 
 | 
 | ||||||
| export {windowman}; | export {windowman}; | ||||||
|  |  | ||||||
|  | @ -1,70 +0,0 @@ | ||||||
| <html>
<head> |  | ||||||
| 	<script type="module" src="scripts/external/jquery.js"></script> |  | ||||||
| 	<script type="module" src="scripts/settings.js"></script> |  | ||||||
| </head> |  | ||||||
| <body> |  | ||||||
| 	<main class="window-body has-space"> |  | ||||||
| 		<menu role="tablist" aria-label="Window with Tabs"> |  | ||||||
|   		<button role="tab" aria-controls="settings"></button> |  | ||||||
|   		<button role="tab" aria-controls="filters"></button> |  | ||||||
|   		<button role="tab" aria-controls="storage"></button> |  | ||||||
| 			<button role="tab" aria-controls="about"></button> |  | ||||||
| 		</menu> |  | ||||||
| 		<section class="view_main"> |  | ||||||
| 			<section role="tabpanel" id="settings"> |  | ||||||
| 				<fieldset id="settings_general"> |  | ||||||
| 					<legend></legend> |  | ||||||
| 					<form class="field-row"> |  | ||||||
| 						<input type="checkbox" id="settings_general_showApplicable" data-store="settings,general,showApplicable"> |  | ||||||
| 	      		<label for="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"></label> |  | ||||||
| 					</form> |  | ||||||
| 				</fieldset> |  | ||||||
| 				<fieldset id="settings_behavior"> |  | ||||||
| 					<legend></legend> |  | ||||||
| 					<form class="field-row"> |  | ||||||
| 						<input type="checkbox" id="settings_behavior_autoRun" data-store="settings,behavior,autoRun"> |  | ||||||
| 		      	<label for="settings_behavior_autoRun"></label> |  | ||||||
| 					</form> |  | ||||||
| 				</fielset> |  | ||||||
| 			</section> |  | ||||||
| 			<section role="tabpanel" id="filters"> |  | ||||||
| 				<fieldset id="filters"> |  | ||||||
| 					<legend></legend> |  | ||||||
| 					<label data-name="settings_filters_description"></label> |  | ||||||
| 					<div class="field-row action-buttons"> |  | ||||||
| 						<button id="settings_filters_clear" data-action="filters,clear"></button> |  | ||||||
| 						<button id="settings_filters_open" data-action="open,filters"></button> |  | ||||||
| 					</div> |  | ||||||
| 				</fieldset> |  | ||||||
| 			</section> |  | ||||||
| 			<section role="tabpanel" id="storage"> |  | ||||||
| 				<fieldset id="storage"> |  | ||||||
| 					<legend></legend> |  | ||||||
| 					<label data-name="settings_storage_description"></label> |  | ||||||
| 					<div class="field-row action-buttons"> |  | ||||||
| 						<button id="settings_filters_clear" data-action="storage,clear"></button> |  | ||||||
| 					</div> |  | ||||||
| 				</fieldset> |  | ||||||
| 			</section> |  | ||||||
| 		</section> |  | ||||||
| 		<section role="tabpanel" id="about"> |  | ||||||
| 			<img id="about_app_logo" /> |  | ||||||
| 			<h1 data-text="manifest_name"></h1> |  | ||||||
| 			<p data-text="extension_version"></p> |  | ||||||
| 			<p data-text="extension_description"></p> |  | ||||||
| 			<div class="field-row action-buttons"> |  | ||||||
| 				<button data-action="open,help"></button> |  | ||||||
| 			</div> |  | ||||||
| 		</section> |  | ||||||
| 	</section> |  | ||||||
| 		<footer class="field-row action-buttons"> |  | ||||||
| 			<button class="default" id="apply">Apply</button> |  | ||||||
|       <button id="cancel">Cancel</button> |  | ||||||
| 		</footer> |  | ||||||
| 	</main> |  | ||||||
| 	</div> |  | ||||||
| </body></html> |  | ||||||
|  | @ -1,5 +0,0 @@ | ||||||
| <html> |  | ||||||
|   <head> |  | ||||||
|     <script src="scripts/settings_r.JS" type="module"></script> |  | ||||||
|   </head> |  | ||||||
| </html> |  | ||||||
|  | @ -1,14 +1,14 @@ | ||||||
| { | { | ||||||
| 	"manifest_version": 3, | 	"manifest_version": 3, | ||||||
| 	"name": "__MSG_manifest_name__", | 	"name": "__MSG_extension_name__", | ||||||
| 	"description": "__MSG_manifest_description__", | 	"description": "__MSG_extension_description__", | ||||||
| 	"version": "0", | 	"version": "0", | ||||||
| 
 | 
 | ||||||
| 	"permissions": [ "tabs", "activeTab", "storage", "unlimitedStorage"], | 	"permissions": [ "tabs", "activeTab", "storage", "unlimitedStorage"], | ||||||
| 
 | 
 | ||||||
| 	"action": { | 	"action": { | ||||||
| 	  "default_icon": "gui/icons/logo_no_tiny.png", | 	  "default_icon": "gui/icons/logo_no_tiny.png", | ||||||
|       "default_popup": "gui/popup.htm" |       "default_popup": "gui/pages/open/popup.htm" | ||||||
| 	}, | 	}, | ||||||
| 
 | 
 | ||||||
| 	"background": { | 	"background": { | ||||||
|  | @ -33,7 +33,7 @@ | ||||||
| 		"512": "gui/icons/logo_tiny.png" | 		"512": "gui/icons/logo_tiny.png" | ||||||
| 	}, | 	}, | ||||||
| 
 | 
 | ||||||
| 	"options_page": "gui/settings.htm", | 	"options_page": "gui/pages/open/settings.htm", | ||||||
| 
 | 
 | ||||||
| 	"default_locale": "en" | 	"default_locale": "en" | ||||||
| } | } | ||||||
|  |  | ||||||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue