v0.9.0 Add populating languages from an array

Author: xpmn

src/manifest.json

@@ -1,7 +1,7 @@
 {
   "manifest_version": 2,
   "name": "To DeepL",
-  "version": "0.8.0",
+  "version": "0.9.0",
   "description": "Translate selected text in new tab with DeepL",
   "homepage_url": "https://github.com/rewkha/firefox-to-deepl",
   "icons": {

src/options/options.html

@@ -19,36 +19,6 @@
     <label for="default_lang">
       <label for="default_lang">Default language:</label>
       <select class="browser-style" name="default_lang" id="defaultLang">
-        <option value="en" selected="">English</option>
-        <option value="bg">Български</option>
-        <option value="cs">Čeština (Český)</option>
-        <option value="da">Dansk</option>
-        <option value="de">Deutsch</option>
-        <option value="es">Español</option>
-        <option value="et">Eesti</option>
-        <option value="el">Ελληνικά</option>
-        <option value="fr">Français</option>
-        <option value="fi">Suomi</option>
-        <option value="hu">Magyar nyelv</option>
-        <option value="id">Bahasa Indonesia</option>
-        <option value="it">Italiano</option>
-        <option value="ja">日本語 (Japanese)</option>
-        <option value="ko">한국어 (Korean)</option>
-        <option value="lv">Latviešu valoda</option>
-        <option value="lt">Lietuvių kalba</option>
-        <option value="nb">Norsk bokmål</option>
-        <option value="nl">Nederlands</option>
-        <option value="pl">Polski</option>
-        <option value="pt-PT">Português</option>
-        <option value="pt-BR">Português (Brasil)</option>
-        <option value="ro">Limba română</option>
-        <option value="ru">Русский (Russian)</option>
-        <option value="sk">Slovenský (Slovak)</option>
-        <option value="sl">Slovenski (Slovenian)</option>
-        <option value="sv">Svenska</option>
-        <option value="tr">Türkçe</option>
-        <option value="uk">Українська</option>
-        <option value="zh">简体中文 (simplified Chinese)</option>
       </select>
 
       <fieldset>

src/options/options.js

@@ -1,4 +1,46 @@
+// array of languages to populate the select element
+const languages = [
+  { name: "English", value: "en" },
+  { name: "Български", value: "bg" },
+  { name: "Čeština (Český)", value: "cs" },
+  { name: "Dansk", value: "da" },
+  { name: "Deutsch", value: "de" },
+  { name: "Español", value: "es" },
+  { name: "Eesti", value: "et" },
+  { name: "Ελληνικά", value: "el" },
+  { name: "Français", value: "fr" },
+  { name: "Suomi", value: "fi" },
+  { name: "Magyar nyelv", value: "hu" },
+  { name: "Bahasa Indonesia", value: "id" },
+  { name: "Italiano", value: "it" },
+  { name: "日本語 (Japanese)", value: "ja" },
+  { name: "한국어 (Korean)", value: "ko" },
+  { name: "Latviešu valoda", value: "lv" },
+  { name: "Lietuvių kalba", value: "lt" },
+  { name: "Norsk bokmål", value: "nb" },
+  { name: "Nederlands", value: "nl" },
+  { name: "Polski", value: "pl" },
+  { name: "Português", value: "pt-PT" },
+  { name: "Português (Brasil)", value: "pt-BR" },
+  { name: "Limba română", value: "ro" },
+  { name: "Русский (Russian)", value: "ru" },
+  { name: "Slovenský (Slovak)", value: "sk" },
+  { name: "Slovenski (Slovenian)", value: "sl" },
+  { name: "Svenska", value: "sv" },
+  { name: "Türkçe", value: "tr" },
+  { name: "Українська", value: "uk" },
+  { name: "简体中文 (simplified Chinese)", value: "zh" }
+];
+
 function renderOptions() {
+  const select = document.getElementById('defaultLang');
+  languages.forEach((lang) => {
+    const option = document.createElement('option');
+    option.value = lang.value;
+    option.text = lang.name;
+    select.appendChild(option);
+  });
+
   return browser.storage.local.get(['defaultLang', 'windowType']).then((store) => {
     document.getElementById('defaultLang').value = store.defaultLang || 'en';
 
@@ -9,8 +51,7 @@ function renderOptions() {
 }
 
 document.getElementById('defaultLang').addEventListener('click', (e) => {
-  console.log(e.target.value);
-  if (['en', 'bg', 'cs', 'da', 'de', 'es', 'et', 'el', 'fr', 'fi', 'hu', 'it', 'id', 'ja', 'ko', 'lv', 'lt', 'nb', 'nl', 'pl', 'pt-PT', 'pt-BR', 'ro', 'ru', 'sk', 'sl', 'sv', 'tr', 'uk', 'zh'].indexOf(e.target.value) !== -1) {
+  if (languages.some((lang) => lang.value === e.target.value)) {
     browser.storage.local.set({
       defaultLang: e.target.value
     });