Add UI language switcher and ja/ko locales

Introduce a runtime UI language switcher and add Japanese/Korean locale support. Added _locales/ja and _locales/ko messages, updated en and zh_CN message files with new language-related keys and sendImage label. Implemented dynamic i18n handling: new i18n.js supports override messages, persistent uiLanguage in storage, and emits i18n:changed; background.js now loads override locales, updates context menu titles and listens for storage changes. Integrated dayjs locales (js/ja.js, js/ko.js) and made oper.js use a unified msg() helper and react to language changes. Added language selector UI in popup.html and styling in css/main.css.

_locales/en/messages.json

@@ -14,6 +14,9 @@
    "sendLinkTo": {
       "message": "Send link to Memos"
    },
+   "sendImageTo": {
+      "message": "Send image to Memos"
+   },
    "saveBtn":{
       "message": "Save"
    },
@@ -142,5 +145,23 @@
    },
    "tipSend": {
       "message": "Send (Ctrl/⌘+Enter)"
+   },
+   "tipLanguage": {
+      "message": "Language"
+   },
+   "langAuto": {
+      "message": "Auto"
+   },
+   "langEnglish": {
+      "message": "English"
+   },
+   "langChineseSimplified": {
+      "message": "简体中文"
+   },
+   "langJapanese": {
+      "message": "日本語"
+   },
+   "langKorean": {
+      "message": "한국어"
    }
 }

_locales/ja/messages.json

@@ -0,0 +1,167 @@
+{
+  "extName": {
+    "message": "Memos"
+  },
+  "actionTitle": {
+    "message": "Memos に送信"
+  },
+  "extDescription": {
+    "message": "memos: 軽量なセルフホスト型メモハブ。"
+  },
+  "sendTo": {
+    "message": "Memos に \"%s\" を送信"
+  },
+  "sendLinkTo": {
+    "message": "リンクを Memos に送信"
+  },
+  "sendImageTo": {
+    "message": "画像を Memos に送信"
+  },
+  "saveBtn": {
+    "message": "保存"
+  },
+  "supportedMemosVersion": {
+    "message": "Memos v0.24.0+ に対応（テスト済み: 0.24.0 / 0.25.0 / 0.26.x）"
+  },
+  "placeApiUrl": {
+    "message": "Memos サイトURL"
+  },
+  "placeApiTokens": {
+    "message": "Memos アクセストークン"
+  },
+  "placeContent": {
+    "message": "今のメモは…"
+  },
+  "lockPrivate": {
+    "message": "非公開"
+  },
+  "lockProtected": {
+    "message": "保護"
+  },
+  "lockPublic": {
+    "message": "公開"
+  },
+  "submitBtn": {
+    "message": "送信"
+  },
+  "placeHideInput": {
+    "message": "既定の「非公開」タグ名"
+  },
+  "placeShowInput": {
+    "message": "既定の「全員に公開」タグ名"
+  },
+  "uploadedListTitle": {
+    "message": "アップロード済みファイル（ドラッグで並べ替え）"
+  },
+  "uploadedListEmpty": {
+    "message": "アップロード済みファイルはありません"
+  },
+  "tipReorder": {
+    "message": "ドラッグして並べ替え"
+  },
+  "tipDeleteAttachment": {
+    "message": "削除"
+  },
+  "attachmentDeleteSuccess": {
+    "message": "削除しました"
+  },
+  "attachmentDeleteFailed": {
+    "message": "削除に失敗しました 😭"
+  },
+  "picDrag": {
+    "message": "画像をここにドラッグしてアップロード"
+  },
+  "picCancelDrag": {
+    "message": "アップロードをキャンセル"
+  },
+  "picUploading": {
+    "message": "画像をアップロード中..."
+  },
+  "picSuccess": {
+    "message": "アップロード完了"
+  },
+  "picFailed": {
+    "message": "アップロード失敗"
+  },
+  "picPending": {
+    "message": "画像のアップロードが進行中です"
+  },
+  "saveSuccess": {
+    "message": "保存しました！"
+  },
+  "searchNow": {
+    "message": "何を探していますか？"
+  },
+  "searchNone": {
+    "message": "別のキーワードを試してください！"
+  },
+  "archiveSuccess": {
+    "message": "アーカイブ成功 😊"
+  },
+  "archiveFailed": {
+    "message": "アーカイブ失敗 😭"
+  },
+  "getTabFailed": {
+    "message": "タブの取得に失敗 😭"
+  },
+  "memoUploading": {
+    "message": "送信中"
+  },
+  "memoSuccess": {
+    "message": "成功！😊"
+  },
+  "memoFailed": {
+    "message": "失敗！😭"
+  },
+  "invalidToken": {
+    "message": "無効なトークンまたはURL 😭"
+  },
+  "tipOpenSite": {
+    "message": "Memos を開く"
+  },
+  "tipSettings": {
+    "message": "設定"
+  },
+  "tipTags": {
+    "message": "タグを挿入"
+  },
+  "tipTodo": {
+    "message": "ToDo を挿入"
+  },
+  "tipUpload": {
+    "message": "ファイルをアップロード"
+  },
+  "tipLink": {
+    "message": "現在のタブのリンクを挿入"
+  },
+  "tipRandom": {
+    "message": "ランダムメモ"
+  },
+  "tipSearch": {
+    "message": "検索"
+  },
+  "tipVisibility": {
+    "message": "公開範囲"
+  },
+  "tipSend": {
+    "message": "送信（Ctrl/⌘+Enter）"
+  },
+  "tipLanguage": {
+    "message": "言語"
+  },
+  "langAuto": {
+    "message": "自動"
+  },
+  "langEnglish": {
+    "message": "English"
+  },
+  "langChineseSimplified": {
+    "message": "简体中文"
+  },
+  "langJapanese": {
+    "message": "日本語"
+  },
+  "langKorean": {
+    "message": "한국어"
+  }
+}

