|
5 | 5 | const langPopup = document.getElementById('lang-list');
|
6 | 6 |
|
7 | 7 | if (!langToggleButton || !langPopup) {
|
8 |
| - return; // Safety check: if they're missing from the page, do nothing |
| 8 | + return; // Safety check: if they're missing from the page, do nothing |
9 | 9 | }
|
10 | 10 |
|
11 | 11 | function showLangs() {
|
12 |
| - langPopup.style.display = 'block'; |
13 |
| - langToggleButton.setAttribute('aria-expanded', 'true'); |
| 12 | + langPopup.style.display = 'block'; |
| 13 | + langToggleButton.setAttribute('aria-expanded', 'true'); |
14 | 14 | }
|
15 | 15 |
|
16 | 16 | function hideLangs() {
|
17 |
| - langPopup.style.display = 'none'; |
18 |
| - langToggleButton.setAttribute('aria-expanded', 'false'); |
19 |
| - langToggleButton.focus(); |
| 17 | + langPopup.style.display = 'none'; |
| 18 | + langToggleButton.setAttribute('aria-expanded', 'false'); |
| 19 | + langToggleButton.focus(); |
20 | 20 | }
|
21 | 21 |
|
22 |
| - langToggleButton.addEventListener('click', function() { |
23 |
| - if (langPopup.style.display === 'block') { |
24 |
| - hideLangs(); |
25 |
| - } else { |
26 |
| - showLangs(); |
27 |
| - } |
| 22 | + langToggleButton.addEventListener('click', function () { |
| 23 | + if (langPopup.style.display === 'block') { |
| 24 | + hideLangs(); |
| 25 | + } else { |
| 26 | + showLangs(); |
| 27 | + } |
28 | 28 | });
|
29 | 29 |
|
30 | 30 | document.addEventListener('click', function (e) {
|
31 | 31 | if (e.target && e.target.matches('button[data-lang]')) {
|
32 | 32 | const chosenLang = e.target.getAttribute('data-lang');
|
33 | 33 | const supportedLangs = ['en', 'ko-KR']; // Add translated languages here
|
34 |
| - |
| 34 | + |
35 | 35 | let currentPath = window.location.pathname;
|
36 |
| - |
| 36 | + |
37 | 37 | // Find "book/" in the path
|
38 | 38 | const bookAnchor = 'book/';
|
39 |
| - const idx = currentPath.indexOf(bookAnchor); |
40 |
| - |
| 39 | + let idx = currentPath.indexOf(bookAnchor); |
| 40 | + let base = ''; |
| 41 | + let after = ''; |
41 | 42 | if (idx === -1) {
|
42 |
| - // Fallback: If "book/" isn’t in the path |
43 |
| - // Just go to the top-level file in the chosen language. |
44 |
| - if (chosenLang === 'en') |
45 |
| - window.location.href = 'index.html'; |
46 |
| - else |
47 |
| - window.location.href = chosenLang + '/index.html'; |
48 |
| - |
49 |
| - return; |
| 43 | + // assume live |
| 44 | + const lvAnchor = 'learn-vulkan/'; |
| 45 | + // eg "/learn-vulkan/ko-KR/initialization/index.html" |
| 46 | + idx = currentPath.indexOf(lvAnchor); |
| 47 | + if (idx == -1) { |
| 48 | + // error |
| 49 | + return; |
| 50 | + } |
| 51 | + base = window.location.origin + '/' + lvAnchor; |
| 52 | + after = currentPath.substring(idx + lvAnchor.length); |
| 53 | + } else { |
| 54 | + // Everything up to (and including) "book/" |
| 55 | + // e.g. "/C:/Users/.../guide/book/" |
| 56 | + base = currentPath.substring(0, idx + bookAnchor.length); |
| 57 | + |
| 58 | + // The rest "after book/" part |
| 59 | + // e.g. "index.html" or "zh-TW/getting_started/foo.html" |
| 60 | + after = currentPath.substring(idx + bookAnchor.length); |
50 | 61 | }
|
51 |
| - |
52 |
| - // Everything up to (and including) "book/" |
53 |
| - // e.g. "/C:/Users/.../guide/book/" |
54 |
| - const base = currentPath.substring(0, idx + bookAnchor.length); |
55 |
| - |
56 |
| - // The rest "after book/" part |
57 |
| - // e.g. "index.html" or "zh-TW/getting_started/foo.html" |
58 |
| - let after = currentPath.substring(idx + bookAnchor.length); |
59 |
| - |
| 62 | + |
60 | 63 | // Split into segments and remove any leading lang if it’s known
|
61 | 64 | // e.g. ["index.html"] or ["en", "getting_started", "foo.html"]
|
62 | 65 | let segments = after.split('/').filter(s => s.length > 0);
|
63 |
| - |
| 66 | + |
64 | 67 | if (segments.length > 0 && supportedLangs.includes(segments[0])) {
|
65 | 68 | // remove the first segment if it’s a supported lang
|
66 | 69 | // e.g. now ["getting_started", "foo.html"]
|
67 |
| - segments.shift(); |
| 70 | + segments.shift(); |
68 | 71 | }
|
69 |
| - |
| 72 | + |
70 | 73 | // Insert the chosen language as the first path segment
|
71 | 74 | // Also, English has no prefix
|
72 | 75 | let newPath;
|
|
77 | 80 | // e.g. /C:/Users/.../guide/book/zh-TW/getting_started/foo.html
|
78 | 81 | newPath = base + chosenLang + '/' + segments.join('/');
|
79 | 82 | }
|
80 |
| - |
| 83 | + |
81 | 84 | window.location.href = newPath;
|
82 | 85 | }
|
83 |
| - |
| 86 | + |
84 | 87 | if (
|
85 | 88 | langPopup.style.display === 'block' &&
|
86 | 89 | !langToggleButton.contains(e.target) &&
|
|
91 | 94 | });
|
92 | 95 |
|
93 | 96 | // Also hide if focus goes elsewhere
|
94 |
| - langPopup.addEventListener('focusout', function(e) { |
95 |
| - // e.relatedTarget can be null in some browsers |
96 |
| - if (!!e.relatedTarget && |
97 |
| - !langToggleButton.contains(e.relatedTarget) && |
98 |
| - !langPopup.contains(e.relatedTarget)) { |
99 |
| - hideLangs(); |
100 |
| - } |
| 97 | + langPopup.addEventListener('focusout', function (e) { |
| 98 | + // e.relatedTarget can be null in some browsers |
| 99 | + if (!!e.relatedTarget && |
| 100 | + !langToggleButton.contains(e.relatedTarget) && |
| 101 | + !langPopup.contains(e.relatedTarget)) { |
| 102 | + hideLangs(); |
| 103 | + } |
101 | 104 | });
|
102 | 105 |
|
103 | 106 | // Optional: Add keyboard navigation (like theme popup)
|
104 |
| - document.addEventListener('keydown', function(e) { |
105 |
| - if (langPopup.style.display !== 'block') return; |
106 |
| - if (e.altKey || e.ctrlKey || e.metaKey || e.shiftKey) return; |
107 |
| - |
108 |
| - let li; |
109 |
| - switch (e.key) { |
110 |
| - case 'Escape': |
111 |
| - e.preventDefault(); |
112 |
| - hideLangs(); |
113 |
| - break; |
114 |
| - case 'ArrowUp': |
115 |
| - e.preventDefault(); |
116 |
| - li = document.activeElement.parentElement; |
117 |
| - if (li && li.previousElementSibling) { |
118 |
| - li.previousElementSibling.querySelector('a, button').focus(); |
119 |
| - } |
120 |
| - break; |
121 |
| - case 'ArrowDown': |
122 |
| - e.preventDefault(); |
123 |
| - li = document.activeElement.parentElement; |
124 |
| - if (li && li.nextElementSibling) { |
125 |
| - li.nextElementSibling.querySelector('a, button').focus(); |
126 |
| - } |
127 |
| - break; |
128 |
| - case 'Home': |
129 |
| - e.preventDefault(); |
130 |
| - langPopup.querySelector('li:first-child a, li:first-child button').focus(); |
131 |
| - break; |
132 |
| - case 'End': |
133 |
| - e.preventDefault(); |
134 |
| - langPopup.querySelector('li:last-child a, li:last-child button').focus(); |
135 |
| - break; |
136 |
| - } |
| 107 | + document.addEventListener('keydown', function (e) { |
| 108 | + if (langPopup.style.display !== 'block') return; |
| 109 | + if (e.altKey || e.ctrlKey || e.metaKey || e.shiftKey) return; |
| 110 | + |
| 111 | + let li; |
| 112 | + switch (e.key) { |
| 113 | + case 'Escape': |
| 114 | + e.preventDefault(); |
| 115 | + hideLangs(); |
| 116 | + break; |
| 117 | + case 'ArrowUp': |
| 118 | + e.preventDefault(); |
| 119 | + li = document.activeElement.parentElement; |
| 120 | + if (li && li.previousElementSibling) { |
| 121 | + li.previousElementSibling.querySelector('a, button').focus(); |
| 122 | + } |
| 123 | + break; |
| 124 | + case 'ArrowDown': |
| 125 | + e.preventDefault(); |
| 126 | + li = document.activeElement.parentElement; |
| 127 | + if (li && li.nextElementSibling) { |
| 128 | + li.nextElementSibling.querySelector('a, button').focus(); |
| 129 | + } |
| 130 | + break; |
| 131 | + case 'Home': |
| 132 | + e.preventDefault(); |
| 133 | + langPopup.querySelector('li:first-child a, li:first-child button').focus(); |
| 134 | + break; |
| 135 | + case 'End': |
| 136 | + e.preventDefault(); |
| 137 | + langPopup.querySelector('li:last-child a, li:last-child button').focus(); |
| 138 | + break; |
| 139 | + } |
137 | 140 | });
|
138 | 141 | })();
|
0 commit comments