diff --git a/i18n.js b/i18n.js new file mode 100644 index 0000000..732636c --- /dev/null +++ b/i18n.js @@ -0,0 +1,111 @@ +// i18n.js - Internationalization for WLED Web Installer + +const I18N_LANG_STORAGE_KEY = 'wled-webinstaller:language'; + + +// Translation messages +const i18n_messages = { + "en": { + "maintenance1": "Web Installer under maintenance", + "maintenance2": "The WLED web installer is currently out of service due to maintenance work and will be back online shortly.", + "maintenance3": "In the meantime, you can use the webinstaller provided by Wladi: ", + "welcome": "Welcome to the WLED web installer!", + "unsupported1": "Sorry, your browser is not yet supported!", + "unsupported2": "Please try on Desktop Chrome or Edge.", + "unsupported3": "Find binary files here:", + "step1-1": "Plug in your ESP to a USB port. We will install WLED ", + "step1-2": " to it.", + "step2": "Hit \"Install\" and select the correct COM port.", + "noDeviceFound": "No device found?", + "serialHelp1": "You might be missing the drivers for your board.", + "serialHelp2": "Here are drivers for chips commonly used in ESP boards:", + "serialHelp3": "Make sure your USB cable supports data transfer.", + "chip1": "CP2102 (square chip)", + "chip2": "CH34x (rectangular chip)", + "step3": "Get WLED installed and connected in less than 3 minutes!", + "plain": "Plain", + "audioReactive": "Audioreactive", + "ethernet": "Ethernet", + "esp8266Test": "ESP8266 CPU Frequency Test", + "esp32V4": "ESP32 V4", + "debug": "DEBUG", + "install": "Install", + "powered1": "Powered by ", + "powered2": "", + "cors1": "CORS proxy by ", + "cors2": "" + }, + "zh-CN": { + "maintenance1": "网络安装程序正在维护中", + "maintenance2": "由于维护工作,WLED 网络安装程序目前无法使用,但它将很快重新上线。", + "maintenance3": "在此期间,您可以使用 Wladi 提供的网络安装程序:", + "welcome": "欢迎使用 WLED 网络安装程序!", + "unsupported1": "抱歉,尚不支持您使用的浏览器!", + "unsupported2": "请在桌面版 Chrome 或 Edge 上尝试。", + "unsupported3": "在此处查找二进制文件:", + "step1-1": "将您的 ESP 插入 USB 端口。我们将向其安装 WLED ", + "step1-2": " 。", + "step2": "点击“安装”并选择正确的 COM 端口。", + "noDeviceFound": "未找到设备?", + "serialHelp1": "您可能缺少开发板的驱动程序。", + "serialHelp2": "以下是 ESP 开发板常用的芯片驱动程序:", + "serialHelp3": "确保您的 USB 数据线支持数据传输。", + "chip1": "CP2102(正方形芯片)", + "chip2": "CH34x(长方形芯片)", + "step3": "在不到 3 分钟的时间内安装并连接 WLED!", + "plain": "普通版", + "audioReactive": "音频反应版", + "ethernet": "以太网版", + "esp8266Test": "ESP8266 CPU 频率测试版", + "esp32V4": "ESP32 V4 版", + "debug": "调试版", + "install": "安装", + "powered1": "", + "powered2": " 强力驱动", + "cors1": "CORS 代理由 ", + "cors2": " 提供支持" + } +}; + + +// Function to update text content based on selected language +function i18n() { + const lang = document.getElementById('languageSelect').value; + document.documentElement.lang = lang; // Set the lang attribute of the HTML document + const messages = i18n_messages[lang] || i18n_messages['en']; // Fallback to English if language not found + + document.querySelectorAll('[data-i18n]').forEach((elem) => { + const key = elem.getAttribute('data-i18n'); + const translation = messages[key] ?? i18n_messages['en'][key]; // Fallback to English if key not found + elem.textContent = translation; + + // console.log(`i18n: ${messages[key] || i18n_messages['en'][key]} | ${key} => ${translation}`); + }); +} + + +// Initialize i18n on page load +function i18nInit() { + // Get saved language from localStorage + let savedLang = localStorage.getItem(I18N_LANG_STORAGE_KEY); + + // If no saved language or not in the list of supported languages, set default to English + if (!savedLang || !i18n_messages[savedLang]) { + savedLang = 'en'; + localStorage.setItem(I18N_LANG_STORAGE_KEY, savedLang); + } + + // Set the select element to the saved language + document.getElementById('languageSelect').value = savedLang; + + // Apply translations + i18n(); +} + + +// Event for language selection change +function changeLanguage() { + const selectedLang = document.getElementById('languageSelect').value; + localStorage.setItem(I18N_LANG_STORAGE_KEY, selectedLang); + i18n(); +} \ No newline at end of file diff --git a/index.htm b/index.htm index f7c8fe0..61478b3 100644 --- a/index.htm +++ b/index.htm @@ -1,130 +1,159 @@ + - + - + - Install WLED + Install WLED - + + + +
-
-

Web Installer under maintenance

-
The WLED web installer is currently out of service due to maintenance work and will be back online shortly. -

In the meantime, you can use the webinstaller provided by Wladi: https://wled-install.github.io/ +
+

Web Installer under maintenance


+ The WLED web installer is currently out of service due to maintenance work and will be back online shortly.

+ In the meantime, you can use the webinstaller provided by Wladi: + https://wled-install.github.io/ +
-
- -
-

Welcome to the WLED web installer!

- - - -
- -
    -
  1. Plug in your ESP to a USB port. We will install WLED 0.12.0 to it.
  2. -
  3. Hit "Install" and select the correct COM port. - No device found? - -
  4. + + + -
  5. Get WLED installed and connected in less than 3 minutes!
  6. -


- - -
- -
- - - - - - - - - - - - -
-
-
- - -
-
+
+ + + + +

Welcome to the WLED web installer!

+ + +
+
    +
  1. + Plug in your ESP to a USB port. We will install WLED + 0.12.0 + to it. +
  2. +
  3. + Hit "Install" and select the correct COM port. + No device found? + +
  4. -

    Powered by ESP Web Tools
    -CORS proxy by Corsfix
    -
    GitHubkno.wled.ge +
  5. Get WLED installed and connected in less than 3 minutes!
  6. +
+

- + +
+ +
+ + + + + + + + + + + + +
+
+ +
+ + +
+
+ +

+ Powered by + ESP Web Tools +
+ + CORS proxy by + Corsfix +
+ +
GitHubkno.wled.ge + + + + diff --git a/script.js b/script.js index 06f857b..1b401b9 100644 --- a/script.js +++ b/script.js @@ -24,7 +24,6 @@ function setManifest() { } - function handleCheckbox(manifest, checkboxmanifest, primaryCheckbox) { //Check if specified manifest is available @@ -44,6 +43,7 @@ function handleCheckbox(manifest, checkboxmanifest, primaryCheckbox) { return manifest; } + function resetCheckboxes() { const checkBoxIds = ['ethernet', 'audio', 'test', 'v4', 'debug']; checkBoxIds.forEach(id => { @@ -55,17 +55,20 @@ function resetCheckboxes() { }); } + function checkSupported() { if (document.getElementById('inst').hasAttribute('install-unsupported')) unsupported(); else setManifest(); } + function unsupported() { document.getElementById('flasher').hidden = true; document.getElementById('unsupported').hidden = false; } + function showSerialHelp() { document.getElementById('showSerialHelp').hidden = true; document.getElementById('serialHelp').hidden = false; -} +} \ No newline at end of file