_locales/ko/messages.json

@@ -0,0 +1,167 @@
+{
+  "extName": {
+    "message": "Memos"
+  },
+  "actionTitle": {
+    "message": "Memos 보내기"
+  },
+  "extDescription": {
+    "message": "memos: 가볍고 셀프호스팅 가능한 메모 허브."
+  },
+  "sendTo": {
+    "message": "Memos로 \"%s\" 보내기"
+  },
+  "sendLinkTo": {
+    "message": "링크를 Memos로 보내기"
+  },
+  "sendImageTo": {
+    "message": "이미지를 Memos로 보내기"
+  },
+  "saveBtn": {
+    "message": "저장"
+  },
+  "supportedMemosVersion": {
+    "message": "Memos v0.24.0+ 호환 (테스트됨: 0.24.0 / 0.25.0 / 0.26.x)"
+  },
+  "placeApiUrl": {
+    "message": "Memos 사이트 URL"
+  },
+  "placeApiTokens": {
+    "message": "Memos 액세스 토큰"
+  },
+  "placeContent": {
+    "message": "지금 떠오른 생각은..."
+  },
+  "lockPrivate": {
+    "message": "비공개"
+  },
+  "lockProtected": {
+    "message": "보호됨"
+  },
+  "lockPublic": {
+    "message": "공개"
+  },
+  "submitBtn": {
+    "message": "전송"
+  },
+  "placeHideInput": {
+    "message": "기본 '비공개' 태그 이름"
+  },
+  "placeShowInput": {
+    "message": "기본 '모두 공개' 태그 이름"
+  },
+  "uploadedListTitle": {
+    "message": "업로드된 파일(드래그로 순서 변경)"
+  },
+  "uploadedListEmpty": {
+    "message": "업로드된 파일이 없습니다"
+  },
+  "tipReorder": {
+    "message": "드래그하여 순서 변경"
+  },
+  "tipDeleteAttachment": {
+    "message": "삭제"
+  },
+  "attachmentDeleteSuccess": {
+    "message": "삭제됨"
+  },
+  "attachmentDeleteFailed": {
+    "message": "삭제 실패 😭"
+  },
+  "picDrag": {
+    "message": "이미지를 드래그하여 업로드"
+  },
+  "picCancelDrag": {
+    "message": "업로드 취소"
+  },
+  "picUploading": {
+    "message": "이미지 업로드 중..."
+  },
+  "picSuccess": {
+    "message": "업로드 완료"
+  },
+  "picFailed": {
+    "message": "업로드 실패"
+  },
+  "picPending": {
+    "message": "이미지 업로드가 진행 중입니다"
+  },
+  "saveSuccess": {
+    "message": "저장 성공!"
+  },
+  "searchNow": {
+    "message": "무엇을 찾고 있나요?"
+  },
+  "searchNone": {
+    "message": "다른 단어를 시도해 보세요!"
+  },
+  "archiveSuccess": {
+    "message": "보관 성공 😊"
+  },
+  "archiveFailed": {
+    "message": "보관 실패 😭"
+  },
+  "getTabFailed": {
+    "message": "탭 가져오기 실패 😭"
+  },
+  "memoUploading": {
+    "message": "전송 중"
+  },
+  "memoSuccess": {
+    "message": "성공! 😊"
+  },
+  "memoFailed": {
+    "message": "실패! 😭"
+  },
+  "invalidToken": {
+    "message": "유효하지 않은 토큰 또는 URL 😭"
+  },
+  "tipOpenSite": {
+    "message": "Memos 열기"
+  },
+  "tipSettings": {
+    "message": "설정"
+  },
+  "tipTags": {
+    "message": "태그 삽입"
+  },
+  "tipTodo": {
+    "message": "할 일 삽입"
+  },
+  "tipUpload": {
+    "message": "파일 업로드"
+  },
+  "tipLink": {
+    "message": "현재 탭 링크 삽입"
+  },
+  "tipRandom": {
+    "message": "랜덤 메모"
+  },
+  "tipSearch": {
+    "message": "검색"
+  },
+  "tipVisibility": {
+    "message": "공개 범위"
+  },
+  "tipSend": {
+    "message": "전송(Ctrl/⌘+Enter)"
+  },
+  "tipLanguage": {
+    "message": "언어"
+  },
+  "langAuto": {
+    "message": "자동"
+  },
+  "langEnglish": {
+    "message": "English"
+  },
+  "langChineseSimplified": {
+    "message": "简体中文"
+  },
+  "langJapanese": {
+    "message": "日本語"
+  },
+  "langKorean": {
+    "message": "한국어"
+  }
+}

