11// Local js definitions:
22/* global addClass, getSettingValue, hasClass, searchState */
33/* global onEach, onEachLazy, removeClass */
4- /* global switchTheme, useSystemTheme */
54
65"use strict" ;
76
@@ -109,21 +108,11 @@ function getVirtualKey(ev) {
109108 return String . fromCharCode ( c ) ;
110109}
111110
112- const THEME_PICKER_ELEMENT_ID = "theme-picker" ;
113- const THEMES_ELEMENT_ID = "theme-choices" ;
114111const MAIN_ID = "main-content" ;
115112const SETTINGS_BUTTON_ID = "settings-menu" ;
116113const ALTERNATIVE_DISPLAY_ID = "alternative-display" ;
117114const NOT_DISPLAYED_ID = "not-displayed" ;
118115
119- function getThemesElement ( ) {
120- return document . getElementById ( THEMES_ELEMENT_ID ) ;
121- }
122-
123- function getThemePickerElement ( ) {
124- return document . getElementById ( THEME_PICKER_ELEMENT_ID ) ;
125- }
126-
127116function getSettingsButton ( ) {
128117 return document . getElementById ( SETTINGS_BUTTON_ID ) ;
129118}
@@ -133,74 +122,10 @@ function getNakedUrl() {
133122 return window . location . href . split ( "?" ) [ 0 ] . split ( "#" ) [ 0 ] ;
134123}
135124
136- function showThemeButtonState ( ) {
137- const themePicker = getThemePickerElement ( ) ;
138- const themeChoices = getThemesElement ( ) ;
139-
140- themeChoices . style . display = "block" ;
141- themePicker . style . borderBottomRightRadius = "0" ;
142- themePicker . style . borderBottomLeftRadius = "0" ;
143- }
144-
145- function hideThemeButtonState ( ) {
146- const themePicker = getThemePickerElement ( ) ;
147- const themeChoices = getThemesElement ( ) ;
148-
149- themeChoices . style . display = "none" ;
150- themePicker . style . borderBottomRightRadius = "3px" ;
151- themePicker . style . borderBottomLeftRadius = "3px" ;
152- }
153-
154125window . hideSettings = ( ) => {
155126 // Does nothing by default.
156127} ;
157128
158- // Set up the theme picker list.
159- ( function ( ) {
160- if ( ! document . location . href . startsWith ( "file:///" ) ) {
161- return ;
162- }
163- const themeChoices = getThemesElement ( ) ;
164- const themePicker = getThemePickerElement ( ) ;
165- const availableThemes = getVar ( "themes" ) . split ( "," ) ;
166-
167- removeClass ( themeChoices . parentElement , "hidden" ) ;
168-
169- function switchThemeButtonState ( ) {
170- if ( themeChoices . style . display === "block" ) {
171- hideThemeButtonState ( ) ;
172- } else {
173- showThemeButtonState ( ) ;
174- }
175- }
176-
177- function handleThemeButtonsBlur ( e ) {
178- const active = document . activeElement ;
179- const related = e . relatedTarget ;
180-
181- if ( active . id !== THEME_PICKER_ELEMENT_ID &&
182- ( ! active . parentNode || active . parentNode . id !== THEMES_ELEMENT_ID ) &&
183- ( ! related ||
184- ( related . id !== THEME_PICKER_ELEMENT_ID &&
185- ( ! related . parentNode || related . parentNode . id !== THEMES_ELEMENT_ID ) ) ) ) {
186- hideThemeButtonState ( ) ;
187- }
188- }
189-
190- themePicker . onclick = switchThemeButtonState ;
191- themePicker . onblur = handleThemeButtonsBlur ;
192- availableThemes . forEach ( item => {
193- const but = document . createElement ( "button" ) ;
194- but . textContent = item ;
195- but . onclick = ( ) => {
196- switchTheme ( window . currentTheme , window . mainTheme , item , true ) ;
197- useSystemTheme ( false ) ;
198- } ;
199- but . onblur = handleThemeButtonsBlur ;
200- themeChoices . appendChild ( but ) ;
201- } ) ;
202- } ( ) ) ;
203-
204129/**
205130 * This function inserts `newNode` after `referenceNode`. It doesn't work if `referenceNode`
206131 * doesn't have a parent node.
@@ -512,7 +437,7 @@ function loadCss(cssFileName) {
512437 ev . preventDefault ( ) ;
513438 }
514439 searchState . defocus ( ) ;
515- hideThemeButtonState ( ) ;
440+ window . hideSettings ( ) ;
516441 }
517442
518443 const disableShortcuts = getSettingValue ( "disable-shortcuts" ) === "true" ;
@@ -522,8 +447,6 @@ function loadCss(cssFileName) {
522447 return ;
523448 }
524449
525- let themePicker ;
526-
527450 if ( document . activeElement . tagName === "INPUT" ) {
528451 switch ( getVirtualKey ( ev ) ) {
529452 case "Escape" :
@@ -553,64 +476,9 @@ function loadCss(cssFileName) {
553476 displayHelp ( true , ev ) ;
554477 break ;
555478
556- case "t" :
557- case "T" :
558- displayHelp ( false , ev ) ;
559- ev . preventDefault ( ) ;
560- themePicker = getThemePickerElement ( ) ;
561- themePicker . click ( ) ;
562- themePicker . focus ( ) ;
563- break ;
564-
565479 default :
566- if ( getThemePickerElement ( ) . parentNode . contains ( ev . target ) ) {
567- handleThemeKeyDown ( ev ) ;
568- }
569- }
570- }
571- }
572-
573- function handleThemeKeyDown ( ev ) {
574- const active = document . activeElement ;
575- const themes = getThemesElement ( ) ;
576- switch ( getVirtualKey ( ev ) ) {
577- case "ArrowUp" :
578- ev . preventDefault ( ) ;
579- if ( active . previousElementSibling && ev . target . id !== THEME_PICKER_ELEMENT_ID ) {
580- active . previousElementSibling . focus ( ) ;
581- } else {
582- showThemeButtonState ( ) ;
583- themes . lastElementChild . focus ( ) ;
584- }
585- break ;
586- case "ArrowDown" :
587- ev . preventDefault ( ) ;
588- if ( active . nextElementSibling && ev . target . id !== THEME_PICKER_ELEMENT_ID ) {
589- active . nextElementSibling . focus ( ) ;
590- } else {
591- showThemeButtonState ( ) ;
592- themes . firstElementChild . focus ( ) ;
593- }
594- break ;
595- case "Enter" :
596- case "Return" :
597- case "Space" :
598- if ( ev . target . id === THEME_PICKER_ELEMENT_ID && themes . style . display === "none" ) {
599- ev . preventDefault ( ) ;
600- showThemeButtonState ( ) ;
601- themes . firstElementChild . focus ( ) ;
480+ break ;
602481 }
603- break ;
604- case "Home" :
605- ev . preventDefault ( ) ;
606- themes . firstElementChild . focus ( ) ;
607- break ;
608- case "End" :
609- ev . preventDefault ( ) ;
610- themes . lastElementChild . focus ( ) ;
611- break ;
612- // The escape key is handled in handleEscape, not here,
613- // so that pressing escape will close the menu even if it isn't focused
614482 }
615483 }
616484
@@ -1006,7 +874,6 @@ function loadCss(cssFileName) {
1006874 const shortcuts = [
1007875 [ "?" , "Show this help dialog" ] ,
1008876 [ "S" , "Focus the search field" ] ,
1009- [ "T" , "Focus the theme picker menu" ] ,
1010877 [ "↑" , "Move up in search results" ] ,
1011878 [ "↓" , "Move down in search results" ] ,
1012879 [ "← / →" , "Switch result tab (when results focused)" ] ,
0 commit comments