create OOBE popup
This commit is contained in:
		
							parent
							
								
									dc5a2e91cd
								
							
						
					
					
						commit
						1e8db3dee4
					
				
					 2 changed files with 78 additions and 0 deletions
				
			
		
							
								
								
									
										26
									
								
								pages/popup/hello.htm
									
										
									
									
									
										Normal file
									
								
							
							
						
						
									
										26
									
								
								pages/popup/hello.htm
									
										
									
									
									
										Normal file
									
								
							|  | @ -0,0 +1,26 @@ | |||
| <html> | ||||
| 	<head> | ||||
| 		<title for="hello"></title> | ||||
| 		<script src="/scripts/pages/hello.js" type="module"></script> | ||||
| 		<script src="/styles/external/materialize/js/materialize.js"></script> | ||||
| 	</head> | ||||
| 	<body> | ||||
| 		<main class="container"> | ||||
| 			<ul class="collapsible"> | ||||
| 				<li id="OOBE_Hello"> | ||||
| 					<header class="collapsible-header waves-effect"><h1 for="hello" class="flow-text"></h1></header> | ||||
| 					<section class="collapsible-body"> | ||||
| 						<h2 for="GUI_welcome_headline" class="flow-text"></h2> | ||||
| 					</section> | ||||
| 				</li> | ||||
| 				<li id="OOBE_APISetup"> | ||||
| 					<header class="collapsible-header"><span for="OOBE_header_APISetup"></span></header> | ||||
| 					<section class="collapsible-body"> | ||||
| 
 | ||||
| 						<label id="tip" for="OOBE_tip_seeAgain"></label> | ||||
| 					</section> | ||||
| 				</li> | ||||
| 			</ul> | ||||
| 		</main> | ||||
| 	</body> | ||||
| </html> | ||||
							
								
								
									
										52
									
								
								scripts/pages/hello.js
									
										
									
									
									
										Normal file
									
								
							
							
						
						
									
										52
									
								
								scripts/pages/hello.js
									
										
									
									
									
										Normal file
									
								
							|  | @ -0,0 +1,52 @@ | |||
| /* | ||||
| 	hello.js | ||||
| 	Build the interface for the welcome and configuration page.  | ||||
| */ | ||||
| 
 | ||||
| // Import modules.
 | ||||
| import {global} from "/scripts/secretariat.js"; | ||||
| import Page from "/scripts/pages/page.js"; | ||||
| import texts from "/scripts/mapping/read.js"; | ||||
| import filters from "/scripts/filters.js"; | ||||
| import logging from "/scripts/logging.js"; | ||||
| 
 | ||||
| class Page_MiniConfig extends Page { | ||||
| 	constructor () { | ||||
| 		super(); | ||||
| 		this.#get(); | ||||
| 		this.content(); | ||||
| 	}; | ||||
| 
 | ||||
| 	/* | ||||
| 	Get all elements needed for content(). | ||||
| 	*/ | ||||
| 	#get() { | ||||
| 		this.elements = (this.elements) ? this.elements : {}; | ||||
| 		this.elements[`1`] = (this.elements[`1`]) ? this.elements[`1`] : {}; | ||||
| 
 | ||||
| 		this.elements[`1`]["headline"] = document.querySelectorAll(`[for="GUI_welcome_headline"]`); | ||||
| 	} | ||||
| 
 | ||||
| 	/* | ||||
| 	Build the additional content for the page.  | ||||
| 	*/ | ||||
| 	content() { | ||||
| 		if (this.elements[`1`][`headline`].length) { | ||||
| 			let RANDOM = Math.floor(Math.random() * 2) + 1; | ||||
| 			(this.elements[`1`]["headline"]).forEach((ELEMENT) => { | ||||
| 				console.log(RANDOM, texts.localized(`OOBE_welcome_headline_`.concat(String(RANDOM)))); | ||||
| 				ELEMENT.textContent = texts.localized(`OOBE_welcome_headline_`.concat(String(RANDOM))); | ||||
| 			}); | ||||
| 		}; | ||||
| 	}; | ||||
| 
 | ||||
| 	/* | ||||
| 	Assist with navigation.  | ||||
| 	*/ | ||||
| 	navigate() { | ||||
| 		this.navigation = (this.navigation) ? this.navigation : {}; | ||||
| 		this.navigation.selection = (this.navigation.selection) ? this.navigation.selection : 0; | ||||
| 	} | ||||
| } | ||||
| 
 | ||||
| new Page_MiniConfig(); | ||||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue