diff --git a/README.md b/README.md index 7297442..0b6297f 100644 --- a/README.md +++ b/README.md @@ -5,6 +5,7 @@ Chrome 应用商店： { + const isActive = item.getAttribute('data-lang') === lang + item.classList.toggle('active', isActive) + item.setAttribute('aria-checked', isActive ? 'true' : 'false') + }) +} + +function setLanguageMenuOpen(isOpen) { + const toggle = document.getElementById('langToggle') + const menu = document.getElementById('langMenu') + if (!toggle || !menu) return + toggle.setAttribute('aria-expanded', isOpen ? 'true' : 'false') + menu.classList.toggle('hidden', !isOpen) +} + function t(key, substitutions) { const msg = overrideMessages && overrideMessages[key] && overrideMessages[key].message if (typeof msg === 'string' && msg.length > 0) { @@ -100,7 +130,9 @@ function applyStaticI18n() { setText('langOptionZhCN', 'langChineseSimplified') setText('langOptionJa', 'langJapanese') setText('langOptionKo', 'langKorean') - setTitle('langSelect', 'tipLanguage') + setTitle('langToggle', 'tipLanguage') + const langToggle = document.getElementById('langToggle') + if (langToggle) langToggle.setAttribute('aria-label', t('tipLanguage')) // Native hover tooltips (title) setTitle('opensite', 'tipOpenSite') @@ -122,26 +154,47 @@ async function setUiLanguage(nextLang, { persist = true } = {}) { currentUiLanguage = lang overrideMessages = await loadLocaleMessages(lang) applyStaticI18n() - - const select = document.getElementById('langSelect') - if (select && select.value !== lang) select.value = lang + syncLanguageToggleText(lang) + syncLanguageMenuState(lang) if (persist) await storageSyncSet({ [UI_LANGUAGE_STORAGE_KEY]: lang }) window.dispatchEvent(new CustomEvent('i18n:changed', { detail: { lang } })) } async function initLanguageSwitcher() { - const select = document.getElementById('langSelect') - if (select) { - select.addEventListener('change', async () => { - await setUiLanguage(select.value) + const switcher = document.getElementById('lang_switcher') + const toggle = document.getElementById('langToggle') + const langItems = document.querySelectorAll('.lang-menu-item') + + if (toggle) { + toggle.addEventListener('click', (event) => { + event.stopPropagation() + const isOpen = toggle.getAttribute('aria-expanded') === 'true' + setLanguageMenuOpen(!isOpen) }) } - const items = await storageSyncGet({ [UI_LANGUAGE_STORAGE_KEY]: 'auto' }) - const stored = normalizeUiLanguage(items[UI_LANGUAGE_STORAGE_KEY]) - if (select) select.value = stored + langItems.forEach((item) => { + item.addEventListener('click', async (event) => { + event.stopPropagation() + setLanguageMenuOpen(false) + await setUiLanguage(item.getAttribute('data-lang')) + }) + }) + + document.addEventListener('click', (event) => { + if (!switcher || switcher.contains(event.target)) return + setLanguageMenuOpen(false) + }) + + document.addEventListener('keydown', (event) => { + if (event.key === 'Escape') setLanguageMenuOpen(false) + }) + + const storedItems = await storageSyncGet({ [UI_LANGUAGE_STORAGE_KEY]: 'auto' }) + const stored = normalizeUiLanguage(storedItems[UI_LANGUAGE_STORAGE_KEY]) await setUiLanguage(stored, { persist: false }) + setLanguageMenuOpen(false) } window.t = t diff --git a/manifest.json b/manifest.json index f6d68e1..d8f3ec0 100644 --- a/manifest.json +++ b/manifest.json @@ -2,7 +2,7 @@ "manifest_version": 3, "name": "__MSG_extName__", "default_locale": "en", - "version": "2026.03.24", + "version": "2026.03.25", "version_name": "Supports 0.15.0 - 0.26.x", "action": { "default_popup": "popup.html", diff --git a/popup.html b/popup.html index b529bf0..c4bc72c 100644 --- a/popup.html +++ b/popup.html @@ -13,13 +13,22 @@
MEMOS
- + +