_locales/zh_CN/messages.json

@@ -145,5 +145,23 @@
    },
    "tipSend": {
       "message": "发送（Ctrl/⌘+Enter）"
+   },
+   "tipLanguage": {
+      "message": "语言"
+   },
+   "langAuto": {
+      "message": "跟随浏览器"
+   },
+   "langEnglish": {
+      "message": "English"
+   },
+   "langChineseSimplified": {
+      "message": "简体中文"
+   },
+   "langJapanese": {
+      "message": "日本語"
+   },
+   "langKorean": {
+      "message": "한국어"
    }
 }

css/main.css

@@ -231,6 +231,23 @@ input.inputer{border-bottom: 1px solid #ccc;width:75%;}
     right: 1rem;
     top: 0.5rem;
 }
+
+.lang-switcher{
+    position: absolute;
+    right: 3.5rem;
+    top: .55rem;
+}
+
+.lang-select{
+    border: 1px solid rgb(229,231,235);
+    border-radius: .25rem;
+    background-color: rgb(255,255,255);
+    color: #666;
+    font-size: .75rem;
+    line-height: 1.25rem;
+    padding: .15rem .35rem;
+    cursor: pointer;
+}
 #blog_info{
 
 }

js/background.js

@@ -1,34 +1,107 @@
+const UI_LANGUAGE_STORAGE_KEY = 'uiLanguage'
+
+const SUPPORTED_UI_LANGUAGES = new Set(['auto', 'en', 'zh_CN', 'ja', 'ko'])
+
+function normalizeUiLanguage(value) {
+  const lang = String(value || 'auto')
+  return SUPPORTED_UI_LANGUAGES.has(lang) ? lang : 'auto'
+}
+
+function storageSyncGet(defaults) {
+  return new Promise((resolve) => {
+    chrome.storage.sync.get(defaults, (items) => resolve(items || {}))
+  })
+}
+
+function updateContextMenu(id, update) {
+  return new Promise((resolve) => {
+    try {
+      chrome.contextMenus.update(id, update, () => resolve())
+    } catch (_) {
+      resolve()
+    }
+  })
+}
+
+let cachedUiLanguage = null
+let cachedOverrideMessages = null
+
+async function loadLocaleMessages(locale) {
+  if (!locale || locale === 'auto') return null
+  try {
+    const url = chrome.runtime.getURL(`_locales/${locale}/messages.json`)
+    const resp = await fetch(url)
+    if (!resp.ok) return null
+    return await resp.json()
+  } catch (_) {
+    return null
+  }
+}
+
+async function getUiLanguage() {
+  const items = await storageSyncGet({ [UI_LANGUAGE_STORAGE_KEY]: 'auto' })
+  return normalizeUiLanguage(items[UI_LANGUAGE_STORAGE_KEY])
+}
+
+async function t(key) {
+  const lang = await getUiLanguage()
+  if (lang !== cachedUiLanguage) {
+    cachedUiLanguage = lang
+    cachedOverrideMessages = await loadLocaleMessages(lang)
+  }
+
+  const msg = cachedOverrideMessages && cachedOverrideMessages[key] && cachedOverrideMessages[key].message
+  if (typeof msg === 'string' && msg.length > 0) return msg
+  return chrome.i18n.getMessage(key) || ''
+}
+
+async function refreshContextMenus() {
+  await updateContextMenu('Memos-send-selection', { title: await t('sendTo') })
+  await updateContextMenu('Memos-send-link', { title: await t('sendLinkTo') })
+  await updateContextMenu('Memos-send-image', { title: await t('sendImageTo') })
+}
+
 chrome.runtime.onInstalled.addListener(() => {
-    chrome.contextMenus.create(
+  chrome.contextMenus.create({
-      {
     type: 'normal',
-        title: chrome.i18n.getMessage("sendTo"),
+    title: chrome.i18n.getMessage('sendTo'),
     id: 'Memos-send-selection',
     contexts: ['selection']
-      },
+  })
-    )
+  chrome.contextMenus.create({
-    chrome.contextMenus.create(
-      {
     type: 'normal',
-        title: chrome.i18n.getMessage("sendLinkTo"),
+    title: chrome.i18n.getMessage('sendLinkTo'),
     id: 'Memos-send-link',
     contexts: ['link', 'page']
-      },
+  })
-    )
+  chrome.contextMenus.create({
-    chrome.contextMenus.create(
-      {
     type: 'normal',
-        title: chrome.i18n.getMessage("sendImageTo"),
+    title: chrome.i18n.getMessage('sendImageTo'),
     id: 'Memos-send-image',
     contexts: ['image']
-      },
-    )
   })
-chrome.contextMenus.onClicked.addListener(info => {
+
+  // Apply override titles if user selected a fixed language.
+  refreshContextMenus()
+})
+
+chrome.storage.onChanged.addListener((changes, areaName) => {
+  if (areaName !== 'sync') return
+  if (!changes[UI_LANGUAGE_STORAGE_KEY]) return
+  cachedUiLanguage = null
+  cachedOverrideMessages = null
+  refreshContextMenus()
+})
+
+chrome.contextMenus.onClicked.addListener((info) => {
   let tempCont = ''
   switch (info.menuItemId) {
     case 'Memos-send-selection':
-        tempCont = info.selectionText + '\n' + `[Reference Link](${info.linkUrl || info.pageUrl})` + '\n'
+      tempCont =
+        info.selectionText +
+        '\n' +
+        `[Reference Link](${info.linkUrl || info.pageUrl})` +
+        '\n'
       break
     case 'Memos-send-link':
       tempCont = (info.linkUrl || info.pageUrl) + '\n'
@@ -37,11 +110,18 @@ chrome.contextMenus.onClicked.addListener(info => {
       tempCont = `![](${info.srcUrl})` + '\n'
       break
   }
-    chrome.storage.sync.get({open_action: "save_text", open_content: ''}, function(items) {
+
+  chrome.storage.sync.get(
+    { open_action: 'save_text', open_content: '' },
+    function (items) {
       if (items.open_action === 'upload_image') {
-        alert(chrome.i18n.getMessage("picPending"));
+        t('picPending').then((m) => alert(m))
       } else {
-        chrome.storage.sync.set({open_action: "save_text", open_content: items.open_content + tempCont});
+        chrome.storage.sync.set({
+          open_action: 'save_text',
+          open_content: items.open_content + tempCont
+        })
       }
-    })
+    }
+  )
 })

js/i18n.js

@@ -1,50 +1,148 @@
-function getMessage(key) {
+const UI_LANGUAGE_STORAGE_KEY = 'uiLanguage'
-	return chrome.i18n.getMessage(key) || ''
+
+const SUPPORTED_UI_LANGUAGES = new Set(['auto', 'en', 'zh_CN', 'ja', 'ko'])
+
+function normalizeUiLanguage(value) {
+	const lang = String(value || 'auto')
+	return SUPPORTED_UI_LANGUAGES.has(lang) ? lang : 'auto'
+}
+
+function storageSyncGet(defaults) {
+	return new Promise((resolve) => {
+		chrome.storage.sync.get(defaults, (items) => resolve(items || {}))
+	})
+}
+
+function storageSyncSet(items) {
+	return new Promise((resolve) => {
+		chrome.storage.sync.set(items, () => resolve())
+	})
+}
+
+async function loadLocaleMessages(locale) {
+	if (!locale || locale === 'auto') return null
+	try {
+		const url = chrome.runtime.getURL(`_locales/${locale}/messages.json`)
+		const resp = await fetch(url)
+		if (!resp.ok) return null
+		return await resp.json()
+	} catch (_) {
+		return null
+	}
+}
+
+function formatSubstitutions(message, substitutions) {
+	if (!message) return ''
+	if (substitutions == null) return message
+	const subs = Array.isArray(substitutions) ? substitutions : [substitutions]
+	let out = message
+	for (let i = 0; i < subs.length; i++) {
+		const v = String(subs[i])
+		out = out.replaceAll(`$${i + 1}`, v)
+		out = out.replace('%s', v)
+	}
+	return out
+}
+
+let currentUiLanguage = 'auto'
+let overrideMessages = null
+
+function t(key, substitutions) {
+	const msg = overrideMessages && overrideMessages[key] && overrideMessages[key].message
+	if (typeof msg === 'string' && msg.length > 0) {
+		return formatSubstitutions(msg, substitutions)
+	}
+	const chromeMsg = chrome.i18n.getMessage(key, substitutions) || ''
+	return formatSubstitutions(chromeMsg, substitutions)
 }
 
 function setText(id, messageKey) {
 	const el = document.getElementById(id)
-	if (el) el.textContent = getMessage(messageKey)
+	if (el) el.textContent = t(messageKey)
 }
 
 function setPlaceholder(id, messageKey) {
 	const el = document.getElementById(id)
-	if (el) el.placeholder = getMessage(messageKey)
+	if (el) el.placeholder = t(messageKey)
 }
 
 function setTitle(id, messageKey) {
 	const el = document.getElementById(id)
-	if (el) el.title = getMessage(messageKey)
+	if (el) el.title = t(messageKey)
 }
 
-setText("saveKey", "saveBtn")
+function applyStaticI18n() {
-setText("saveTag", "saveBtn")
+	setText('saveKey', 'saveBtn')
+	setText('saveTag', 'saveBtn')
 
-setText("supportedMemosVersion", "supportedMemosVersion")
+	setText('supportedMemosVersion', 'supportedMemosVersion')
 
-setPlaceholder("apiUrl", "placeApiUrl")
+	setPlaceholder('apiUrl', 'placeApiUrl')
-setPlaceholder("apiTokens", "placeApiTokens")
+	setPlaceholder('apiTokens', 'placeApiTokens')
-setPlaceholder("content", "placeContent")
+	setPlaceholder('content', 'placeContent')
 
-setText("lockPrivate", "lockPrivate")
+	setText('lockPrivate', 'lockPrivate')
-setText("lockProtected", "lockProtected")
+	setText('lockProtected', 'lockProtected')
-setText("lockPublic", "lockPublic")
+	setText('lockPublic', 'lockPublic')
 
-setText("content_submit_text", "submitBtn")
+	setText('content_submit_text', 'submitBtn')
 
-setPlaceholder("hideInput", "placeHideInput")
+	setPlaceholder('hideInput', 'placeHideInput')
-setPlaceholder("showInput", "placeShowInput")
+	setPlaceholder('showInput', 'placeShowInput')
 
-setText("uploadlist-title", "uploadedListTitle")
+	setText('uploadlist-title', 'uploadedListTitle')
+
+	// Language switcher
+	setText('langOptionAuto', 'langAuto')
+	setText('langOptionEn', 'langEnglish')
+	setText('langOptionZhCN', 'langChineseSimplified')
+	setText('langOptionJa', 'langJapanese')
+	setText('langOptionKo', 'langKorean')
+	setTitle('langSelect', 'tipLanguage')
 
 	// Native hover tooltips (title)
-setTitle("opensite", "tipOpenSite")
+	setTitle('opensite', 'tipOpenSite')
-setTitle("blog_info_edit", "tipSettings")
+	setTitle('blog_info_edit', 'tipSettings')
-setTitle("tags", "tipTags")
+	setTitle('tags', 'tipTags')
-setTitle("newtodo", "tipTodo")
+	setTitle('newtodo', 'tipTodo')
-setTitle("upres", "tipUpload")
+	setTitle('upres', 'tipUpload')
-setTitle("getlink", "tipLink")
+	setTitle('getlink', 'tipLink')
-setTitle("random", "tipRandom")
+	setTitle('random', 'tipRandom')
-setTitle("search", "tipSearch")
+	setTitle('search', 'tipSearch')
-setTitle("lock", "tipVisibility")
+	setTitle('lock', 'tipVisibility')
-setTitle("content_submit_text", "tipSend")
+	setTitle('content_submit_text', 'tipSend')
+}
+
+async function setUiLanguage(nextLang, { persist = true } = {}) {
+	const lang = normalizeUiLanguage(nextLang)
+	currentUiLanguage = lang
+	overrideMessages = await loadLocaleMessages(lang)
+	applyStaticI18n()
+
+	const select = document.getElementById('langSelect')
+	if (select && select.value !== lang) select.value = 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 items = await storageSyncGet({ [UI_LANGUAGE_STORAGE_KEY]: 'auto' })
+	const stored = normalizeUiLanguage(items[UI_LANGUAGE_STORAGE_KEY])
+	if (select) select.value = stored
+	await setUiLanguage(stored, { persist: false })
+}
+
+window.t = t
+window.setUiLanguage = setUiLanguage
+window.getUiLanguage = () => currentUiLanguage
+
+applyStaticI18n()
+window.i18nReady = initLanguageSwitcher()

js/ja.js

@@ -0,0 +1 @@
+!function(e,_){"object"==typeof exports&&"undefined"!=typeof module?module.exports=_(require("dayjs")):"function"==typeof define&&define.amd?define(["dayjs"],_):(e="undefined"!=typeof globalThis?globalThis:e||self).dayjs_locale_ja=_(e.dayjs)}(this,(function(e){"use strict";function _(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var t=_(e),a={name:"ja",relativeTime:{future:"%s後",past:"%s前",s:"数秒",m:"1分",mm:"%d分",h:"1時間",hh:"%d時間",d:"1日",dd:"%d日",M:"1か月",MM:"%dか月",y:"1年",yy:"%d年"}};return t.default.locale(a,null,!0),a}));

js/ko.js

@@ -0,0 +1 @@
+!function(e,_){"object"==typeof exports&&"undefined"!=typeof module?module.exports=_(require("dayjs")):"function"==typeof define&&define.amd?define(["dayjs"],_):(e="undefined"!=typeof globalThis?globalThis:e||self).dayjs_locale_ko=_(e.dayjs)}(this,(function(e){"use strict";function _(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var t=_(e),a={name:"ko",relativeTime:{future:"%s 후",past:"%s 전",s:"몇 초",m:"1분",mm:"%d분",h:"1시간",hh:"%d시간",d:"하루",dd:"%d일",M:"1개월",MM:"%d개월",y:"1년",yy:"%d년"}};return t.default.locale(a,null,!0),a}));

js/oper.js

@@ -1,5 +1,67 @@
 dayjs.extend(window.dayjs_plugin_relativeTime)
+let currentMemoLock = ''
+
+function msg(key) {
+  if (typeof window.t === 'function') return window.t(key)
+  return chrome.i18n.getMessage(key) || ''
+}
+
+function applyDayjsLocaleByUiLanguage(uiLang) {
+  const lang = String(uiLang || 'auto')
+  if (lang === 'zh_CN') {
     dayjs.locale('zh-cn')
+    return
+  }
+
+  if (lang === 'ja') {
+    dayjs.locale('ja')
+    return
+  }
+
+  if (lang === 'ko') {
+    dayjs.locale('ko')
+    return
+  }
+
+  if (lang === 'en') {
+    dayjs.locale('en')
+    return
+  }
+
+  // auto: best-effort infer from browser UI language
+  const ui = String(chrome.i18n.getUILanguage ? chrome.i18n.getUILanguage() : '').toLowerCase()
+  if (ui.startsWith('zh')) {
+    dayjs.locale('zh-cn')
+    return
+  }
+  if (ui.startsWith('ja')) {
+    dayjs.locale('ja')
+    return
+  }
+  if (ui.startsWith('ko')) {
+    dayjs.locale('ko')
+    return
+  }
+  dayjs.locale('en')
+}
+
+function updateLockNowText(lockType) {
+  if (lockType === 'PUBLIC') {
+    $('#lock-now').text(msg('lockPublic'))
+  } else if (lockType === 'PRIVATE') {
+    $('#lock-now').text(msg('lockPrivate'))
+  } else if (lockType === 'PROTECTED') {
+    $('#lock-now').text(msg('lockProtected'))
+  }
+}
+
+applyDayjsLocaleByUiLanguage(typeof window.getUiLanguage === 'function' ? window.getUiLanguage() : 'auto')
+
+window.addEventListener('i18n:changed', (ev) => {
+  applyDayjsLocaleByUiLanguage(ev && ev.detail ? ev.detail.lang : 'auto')
+  updateLockNowText(currentMemoLock)
+  renderUploadList(relistNow)
+})
 
 let relistNow = []
 
@@ -52,15 +114,10 @@ get_info(function (info) {
     chrome.storage.sync.set(
       { memo_lock: 'PUBLIC' }
     )
-    $("#lock-now").text(chrome.i18n.getMessage("lockPublic"))
+    memoNow = 'PUBLIC'
-  }
-  if (memoNow == "PUBLIC") {
-    $("#lock-now").text(chrome.i18n.getMessage("lockPublic"))
-  } else if (memoNow == "PRIVATE") {
-    $("#lock-now").text(chrome.i18n.getMessage("lockPrivate"))
-  } else if (memoNow == "PROTECTED") {
-    $("#lock-now").text(chrome.i18n.getMessage("lockProtected"))
   }
+  currentMemoLock = memoNow
+  updateLockNowText(memoNow)
   $('#apiUrl').val(info.apiUrl)
   $('#apiTokens').val(info.apiTokens)
   $('#hideInput').val(info.hidetag)
@@ -125,7 +182,7 @@ function initDrag() {
   obj.ondragenter = function (ev) {
     if (ev.target.className === 'common-editor-inputer') {
       $.message({
-        message: chrome.i18n.getMessage("picDrag"),
+        message: msg('picDrag'),
         autoClose: false
       })
       $('body').css('opacity', 0.3)
@@ -149,7 +206,7 @@ function initDrag() {
     ev.preventDefault()
     if (ev.target.className === 'common-editor-inputer') {
       $.message({
-        message: chrome.i18n.getMessage("picCancelDrag")
+        message: msg('picCancelDrag')
       })
       $('body').css('opacity', 1)
     }
@@ -179,8 +236,8 @@ function renderUploadList(list) {
 
   if ($wrapper.length) $wrapper.show()
 
-  const tipReorder = escapeHtml(chrome.i18n.getMessage('tipReorder'))
+  const tipReorder = escapeHtml(msg('tipReorder'))
-  const tipDelete = escapeHtml(chrome.i18n.getMessage('tipDeleteAttachment'))
+  const tipDelete = escapeHtml(msg('tipDeleteAttachment'))
 
   let html = ''
   for (let i = 0; i < items.length; i++) {
@@ -274,7 +331,7 @@ $(document).on('click', '.upload-del', function () {
 
   get_info(function (info) {
     if (!info.status) {
-      $.message({ message: chrome.i18n.getMessage('placeApiUrl') })
+      $.message({ message: msg('placeApiUrl') })
       return
     }
 
@@ -287,19 +344,19 @@ $(document).on('click', '.upload-del', function () {
           return x && x.name !== name
         })
         saveUploadList(next, function () {
-          $.message({ message: chrome.i18n.getMessage('attachmentDeleteSuccess') })
+          $.message({ message: msg('attachmentDeleteSuccess') })
           renderUploadList(relistNow)
         })
       },
       error: function () {
-        $.message({ message: chrome.i18n.getMessage('attachmentDeleteFailed') })
+        $.message({ message: msg('attachmentDeleteFailed') })
       }
     })
   })
 })
 function uploadImage(file) {
   $.message({
-    message: chrome.i18n.getMessage("picUploading"),
+    message: msg('picUploading'),
     autoClose: false
   });
     const reader = new FileReader();
@@ -355,7 +412,7 @@ function uploadImageNow(base64String, file) {
                 resourceIdList: relistNow
               },
               function () {
-                $.message({ message: chrome.i18n.getMessage('picSuccess') })
+                $.message({ message: msg('picSuccess') })
               }
             )
           } else {
@@ -366,18 +423,18 @@ function uploadImageNow(base64String, file) {
                 resourceIdList: []
               },
               function () {
-                $.message({ message: chrome.i18n.getMessage('picFailed') })
+                $.message({ message: msg('picFailed') })
               }
             )
           }
         },
         function () {
-          $.message({ message: chrome.i18n.getMessage('picFailed') })
+          $.message({ message: msg('picFailed') })
         }
       )
     }else {
       $.message({
-        message: chrome.i18n.getMessage("placeApiUrl")
+        message: msg('placeApiUrl')
       })
     }
   });
@@ -392,7 +449,7 @@ $('#saveKey').click(function () {
 
   window.MemosApi.authWithFallback(apiUrl, apiTokens, function (auth) {
     if (!auth || auth.userId == null) {
-      $.message({ message: chrome.i18n.getMessage('invalidToken') })
+      $.message({ message: msg('invalidToken') })
       return
     }
 
@@ -404,7 +461,7 @@ $('#saveKey').click(function () {
         memoUiPath: auth.uiPath || 'memos'
       },
       function () {
-        $.message({ message: chrome.i18n.getMessage('saveSuccess') })
+        $.message({ message: msg('saveSuccess') })
         $('#blog_info').hide()
       }
     )
@@ -446,12 +503,12 @@ $('#tags').click(function () {
           $("#taglist").html(tagDom).slideToggle(500)
         },
         function () {
-          $.message({ message: chrome.i18n.getMessage('placeApiUrl') })
+          $.message({ message: msg('placeApiUrl') })
         }
       )
     } else {
       $.message({
-        message: chrome.i18n.getMessage("placeApiUrl")
+        message: msg('placeApiUrl')
       })
     }
   })
@@ -470,7 +527,7 @@ $('#saveTag').click(function () {
     },
     function () {
       $.message({
-        message: chrome.i18n.getMessage("saveSuccess")
+        message: msg('saveSuccess')
       })
       $('#taghide').hide()
     }
@@ -485,6 +542,7 @@ $(document).on("click",".item-lock",function () {
   $("#lock-wrapper").toggleClass( "!hidden", 1000 );
   $("#lock-now").text($(this).text())
     _this = $(this)[0].dataset.type;
+    currentMemoLock = _this
     chrome.storage.sync.set(
       {memo_lock: _this}
     )
@@ -506,7 +564,7 @@ $('#search').click(function () {
           let searchData = window.MemosApi.extractMemosListFromResponse(data)
           if(searchData.length == 0){
             $.message({
-              message: chrome.i18n.getMessage("searchNone")
+              message: msg('searchNone')
             })
           }else{
             for(var i=0;i < searchData.length;i++){
@@ -540,17 +598,17 @@ $('#search').click(function () {
           }
         },
         function () {
-          $.message({ message: chrome.i18n.getMessage('searchNone') })
+          $.message({ message: msg('searchNone') })
         }
       )
     }else{
       $.message({
-        message: chrome.i18n.getMessage("searchNow")
+        message: msg('searchNow')
       })
     }
   } else {
     $.message({
-      message: chrome.i18n.getMessage("placeApiUrl")
+      message: msg('placeApiUrl')
     })
   }
 })
@@ -572,12 +630,12 @@ $('#random').click(function () {
           randDom(randomData)
         },
         function () {
-          $.message({ message: chrome.i18n.getMessage('placeApiUrl') })
+          $.message({ message: msg('placeApiUrl') })
         }
       )
     } else {
       $.message({
-        message: chrome.i18n.getMessage("placeApiUrl")
+        message: msg('placeApiUrl')
       })
     }
   })
@@ -639,11 +697,11 @@ get_info(function (info) {
     success: function(result){
           $("#randomlist").html('').hide()
               $.message({
-                message: chrome.i18n.getMessage("archiveSuccess")
+                message: msg('archiveSuccess')
               })
   },error:function(err){//清空open_action（打开时候进行的操作）,同时清空open_content
               $.message({
-                message: chrome.i18n.getMessage("archiveFailed")
+                message: msg('archiveFailed')
               })
           }
   })
@@ -667,7 +725,7 @@ $('#getlink').click(function () {
       add(linkHtml);
     }else{
       $.message({
-        message: chrome.i18n.getMessage("getTabFailed")
+        message: msg('getTabFailed')
       })
     }
   })
@@ -711,7 +769,7 @@ $('#content_submit_text').click(function () {
     sendText()
   }else{
     $.message({
-      message: chrome.i18n.getMessage("placeContent")
+      message: msg('placeContent')
     })
   }
 })
@@ -733,7 +791,7 @@ function getOne(memosId){
         })
   } else {
     $.message({
-      message: chrome.i18n.getMessage("placeApiUrl")
+      message: msg('placeApiUrl')
     })
   }
   })
