Move locales to separate file

bundle.js

@@ -1,39 +1,4 @@
 window.leqsikoni = {
-  translations: {
-    en: {
-      Meanings: 'Meanings',
-      Commentary: 'Commentary',
-      Inflections: 'Inflections',
-      'Usage examples': 'Usage examples',
-    },
-    ru: {
-      Meanings: 'Значения',
-      Commentary: 'Комментарий',
-      Inflections: 'Формы слова',
-      'Usage examples': 'Примеры употребления',
-    },
-  },
-
-  translate: function(key, options) {
-    key = String(key)
-    if (!options || typeof(options) !== 'object') {
-      options = {}
-    }
-
-    var no_translation = '[no translation for key: ' + key + ']'
-
-    var locale = String($('#locale').val())
-    var translations = window.leqsikoni.translations[locale]
-    if (typeof(translations) === 'undefined') return no_translation
-
-    var translation = String(translations[key])
-    if (typeof(translation) === 'undefined') return no_translation
-
-    // TODO: apply options
-
-    return translation
-  },
-
   maybe_text: function(obj) {
     if (obj) {
       return String(obj).trim() || null
@@ -43,6 +8,8 @@ window.leqsikoni = {
   },
 
   app: function() {
+    window.i18n.locale = String($('#locale').val())
+
     if ($('#app').length === 0) return;
 
     var path = String(window.location.hash).substring(1)
@@ -57,10 +24,8 @@ window.leqsikoni = {
   words_xxxxx: function(word_id) {
     $('#app').html(window.leqsikoni.words_xxxxx_template())
 
-    var locale = String($('#locale').val())
-
     $.getJSON(
-      'http://localhost:4567/words/' + word_id + '?locale=' + locale,
+      'http://localhost:4567/words/' + word_id + '?locale=' + window.i18n.locale,
       function(data) {
         document.title = window.leqsikoni.maybe_text(data.primary_form) || ''
         $('#app').html(window.leqsikoni.words_xxxxx_template(data))
@@ -95,28 +60,28 @@ window.leqsikoni = {
     if (translations) {
       html +=
         '<div>' +
-        '<h2>' + window.leqsikoni.translate('Meanings') + '</h2>' +
+        '<h2>' + window.i18n.translate('Meanings') + '</h2>' +
         '<div>' + translations + '</div>' +
         '</div>'
     }
     if (commentary) {
       html +=
         '<div>' +
-        '<h2>' + window.leqsikoni.translate('Commentary') + '</h2>' +
+        '<h2>' + window.i18n.translate('Commentary') + '</h2>' +
         '<p>' + commentary + '</p>' +
         '</div>'
     }
     if (inflections) {
       html +=
         '<div>' +
-        '<h2>' + window.leqsikoni.translate('Inflections') + '</h2>' +
+        '<h2>' + window.i18n.translate('Inflections') + '</h2>' +
         '<div>' + inflections + '</div>' +
         '</div>'
     }
     if (examples) {
       html +=
         '<div>' +
-        '<h2>' + window.leqsikoni.translate('Usage examples') + '</h2>' +
+        '<h2>' + window.i18n.translate('Usage examples') + '</h2>' +
         '<div>' + examples + '</div>' +
         '</div>'
     }

i18n.js

@@ -0,0 +1,38 @@
+window.i18n = {
+  locale: null,
+
+  translate: function(key, options) {
+    key = String(key)
+    if (!options || typeof(options) !== 'object') {
+      options = {}
+    }
+
+    var no_translation = '[no translation for key: ' + key + ']'
+
+    var locale = String(window.i18n.locale)
+    var translations = window.i18n.translations[locale]
+    if (typeof(translations) === 'undefined') return no_translation
+
+    var translation = String(translations[key])
+    if (typeof(translation) === 'undefined') return no_translation
+
+    // TODO: apply options
+
+    return translation
+  },
+
+  translations: {
+    en: {
+      Meanings: 'Meanings',
+      Commentary: 'Commentary',
+      Inflections: 'Inflections',
+      'Usage examples': 'Usage examples',
+    },
+    ru: {
+      Meanings: 'Значения',
+      Commentary: 'Комментарий',
+      Inflections: 'Формы слова',
+      'Usage examples': 'Примеры употребления',
+    },
+  },
+}

index.html

@@ -20,6 +20,8 @@
       src="https://code.jquery.com/jquery-3.6.3.min.js"
       integrity="sha256-pvPw+upLPUjgMXY0G+8O0xUf+/Im1MZjXxxgOcBQBXU="
       crossorigin="anonymous"></script>
+
+    <script src="i18n.js"></script>
     <script src="bundle.js"></script>
   </body>
 </html>