🌎 all translations

ref #1

app/src/App.svelte

@@ -6,7 +6,7 @@
   addMessages("en-US", en);
   addMessages("de", de);
   addMessages("de-DE", de);
-  // 
+  //
   import Scanner from "./Scanner.svelte";
   import Login from "./Login.svelte";
   import Settings from "./Settings.svelte";
@@ -14,10 +14,10 @@
   $: is_configured = $apikey && $apikey !== "null" && $apikey !== "";
   $: settings_open = $page === "settings";
   console.log($page);
-  // 
+  //
   init({
     fallbackLocale: "en-US",
-    initialLocale: $lang
+    initialLocale: $lang,
   });
 </script>
 

app/src/Login.svelte

@@ -1,7 +1,7 @@
 <script>
   import { apikey, lang, stationinfo } from "./store.js";
   import axios from "axios";
-import { _ ,locale} from "svelte-i18n";
+  import { _, locale } from "svelte-i18n";
   let token;
   $: error = false;
   $: errormessage = "";
@@ -9,9 +9,9 @@ import { _ ,locale} from "svelte-i18n";
     token?.length === 44 &&
     token.split(".")[0].length === 7 &&
     isUUID(token.split(".")[1]);
-    function isLocale(l){
+  function isLocale(l) {
-return $locale == l;
+    return $locale == l;
-    }
+  }
   function isUUID(uuid) {
     let s = "" + uuid;
 
@@ -38,12 +38,13 @@ return $locale == l;
     <div
       class="flex flex-col justify-center md:justify-start my-auto pt-8 md:pt-0 px-8 md:px-24 lg:px-32"
     >
-      <p class="text-center text-3xl">{$_('configuration')}</p>
+      <p class="text-center text-3xl">{$_("configuration")}</p>
       <p class="text-center">
-        {$_('please_provide_the_scan_client_token')}<br /><a
+        {$_("please_provide_the_scan_client_token")}<br /><a
           target="_blank"
           class="underline"
-          href="https://docs.lauf-fuer-kaya.de/">{$_('see_our_configuration_guide')}</a
+          href="https://docs.lauf-fuer-kaya.de/"
+          >{$_("see_our_configuration_guide")}</a
         >
       </p>
       {#if error}
@@ -52,7 +53,9 @@ return $locale == l;
             class="text-white px-6 py-4 border-0 rounded relative bg-red-500 mt-2"
           >
             <span class="inline-block align-middle">
-              <b class="capitalize">{$_('error')}</b><br />{$_('the_provided_scan_station_token_is_invalid')}<br />{$_('please_check_your_token_and_try_again')}
+              <b class="capitalize">{$_("error")}</b><br />{$_(
+                "the_provided_scan_station_token_is_invalid"
+              )}<br />{$_("please_check_your_token_and_try_again")}
             </span>
           </div>
         {/if}
@@ -61,7 +64,9 @@ return $locale == l;
             class="text-white px-6 py-4 border-0 rounded relative bg-red-500 mt-2"
           >
             <span class="inline-block align-middle">
-              <b class="capitalize">{$_('error')}</b><br />{$_('the_provided_scan_station_is_disabled')}
+              <b class="capitalize">{$_("error")}</b><br />{$_(
+                "the_provided_scan_station_is_disabled"
+              )}
             </span>
           </div>
         {/if}
@@ -92,11 +97,11 @@ return $locale == l;
         }}
       >
         <div class="flex flex-col pt-4">
-          <label for="token" class="text-lg">{$_('client_token')}</label>
+          <label for="token" class="text-lg">{$_("client_token")}</label>
           <input
             type="text"
             id="token"
-            placeholder={$_('client_token')}
+            placeholder={$_("client_token")}
             bind:value={token}
             class:border-red-500={!isTokenValid}
             class:border-solid={!isTokenValid}
@@ -105,7 +110,9 @@ return $locale == l;
           />
         </div>
         {#if !isTokenValid}
-          <span class="text-sm">{$_('please_provide_a_valid_client_token')}</span>
+          <span class="text-sm"
+            >{$_("please_provide_a_valid_client_token")}</span
+          >
         {/if}
         <button
           disabled={!isTokenValid}
@@ -114,7 +121,7 @@ return $locale == l;
           id="configure"
           type="submit"
           class="bg-black text-white font-bold text-lg hover:bg-gray-700 p-2 mt-8 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-black"
-          >{$_('configure')}</button
+          >{$_("configure")}</button
         >
       </form>
       <div class="text-center pt-12 pb-12">

app/src/Scanner.svelte

@@ -1,7 +1,7 @@
 <script>
   import axios from "axios";
-import { _ } from "svelte-i18n";
+  import { _ } from "svelte-i18n";
-  import { apikey, lang, page, stationinfo } from "./store.js";
+  import { apikey, page, stationinfo } from "./store.js";
   function init(el) {
     el.focus();
   }
@@ -100,7 +100,7 @@ import { _ } from "svelte-i18n";
       >
         <label class="block">
           <span class="block mb-1 text-xs font-medium text-gray-700"
-            >Runner Card</span
+            >{$_('runner_card')}</span
           >
           <input
             class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 mt-1 leading-tight focus:outline-none focus:shadow-outline"
@@ -121,9 +121,9 @@ import { _ } from "svelte-i18n";
           <h1 class="text-3xl font-bold text-center">lap time</h1>
           <h1 class="text-8xl font-bold text-center">{lastscan_laptime}</h1>
         {:else}
-          <h1 class="text-3xl font-bold text-center">please scan a card...</h1>
+          <h1 class="text-3xl font-bold text-center">{$_('please_scan_a_card')}</h1>
         {/if}
-        <button type="submit" class="hidden">Scan!</button>
+        <button type="submit" class="hidden">{$_('scan')}</button>
       </form>
     </div>
   </section>

app/src/Settings.svelte

@@ -1,4 +1,6 @@
 <script>
+import { _ } from "svelte-i18n";
+
   import { apikey, lang, page, stationinfo } from "./store.js";
 </script>
 
@@ -6,30 +8,30 @@
   <h1 class="font-bold text-3xl w-full text-center text-gray-900">
     Lauf Für Kaya! Scan 📷
   </h1>
-  <h1 class="text-3xl w-full text-center text-gray-900">Settings</h1>
+  <h1 class="text-3xl w-full text-center text-gray-900">{$_('settings')}</h1>
-  <p class="block text-sm font-bold text-gray-700 mt-2">API Key</p>
+  <p class="block text-sm font-bold text-gray-700 mt-2">{$_('api_key')}</p>
   <p class="block text-sm text-gray-700">{$apikey}</p>
-  <p class="block text-sm font-bold text-gray-700 mt-2">Station Description</p>
+  <p class="block text-sm font-bold text-gray-700 mt-2">{$_('station_description')}</p>
   <p class="block text-sm text-gray-700">
     {JSON.parse($stationinfo).description}
   </p>
-  <p class="block text-sm font-bold text-gray-700 mt-2">Station ID</p>
+  <p class="block text-sm font-bold text-gray-700 mt-2">{$_('station_id')}</p>
   <p class="block text-sm text-gray-700">{JSON.parse($stationinfo).id}</p>
-  <p class="block text-sm font-bold text-gray-700 mt-2">Track ID</p>
+  <p class="block text-sm font-bold text-gray-700 mt-2">{$_('track_id')}</p>
   <p class="block text-sm text-gray-700">{JSON.parse($stationinfo).track.id}</p>
-  <p class="block text-sm font-bold text-gray-700 mt-2">Track Name</p>
+  <p class="block text-sm font-bold text-gray-700 mt-2">{$_('track_name')}</p>
   <p class="block text-sm text-gray-700">
     {JSON.parse($stationinfo).track.name}
   </p>
-  <p class="block text-sm font-bold text-gray-700 mt-2">Track Distance</p>
+  <p class="block text-sm font-bold text-gray-700 mt-2">{$_('track_distance')}</p>
   <p class="block text-sm text-gray-700">
     {JSON.parse($stationinfo).track.distance}
   </p>
-  <p class="block text-sm font-bold text-gray-700 mt-2">minimum lap time</p>
+  <p class="block text-sm font-bold text-gray-700 mt-2">{$_('minimum_lap_time')}</p>
   <p class="block text-sm text-gray-700">
     {JSON.parse($stationinfo).track.minimumLapTime}s
   </p>
-  <p class="block text-sm font-bold text-gray-700 mt-2">Language</p>
+  <p class="block text-sm font-bold text-gray-700 mt-2">{$_('language')}</p>
   <div class="w-full">
     <div class="inline-block mr-2 mt-2">
       <button
@@ -90,7 +92,7 @@
       page.set("");
     }}
     class="mb-3 w-full py-3 border-black border-3 text-black focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-black"
-    >Back to Scanner</button
+    >{$_('back_to_scanner')}</button
   >
   <button
     on:click={() => {
@@ -98,6 +100,6 @@
       page.set("");
     }}
     class="w-full py-3 bg-black text-white focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-black"
-    >Log Out from this Client</button
+    >{$_('log_out_from_this_client')}</button
   >
 </div>

app/src/locales/de.json

@@ -1,12 +1,26 @@
 {
+    "api_key": "API Key",
+    "back_to_scanner": "Zurück zum Scanner",
     "client_token": "Client Token",
     "configuration": "Konfiguration",
     "configure": "Konfigurieren",
     "error": "Error!",
+    "language": "Sprache",
+    "log_out_from_this_client": "Von diesem Scanner abmelden",
+    "minimum_lap_time": "minimale Rundenzeit",
     "please_check_your_token_and_try_again": "Bitte überprüfe den Token und versuche es erneut...",
     "please_provide_a_valid_client_token": "Bitte gebe einen gültigen Client-Token an ...",
     "please_provide_the_scan_client_token": "Bitte gebe den Scan-Client-Token an.",
+    "please_scan_a_card": "Bitte scanne eine Karte ...",
+    "runner_card": "Läuferkarte",
+    "scan": "Scannen!",
     "see_our_configuration_guide": "Siehe dir unsere Konfigurationsanleitung an.",
+    "settings": "Einstellungen",
+    "station_description": "Beschreibung der Scanstation",
+    "station_id": "Scanstations-ID",
     "the_provided_scan_station_is_disabled": "Die angegebene Scanstation ist deaktiviert.",
-    "the_provided_scan_station_token_is_invalid": "Der angegebene Scanstation-Token ist ungültig."
+    "the_provided_scan_station_token_is_invalid": "Der angegebene Scanstation-Token ist ungültig.",
+    "track_distance": "Länge des Tracks",
+    "track_id": "Track ID",
+    "track_name": "Track Name"
 }

app/src/locales/en.json

@@ -1,12 +1,26 @@
 {
+    "api_key": "API Key",
+    "back_to_scanner": "Back to Scanner",
     "client_token": "Client Token",
     "configuration": "Configuration",
     "configure": "Configure",
     "error": "Error!",
+    "language": "Language",
+    "log_out_from_this_client": "Log Out from this Client",
+    "minimum_lap_time": "minimum lap time",
     "please_check_your_token_and_try_again": "Please check your token and try again...",
     "please_provide_a_valid_client_token": "Please provide a valid client token...",
     "please_provide_the_scan_client_token": "Please provide the scan client token.",
+    "please_scan_a_card": "please scan a card...",
+    "runner_card": "Runner Card",
+    "scan": "Scan!",
     "see_our_configuration_guide": "See our configuration guide.",
+    "settings": "Settings",
+    "station_description": "Station Description",
+    "station_id": "Scanstation ID",
     "the_provided_scan_station_is_disabled": "The provided scan station is disabled.",
-    "the_provided_scan_station_token_is_invalid": "The provided scan station token is invalid."
+    "the_provided_scan_station_token_is_invalid": "The provided scan station token is invalid.",
+    "track_distance": "Track Distance",
+    "track_id": "Track ID",
+    "track_name": "Track Name"
 }