@@ -743,7 +801,7 @@ function sendText() {
   get_info(function (info) {
     if (info.status) {
       $.message({
-        message: chrome.i18n.getMessage("memoUploading")
+        message: msg('memoUploading')
       })
       //$("#content_submit_text").attr('disabled','disabled');
       let content = $("textarea[name=text]").val()
@@ -789,7 +847,7 @@ function sendText() {
             { open_action: '', open_content: '',resourceIdList:[]},
             function () {
               $.message({
-                message: chrome.i18n.getMessage("memoSuccess")
+                message: msg('memoSuccess')
               })
               //$("#content_submit_text").removeAttr('disabled');
               $("textarea[name=text]").val('')
@@ -802,14 +860,14 @@ function sendText() {
                 { open_action: '', open_content: '',resourceIdList:[] },
                 function () {
                   $.message({
-                    message: chrome.i18n.getMessage("memoFailed")
+                    message: msg('memoFailed')
                   })
                 }
               )},
       })
     } else {
       $.message({
-        message: chrome.i18n.getMessage("placeApiUrl")
+        message: msg('placeApiUrl')
       })
     }
   })

popup.html

@@ -12,6 +12,15 @@
   </head>
   <body class="body">
     <div class="title" id="opensite">MEMOS</div>
+    <div id="lang_switcher" class="lang-switcher">
+      <select id="langSelect" class="lang-select" aria-label="Language" title="">
+        <option id="langOptionAuto" value="auto"></option>
+        <option id="langOptionEn" value="en"></option>
+        <option id="langOptionZhCN" value="zh_CN"></option>
+        <option id="langOptionJa" value="ja"></option>
+        <option id="langOptionKo" value="ko"></option>
+      </select>
+    </div>
     <div id="blog_info_edit"><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" class="icon" viewBox="0 0 1024 1024">
       <path d="M914 432c-5-26-21-43-41-43h-4c-54 0-99-44-99-99 0-17 9-37 9-38 10-22 2-50-18-65l-103-57h-1c-21-9-49-4-64 12-12 12-50 44-79 44s-68-33-79-45a60 60 0 0 0-64-13l-106 58-2 1a54 54 0 0 0-18 65c0 1 9 21 9 38 0 55-45 99-99 99h-5c-19 0-35 17-40 43 0 2-9 45-9 80s9 79 9 81c5 25 21 42 41 42h4c54 0 99 45 99 99 0 18-9 37-9 38-10 23-2 51 18 65l101 56 1 1c21 9 49 3 65-13 14-15 52-47 80-47 30 0 69 35 81 48a58 58 0 0 0 64 14l104-58 2-1c20-14 28-42 18-65 0-1-9-20-9-38 0-54 45-99 99-99h5c19 0 35-17 40-42 0-2 9-46 9-81s-9-78-9-80m-51 80c0 23-5 52-7 64a158 158 0 0 0-134 215l-89 49c-4-5-17-18-35-31-31-23-61-35-88-35s-57 12-88 34c-17 13-30 26-34 31l-86-48a159 159 0 0 0-134-215c-2-12-7-41-7-64 0-22 5-51 7-64a157 157 0 0 0 134-214l91-50c4 4 17 17 35 29 30 22 59 33 86 33s55-11 85-32c18-13 31-25 35-29l88 49a159 159 0 0 0 134 214c2 13 7 42 7 64"/>
       <path d="M510 366a146 146 0 1 0 1 292 146 146 0 0 0-1-292m87 146a87 87 0 1 1-173-1 87 87 0 0 1 173 1"/>
@@ -138,6 +147,8 @@
   <script src="../js/message.js"></script>
   <script src="../js/dayjs.min.js"></script>
   <script src="../js/zh-cn.js"></script>
+  <script src="../js/ja.js"></script>
+  <script src="../js/ko.js"></script>
   <script src="../js/relativeTime.js"></script>
   <script src="../js/view-image.js"></script>
   <script src="../js/memosApi.js"></script>