1
1
// Local js definitions:
2
2
/* global addClass, getSettingValue, hasClass, searchState */
3
3
/* global onEach, onEachLazy, removeClass */
4
- /* global switchTheme, useSystemTheme */
5
4
6
5
"use strict" ;
7
6
@@ -109,21 +108,11 @@ function getVirtualKey(ev) {
109
108
return String . fromCharCode ( c ) ;
110
109
}
111
110
112
- const THEME_PICKER_ELEMENT_ID = "theme-picker" ;
113
- const THEMES_ELEMENT_ID = "theme-choices" ;
114
111
const MAIN_ID = "main-content" ;
115
112
const SETTINGS_BUTTON_ID = "settings-menu" ;
116
113
const ALTERNATIVE_DISPLAY_ID = "alternative-display" ;
117
114
const NOT_DISPLAYED_ID = "not-displayed" ;
118
115
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
-
127
116
function getSettingsButton ( ) {
128
117
return document . getElementById ( SETTINGS_BUTTON_ID ) ;
129
118
}
@@ -133,74 +122,10 @@ function getNakedUrl() {
133
122
return window . location . href . split ( "?" ) [ 0 ] . split ( "#" ) [ 0 ] ;
134
123
}
135
124
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
-
154
125
window . hideSettings = ( ) => {
155
126
// Does nothing by default.
156
127
} ;
157
128
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
-
204
129
/**
205
130
* This function inserts `newNode` after `referenceNode`. It doesn't work if `referenceNode`
206
131
* doesn't have a parent node.
@@ -512,7 +437,7 @@ function loadCss(cssFileName) {
512
437
ev . preventDefault ( ) ;
513
438
}
514
439
searchState . defocus ( ) ;
515
- hideThemeButtonState ( ) ;
440
+ window . hideSettings ( ) ;
516
441
}
517
442
518
443
const disableShortcuts = getSettingValue ( "disable-shortcuts" ) === "true" ;
@@ -522,8 +447,6 @@ function loadCss(cssFileName) {
522
447
return ;
523
448
}
524
449
525
- let themePicker ;
526
-
527
450
if ( document . activeElement . tagName === "INPUT" ) {
528
451
switch ( getVirtualKey ( ev ) ) {
529
452
case "Escape" :
@@ -553,64 +476,9 @@ function loadCss(cssFileName) {
553
476
displayHelp ( true , ev ) ;
554
477
break ;
555
478
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
-
565
479
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 ;
602
481
}
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
614
482
}
615
483
}
616
484
@@ -1006,7 +874,6 @@ function loadCss(cssFileName) {
1006
874
const shortcuts = [
1007
875
[ "?" , "Show this help dialog" ] ,
1008
876
[ "S" , "Focus the search field" ] ,
1009
- [ "T" , "Focus the theme picker menu" ] ,
1010
877
[ "↑" , "Move up in search results" ] ,
1011
878
[ "↓" , "Move down in search results" ] ,
1012
879
[ "← / →" , "Switch result tab (when results focused)" ] ,
0 commit comments