6 changed files with 58 additions and 204 deletions
--- a/.gitignore
+++ b/.gitignore
@ -1,5 +1,4 @@
 tmp/
-index.html

 # Created by https://www.toptal.com/developers/gitignore/api/linux,windows,macos,direnv,vim,webstorm+all
 # Edit at https://www.toptal.com/developers/gitignore?templates=linux,windows,macos,direnv,vim,webstorm+all
--- a/8
+++ b/8
@ -1,6 +1,6 @@
 BULMA_RELEASE=$(shell curl -Ls "https://api.github.com/repos/jgthms/bulma/releases/latest" | jq -r '.tag_name')

-all: bulma qr-creator index.html
+all: bulma qr-creator

 .PHONY: bulma
 bulma:
@ -12,17 +12,13 @@ bulma:
 	cp tmp/bulma/css/bulma.css.map css/bulma.css.map
 	cp tmp/bulma/css/bulma.min.css css/bulma.min.css

-# https://nimiq.github.io/qr-creator/
 .PHONY: qr-creator
 qr-creator:
 	curl -Lsf https://unpkg.com/qr-creator@1.0.0/dist/qr-creator.es6.min.js -o js/qr-creator.es6.min.js
 	curl -Lsf https://unpkg.com/qr-creator@1.0.0/dist/qr-creator.min.js -o js/qr-creator.min.js
 	curl -Lsf https://unpkg.com/qr-creator@1.0.0/dist/qr-creator.min.js.map -o js/qr-creator.min.js.map

-index.html: index.html.pre i18n.json index.html.post
-	cat index.html.pre i18n.json index.html.post > index.html
-
 .PHONY: install
-install: index.html
+install:
 	rsync -var --progress ./img ./css ./js ./index.html ./site.webmanifest ./sticker.png mariko:/srv/www/bezahlbrudi.jetzt/

--- a/i18n.json
+++ b/i18n.json
@ -1,178 +0,0 @@
-{
-  "_flags": {
-    "de": "&#x1F1E9;&#x1F1EA;",
-    "ch": "&#x1F1E8;&#x1F1ED;",
-    "en": "&#x1F1EC;&#x1F1E7;",
-    "es": "&#x1F1EA;&#x1F1F8;",
-    "fr": "&#x1F1EB;&#x1F1F7;",
-    "gr": "&#x1F1EC;&#x1F1F7;",
-    "it": "&#x1F1EE;&#x1F1F9;",
-    "pl": "&#x1F1F5;&#x1F1F1;",
-    "tr": "&#x1F1F9;&#x1F1F7;"
-  },
-  "subtitle": {
-    "de": "Geld überweisen ohne Drittanbieter",
-    "ch": "Gäld überwise ohni Drittparteiä",
-    "en": "Transfer money without any 3rd parties",
-    "es": "Transfiere dinero sin intermediarios",
-    "fr": "Transférez de l'argent sans intermédiaires",
-    "gr": "Μεταφορά χρημάτων χωρίς τη μεσολάβηση τρίτων",
-    "it": "Inviare denaro senza ricorrere a servizi terzi",
-    "pl": "Przelewaj pieniądze bez pośredników",
-    "tr": "Üçüncü taraflar olmadan para transferi yapın"
-  },
-  "explain": {
-    "de": "Trag deine Daten ein und scanne den QR Code einfach mit deiner Banking-App. Probier es aus!",
-    "ch": "Trag dini Date i und scann de QR-Code mit dinere Banking-App. Probier’s us!",
-    "en": "Simply fill in your details and scan the QR code with your banking app. Give it a try!",
-    "es": "Rellena el formulario con tus datos y escanea el código QR con la app de tu banco. ¡Prueba!",
-    "fr": "Saisissez simplement vos informations et scannez le code QR avec votre application bancaire. Essayez !",
-    "gr": "Απλά συμπληρώστε τα στοιχεία σας και σκανάρετε τον QR κωδικό μέσω της eBanking εφαρμογής σας. Δοκιμάστε το!",
-    "it": "Inserisci i tuoi dati e scansiona il codice QR con la tua app bancaria. Provalo!",
-    "pl": "Po prostu wprowadź swoje dane i zeskanuj kod QR aplikacją bankową. Spróbuj!",
-    "tr": "Verilerini gir ve QR kodunu bankacılık uygulamanla kolayca tara. Dene!"
-  },
-  "name": {
-    "de": "Empfänger Name",
-    "ch": "Name vom Empfänger",
-    "en": "Receiver Name",
-    "es": "Nombre del beneficiario",
-    "fr": "Nom du bénéficiaire",
-    "gr": "Όνομα Δικαιούχου",
-    "it": "Nome del destinatario",
-    "pl": "Nazwa odbiorcy",
-    "tr": "Alıcının adı"
-  },
-  "iban": {
-    "de": "Empfänger IBAN",
-    "ch": "IBAN vom Empfänger",
-    "en": "Receiver IBAN",
-    "es": "IBAN del beneficiario",
-    "fr": "IBAN du bénéficiaire",
-    "gr": "IBAN Δικαιούχου",
-    "it": "Codice IBAN del destinatario",
-    "pl": "IBAN odbiorcy",
-    "tr": "Alıcının IBAN numarası"
-  },
-  "bic": {
-    "de": "Empfänger BIC",
-    "ch": "BIC vom Empfänger",
-    "en": "Receiver BIC",
-    "es": "BIC del beneficiario",
-    "fr": "BIC du bénéficiaire",
-    "gr": "BIC Δικαιούχου",
-    "it": "Codice BIC del destinatario",
-    "pl": "BIC odbiorcy",
-    "tr": "Alıcının BIC kodu"
-  },
-  "bic-help": {
-    "de": "Nur nötig wenn Sender oder Empfänger IBAN außerhalb der EU ist",
-    "ch": "Nur nötig, wenn IBAN vom Absender oder Empfänger usserhalb vo de EU isch",
-    "en": "Only needed if the Sender or Receiver IBAN is outside the EU",
-    "es": "Solo es necesario si el IBAN del beneficiario o del remitente no pertenece a la UE",
-    "fr": "Uniquement nécessaire si l’IBAN de l’émetteur ou du bénéficiaire est en dehors de l’UE",
-    "gr": "Χρειάζεται μόνο όταν ο Εντολέας ή ο Δικαιούχος βρίσκονται εκτός της Ε.Ε.",
-    "it": "Necessario solo se l'IBAN del mittente o del destinatario è al di fuori dell'UE.",
-    "pl": "Wymagane tylko, jeśli IBAN nadawcy lub odbiorcy znajduje się poza UE",
-    "tr": "Sadece gönderenin veya alıcının IBAN'ı AB dışındaysa gereklidir"
-  },
-  "amount": {
-    "de": "Betrag",
-    "ch": "Betrag",
-    "en": "Amount",
-    "es": "Cantidad",
-    "fr": "Montant",
-    "gr": "Ποσό",
-    "it": "Somma",
-    "pl": "Kwota",
-    "tr": "Miktar"
-  },
-  "purpose": {
-    "de": "Verwendungszweck",
-    "ch": "Zweck",
-    "en": "Purpose",
-    "es": "Concepto",
-    "fr": "Motif du virement",
-    "gr": "Αιτιολογία",
-    "it": "Causale",
-    "pl": "Tytuł przelewu",
-    "tr": "kullanım amacı"
-  },
-  "purpose-example": {
-    "de": "Bierchen!",
-    "ch": "Es Cafi!",
-    "en": "Beers!",
-    "es": "Tapas!",
-    "fr": "Fromage et vin!",
-    "gr": "Τσιπουρομεζέδες!",
-    "it": "Pizza!",
-    "pl": "Kawa!",
-    "tr": "Çay!"
-  },
-  "remember": {
-    "de": "Daten merken",
-    "ch": "Date merke",
-    "en": "Remember data",
-    "es": "Recordar datos",
-    "fr": "Mémoriser les données",
-    "gr": "Απομνημόνευση στοιχείων",
-    "it": "Ricorda dati",
-    "pl": "Zapamiętaj dane",
-    "tr": "Verileri hatırla"
-  },
-  "disclaimer": {
-    "de": "Der Quellcode ist lizensiert unter <a href=\"https://opensource.org/license/mit\">MIT</a>, du kannst ihn <a href=\"https://gitlab.com/xengi/bezahlbrudi/\">hier</a> finden.<br/>Diese Seite speichert keine Daten außerhalb deines Browsers, noch nicht einmal Cookies. Die \"Daten merken\" Funktion speichert Daten im Local Storage des Browsers.<br/>Diese Seite bietet keine Finanzdienstleistungen an. Sie ist lediglich ein QR Code Generator.",
-    "ch": "Dr Quellcode isch lizenziert unter <a href=\"https://opensource.org/license/mit\">MIT</a>, du finds ihn <a href=\"https://gitlab.com/xengi/bezahlbrudi/\">da</a>.<br/>Die Site speichert kei Date usserhalb vom Browser, nöd einisch Cookies. D’Funktion «Date merke» speichert im Local Storage vom Browser.<br/>Die Site bieted kei Finanzdienstleistige ah. Si isch nume en QR-Code-Generator.",
-    "en": "The source code is licensed under <a href=\"https://opensource.org/license/mit\">MIT</a>, you can find it <a href=\"https://gitlab.com/xengi/bezahlbrudi/\">here</a>.<br/>This site doesn't store any data outside your browser, not even cookies. The \"Remember data\" function stores your data in your browsers local storage.<br/>This site doesn't provide any financial services. It is a simple QR code generator.",
-    "es": "El código fuente tiene licencia <a href=\"https://opensource.org/license/mit\">MIT</a>, puede encontrar detalles <a href=\"https://gitlab.com/xengi/bezahlbrudi/\">aquí</a>.<br/>Esta página no guarda ningún dato fuera del navegador o en las cookies. La función \"Recordar datos\" guarda los datos en el almacenamiento local del navegador (local storage).<br/>Esta página web no proporciona servicios financieros. Es un simple generador de códigos QR.",
-    "fr": "Le code source est sous licence <a href=\"https://opensource.org/license/mit\">MIT</a>, vous pouvez le trouver <a href=\"https://gitlab.com/xengi/bezahlbrudi/\">ici</a>.<br/>Ce site n’enregistre aucune donnée en dehors de votre navigateur, pas même de cookies. La fonction «Mémoriser les données» stocke vos informations dans le stockage local du navigateur.<br/>Ce site ne fournit aucun service financier. Il s’agit simplement d’un générateur de codes QR.",
-    "gr": "Ο πηγαίος κώδικας διατίθεται με άδεια χρήσης <a href=\"https://opensource.org/license/mit\">MIT</a> και μπορείτε να τον βρείτε <a href=\"https://gitlab.com/xengi/bezahlbrudi/\">εδώ</a>.<br/>Αυτός ο ιστότοπος δεν αποθηκεύει κανένα δεδομένο εκτός του προγράμματος περιήγησής σας, ούτε καν cookies. Η λειτουργία «Απομνημόνευση στοιχείων» αποθηκεύει τα δεδομένα σας στον τοπικό χώρο αποθήκευσης του προγράμματος περιήγησής σας.<br/>Ο ιστότοπος αυτός δεν παρέχει καμία χρηματοπιστωτική υπηρεσία. Πρόκειται για μια απλή γεννήτρια QR κωδικών.",
-    "it": "Il codice sorgente è concesso in licenza <a href=\"https://opensource.org/license/mit\">MIT</a>, lo puoi trovare <a href=\"https://gitlab.com/xengi/bezahlbrudi/\">qui</a>.<br/>Questo sito non memorizza dati al di  fuori del tuo browser, nemmeno i cookie. La funzione “Ricorda dati” memorizza i dati nella memoria locale del browser.<br/>Questo sito non offre servizi finanziari. È solo un generatore di codici QR.",
-    "pl": "Kod źródłowy jest objęty licencją <a href=\"https://opensource.org/license/mit\">MIT</a>, możesz go znaleźć <a href=\"https://gitlab.com/xengi/bezahlbrudi/\">tutaj</a>.<br/>Ta strona nie przechowuje żadnych danych poza Twoją przeglądarką, nawet plików cookie. Funkcja „Zapamiętaj dane” zapisuje dane w pamięci lokalnej przeglądarki.<br/>Ta strona nie świadczy usług finansowych. To tylko prosty generator kodów QR.",
-    "tr": "Kaynak kodu <a href=\"https://opensource.org/license/mit\">MIT</a> lisansı altındadır, <a href=\"https://gitlab.com/xengi/bezahlbrudi/\">buradan</a> ulaşabilirsiniz.<br/>Bu site, tarayıcınız dışında hiçbir veri, hatta Cookies bile saklamaz. “Verileri hatırla” işlevi, verileri tarayıcının \"Local Storage\" alanında saklar.<br/>Bu site finansal hizmetler sunmaz. Sadece bir QR Kod Oluşturucu'dur."
-  },
-  "help-name": {
-    "de": "Namen dürfen maximal 70 Zeichen lang sein.",
-    "ch": "Dr Name darf höchstens 70 Zeichä lang sii.",
-    "en": "Name can have 70 characters max.",
-    "es": "El nombre puede tener hasta un máximo de 70 caracteres",
-    "fr": "Le nom peut contenir au maximum 70 caractères.",
-    "gr": "Το πεδίο «Όνομα» μπορεί να περιέχει έως 70 χαρακτήρες.",
-    "it": "Il nome può avere al massimo 70 caratteri.",
-    "pl": "Nazwa może mieć maksymalnie 70 znaków.",
-    "tr": "Ad en fazla 70 karakter olabilir."
-  },
-  "help-bic": {
-    "de": "BIC ist ungültig.",
-    "ch": "De BIC isch ungültig.",
-    "en": "BIC is invalid.",
-    "es": "BIC inválido.",
-    "fr": "Le BIC est invalide.",
-    "gr": "Το πεδίο «BIC» είναι εσφαλμένο.",
-    "it": "Il BIC non è valido.",
-    "pl": "BIC jest nieprawidłowy.",
-    "tr": "BIC geçersiz."
-  },
-  "help-iban": {
-    "de": "IBAN ist ungültig.",
-    "ch": "De IBAN isch ungültig.",
-    "en": "IBAN is invalid.",
-    "es": "IBAN inválido.",
-    "fr": "L’IBAN est invalide.",
-    "gr": "Το πεδίο «IBAN» είναι εσφαλμένο.",
-    "it": "L'IBAN non è valido.",
-    "pl": "IBAN jest nieprawidłowy.",
-    "tr": "IBAN geçersiz."
-  },
-  "help-purpose": {
-    "de": "Verwendungszweck darf maximal 140 Zeichen lang sein und nur die Zeichen A-Z, a-z, 0-9, /?:().,'+- und Leerzeichen enthalten.",
-    "ch": "Dr Zweck darf höchstens 140 Zeichä lang sii und nume A-Z, a-z, 0-9, /?:().,'+- und Lärespäzi enthaltä.",
-    "en": "Purpose can have 140 characters max and only include A-Z, a-z, 0-9, /?:().,'+- and spaces.",
-    "es": "El concepto puede tener hasta un máximo de 140 caracteres y solo puede incluir letras, símbolos y espacios: A-Z, a-z, 0-9, /?:().,'+-",
-    "fr": "Le motif du virement peut contenir au maximum 140 caractères et uniquement les caractères A-Z, a-z, 0-9, /?:().,'+- et espaces.",
-    "gr": "Το πεδίο «Αιτιολογία» μπορεί να περιέχει έως και 140 χαρακτήρες και να περιέχει μόνο τα γράμματα: A-Z, a-z, αριθμούς: 0-9, τα σύμβολα: /?:().,'+- καθώς και κενά.",
-    "it": "La causale può avere al massimo 140 caratteri e può includere solo i caratteri A-Z, a-z, 0-9, /?:().,'+- e spazi.",
-    "pl": "Tytuł przelewu może mieć maksymalnie 140 znaków i może zawierać tylko znaki A-Z, a-z, 0-9, /?:().,'+- oraz spacje.",
-    "tr": "Kullanım amacı en fazla 140 karakter olabilir ve yalnızca A-Z, a-z, 0-9, /?:().,'+- ve boşluk içerebilir."
-  }
-}
--- a/index.html.pre
+++ b/index.html.pre
@ -5,9 +5,6 @@
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="robots" content="index, follow">

-    <!-- bezahlbrudi is reachable via HTTP/3, TLS1.3 and IPv6. Only the hottest tech for my brudis! -->
-    <!-- try it with: curl -6 --tlsv1.3 --http3-only https://bezahlbrudi.jetzt -->
-
    <!-- mobile app and bookmarks -->
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="mobile-web-app-capable" content="yes">
@ -23,14 +20,13 @@
    <!-- social media -->
    <meta property="og:title" content="BezahlBrudi">
    <meta property="og:description" content="Webapp that generates GiroCodes (EPC QR-Code) so that you can easily exchange money with friends and family without involving third party financial services">
-    <meta property="og:url" content="https://bezahlbrudi.jetzt">
    <meta property="og:image" content="https://bezahlbrudi.jetzt/img/icon-512.png">
    <meta property="og:image:alt" content="Hero with cape">
    <meta name="twitter:title" content="BezahlBrudi">
    <meta name="twitter:description" content="Webapp that generates GiroCodes (EPC QR-Code) so that you can easily exchange money with friends and family without involving third party financial services">
-    <meta name="twitter:url" content="https://bezahlbrudi.jetzt/?src=twitter">
-    <meta name="twitter:image:src" content="https://bezahlbrudi.jetzt/img/icon-512.png">
-    <meta name="twitter:image:alt" content="Hero with cape">
+    <meta name="twitter:url" content="https://bezahlbrudi.jetzt/?src=twitter" />
+    <meta name="twitter:image:src" content="https://bezahlbrudi.jetzt/img/icon-512.png" />
+    <meta name="twitter:image:alt" content="Hero with cape" />

    <!-- icons and color -->
    <meta name="theme-color" content="#ffffff">
@ -101,7 +97,7 @@
                <div id="name" class="field">
                    <label for="input-name" class="label" data-i18n="name"></label>
                    <div class="control has-icons-right">
-                        <input id="input-name" class="input" type="text" placeholder="" value="" maxlength="70" required>
+                        <input id="input-name" class="input" type="text" placeholder="Receiver Name" value="" maxlength="70" required>
                        <span class="icon is-small is-right"></span>
                    </div>
                </div>
@ -162,12 +158,61 @@
        <p>
            <strong>BezahlBrudi v1.2.0</strong> by <a href="https://xengi.de">XenGi</a>.
            <span data-i18n="disclaimer">
-                The source code is licensed under <a href="https://opensource.org/license/mit">MIT</a>, you can find it <a href="https://git.xengi.de/xengi/bezahlbrudi/">here</a>.
+                The source code is licensed under <a href="https://opensource.org/license/mit">MIT</a>, you can find it <a href="https://gitlab.com/xengi/bezahlbrudi/">here</a>.
                <br/>
                This site doesn't store any data outside your browser, not even cookies. The "Remember data" function stores your data in your browsers local storage. This site doesn't provide any financial services. It is a simple QR code generator.</span>
        </p>
    </div>
 </footer>

-<!-- "fr": "&#x1F1EB;&#x1F1F7;" -->
 <script type="application/json" id="i18n-data">
