Reorganizing file structure for i18n support

BTCPayServer/Views/Invoice/Checkout.cshtml

@@ -296,7 +296,7 @@
                                                 <span class="initial-label" i18n="">If there is an issue with this payment, or a refund needs to be made, we will contact you at this address.</span>
                                             </div>
                                             <div class="input-wrapper">
-                                                <input bp-focus="focusEmailInput" class="bp-input email-input ng-untouched ng-pristine" disabled="disabled" name="receiptEmail" placeholder="Your email" 
+                                                <input bp-focus="focusEmailInput" class="bp-input email-input ng-untouched ng-pristine" disabled="disabled" name="receiptEmail" placeholder="Your email"
                                                        style="opacity: 1;" type="email">
                                                 <button type="submit" class="action-button" style="margin-top: 15px;">
                                                     <span i18n="">Confirm email address</span>
@@ -624,18 +624,31 @@
                                     hoverIntent: 5000
                                 });
                             });
+
+                            function changeLanguage(lang) {
+                                i18next.changeLanguage(lang);
+                            }
                         </script>
                     </div>
                 </div>
             </div>
         </div>
     </invoice>
-    <style type="text/css">
-        input::-ms-clear {
-            display: none;
-        }
-    </style>
     <script type="text/javascript">
+        // initialization
+        i18next.init({
+            lng: 'en',
+            fallbackLng: 'en',
+            nsSeparator: false,
+            keySeparator: false,
+            resources: {
+                en: { translation: locales_en },
+                de: { translation: locales_de }
+            },
+        });
+
+        const i18n = new VueI18next(i18next);
+
         // TODO: Move all logic from core.js to Vue controller
         Vue.config.ignoredElements = [
             'line-items',

BTCPayServer/bundleconfig.json

@@ -46,9 +46,8 @@
             "wwwroot/vendor/vuejs/vue-qrcode.js",
             "wwwroot/vendor/i18next/i18next.js",
             "wwwroot/vendor/i18next/vue-i18next.js",
-            "wwwroot/js/checkout/i18n-resources.js",
-            "wwwroot/js/checkout/core.js",
-            "wwwroot/vendor/jquery-prettydropdowns/jquery.prettydropdowns.js"
+            "wwwroot/vendor/jquery-prettydropdowns/jquery.prettydropdowns.js",
+            "wwwroot/js/checkout/**/*.js"
         ]
     }
 ]

BTCPayServer/wwwroot/js/checkout/core.js

@@ -1,3 +1,5 @@
+// TODO: Refactor... switch from jQuery to Vue.js
+// public methods
 function resetTabsSlider() {
     $("#tabsSlider").removeClass("slide-copy");
     $("#tabsSlider").removeClass("slide-altcoins");
@@ -16,7 +18,6 @@ function resetTabsSlider() {
     $("#altcoins").removeClass("active");
 }
 
-// public methods
 function onDataCallback(jsonData) {
     var newStatus = jsonData.status;
 

BTCPayServer/wwwroot/js/checkout/i18n-resources.js

@@ -1,42 +0,0 @@
-const locales = {
-    en: {
-        nested: {
-            lang: 'Language',
-        },
-        "Awaiting Payment...": "Awaiting Payment...",
-        "Pay with": "Pay with",
-        "Scan": "Scan",
-        "Copy": "Copy",
-        "Conversion": "Conversion",
-        "Open in wallet": "Open in wallet"
-    },
-
-    de: {
-        nested: {
-            lang: 'Sprache',
-        },
-        "Awaiting Payment...": "Warten auf Zahlung...",
-        "Pay with": "Bezahlen mit",
-        "Scan": "Scan",
-        "Copy": "Kopieren",
-        "Conversion": "Umwandlung",
-        "Open in wallet": "In der Brieftasche öffnen"
-    },
-};
-
-i18next.init({
-    lng: 'en',
-    fallbackLng: 'en',
-    nsSeparator: false,
-    keySeparator: false,
-    resources: {
-        en: { translation: locales.en },
-        de: { translation: locales.de }
-    },
-});
-
-const i18n = new VueI18next(i18next);
-
-function changeLanguage(lang) {
-    i18next.changeLanguage(lang);
-}

BTCPayServer/wwwroot/js/checkout/langs/de.js

@@ -0,0 +1,11 @@
+const locales_de = {
+    nested: {
+        lang: 'Sprache',
+    },
+    "Awaiting Payment...": "Warten auf Zahlung...",
+    "Pay with": "Bezahlen mit",
+    "Scan": "Scan",
+    "Copy": "Kopieren",
+    "Conversion": "Umwandlung",
+    "Open in wallet": "In der Brieftasche öffnen"
+};

BTCPayServer/wwwroot/js/checkout/langs/en.js

@@ -0,0 +1,11 @@
+const locales_en = {
+    nested: {
+        lang: 'Language',
+    },
+    "Awaiting Payment...": "Awaiting Payment...",
+    "Pay with": "Pay with",
+    "Scan": "Scan",
+    "Copy": "Copy",
+    "Conversion": "Conversion",
+    "Open in wallet": "Open in wallet"
+};