+{
+    "_flags": {
+        "en": "&#x1F1EC;&#x1F1E7;",
+        "de": "&#x1F1E9;&#x1F1EA;"
+    },
+    "subtitle": {
+        "en": "Transfer money without any 3rd parties",
+        "de": "Geld überweisen ohne Drittanbieter"
+    },
+    "explain": {
+        "en": "Simply fill in your details and scan the QR code with your banking app. Give it a try!",
+        "de": "Trag deine Daten ein und scanne den QR Code einfach mit deiner Banking-App. Probier es aus!"
+    },
+    "name": {
+        "en": "Receiver Name",
+        "de": "Empfänger Name"
+    },
+    "iban": {
+        "en": "Receiver IBAN",
+        "de": "Empfänger IBAN"
+    },
+    "bic": {
+        "en": "Receiver BIC",
+        "de": "Empfänger BIC"
+    },
+    "bic-help": {
+        "en": "Only needed if the Sender or Receiver IBAN is outside the EU",
+        "de": "Nur nötig wenn Sender oder Empfänger IBAN außerhalb der EU ist"
+    },
+    "amount": {
+        "en": "Amount",
+        "de": "Betrag"
+    },
+    "purpose": {
+        "en": "Purpose",
+        "de": "Verwendungszweck"
+    },
+    "remember": {
+        "en": "Remember data",
+        "de": "Daten merken"
+    },
+    "disclaimer": {
+        "en": "The source code is licensed under <a href=\"https://opensource.org/license/mit\">MIT</a>, you can find it <a href=\"https://gitlab.com/xengi/bezahlbrudi/\">here</a>.<br/>This site doesn't store any data outside your browser, not even cookies. The \"Remember data\" function stores your data in your browsers local storage.<br/>This site doesn't provide any financial services. It is a simple QR code generator.",
+        "de": "Der Quellcode ist lizensiert unter <a href=\"https://opensource.org/license/mit\">MIT</a>, du kannst ihn <a href=\"https://gitlab.com/xengi/bezahlbrudi/\">hier</a> finden.<br/>Diese Seite speichert keine Daten außerhalb deines Browsers, noch nicht einmal Cookies. Die \"Daten merken\" Funktion speichert Daten im Local Storage des Browsers.<br/>Diese Seite bietet keine Finanzdienstleistungen an. Sie ist lediglich ein QR Code Generator."
+    }
+}
+</script>
+<script src="js/index.js"></script>
+</body>
+</html>
--- a/index.html.post
+++ b/index.html.post
@ -1,5 +0,0 @@
-</script>
-<script src="js/index.js"></script>
-</body>
-</html>
-
--- a/js/index.js
+++ b/js/index.js
@ -40,14 +40,11 @@ for (const l of i18nSupported) {

 changeLanguage = (l) => {
  const lang = i18nSupported.includes(l) ? l : "en";
-  console.log(`Switching language to ${lang}`);
  document.querySelectorAll("[data-i18n]").forEach(el => {
    el.innerHTML = i18n[el.dataset.i18n][lang];
  });
  document.getElementById("current-language").innerHTML = `${i18n._flags[lang]} ${lang.toUpperCase()}`;
-  document.getElementById("input-purpose").placeholder = i18n["purpose-example"][lang];
-  document.documentElement.lang = lang;
-  saveFormData();
+  console.log(`Switching language to ${lang}`);
 };

 saveFormData = () => {