From abdc5103055844da73438e8dfbb0eea2b41105d1 Mon Sep 17 00:00:00 2001
From: Nicolai Ort <info@nicolai-ort.com>
Date: Wed, 7 Apr 2021 20:35:46 +0200
Subject: [PATCH] Added track to config

ref #1
---
 src/App.svelte        |  4 ++--
 src/Beamershow.svelte |  4 ++--
 src/Login.svelte      | 37 ++++++++++++++++++++++++++++++++++---
 src/store.js          |  5 +++++
 4 files changed, 43 insertions(+), 7 deletions(-)

diff --git a/src/App.svelte b/src/App.svelte
index cd1b8cc..3cfef4c 100644
--- a/src/App.svelte
+++ b/src/App.svelte
@@ -1,5 +1,5 @@
 <script>
-  import { apikey, api_endpoint, lang, page, clear } from "./store.js";
+  import { apikey, api_endpoint, lang, page, clear, laptime_track } from "./store.js";
   import { addMessages, init } from "svelte-i18n";
   import en from "./locales/en.json";
   import de from "./locales/de.json";
@@ -11,7 +11,7 @@
   import Beamershow from "./Beamershow.svelte";
   import Login from "./Login.svelte";
   import Settings from "./Settings.svelte";
-  $: is_configured = $apikey && $apikey !== "null" && $apikey !== "";
+  $: is_configured = $apikey && $apikey !== "null" && $apikey !== "" && $laptime_track != 0 && $laptime_track != null;
   $: settings_open = $page === "settings";
   init({
     fallbackLocale: "en-US",
diff --git a/src/Beamershow.svelte b/src/Beamershow.svelte
index 7bf59b7..47cd5a6 100644
--- a/src/Beamershow.svelte
+++ b/src/Beamershow.svelte
@@ -2,7 +2,7 @@
   import axios from "axios";
   import { _ } from "svelte-i18n";
   import { fade, slide } from "svelte/transition";
-  import { apikey, api_endpoint, page, stationinfo } from "./store.js";
+  import { apikey, api_endpoint, laptime_track, page, stationinfo } from "./store.js";
   function init(el) {
     el.focus();
   }
@@ -73,7 +73,7 @@
     axios
       .request({
         method: "GET",
-        url: $api_endpoint + "api/stats/runners/laptime",
+        url: $api_endpoint + "api/stats/runners/laptime?track="+$laptime_track,
         headers: { Authorization: "Bearer " + $apikey },
       })
       .then(function ({ data }) {
diff --git a/src/Login.svelte b/src/Login.svelte
index 3122bab..1c565ad 100644
--- a/src/Login.svelte
+++ b/src/Login.svelte
@@ -1,11 +1,12 @@
 <script>
-  import { apikey, lang, stationinfo, api_endpoint } from "./store.js";
+  import { apikey, lang, stationinfo, api_endpoint, laptime_track } from "./store.js";
   import isURL from "validator/lib/isURL";
   import isUUID from "validator/lib/isUUID";
   import axios from "axios";
   import { _, locale } from "svelte-i18n";
   let token;
   let api_endpoint_input = "";
+  let track;
   $: error = false;
   $: errormessage = "";
   $: isTokenValid =
@@ -61,12 +62,11 @@
           </div>
         {/if}
       {/if}
-      {#if $api_endpoint}
+      {#if $api_endpoint && !$apikey}
         <form
           class="flex flex-col pt-3 md:pt-8"
           onsubmit="event.preventDefault();"
           on:submit={() => {
-            // return
             axios
               .request({
                 method: "GET",
@@ -113,6 +113,37 @@
             >{$_("configure")}</button
           >
         </form>
+      {:else if $api_endpoint && $apikey}
+        <form
+          class="flex flex-col pt-3 md:pt-8"
+          onsubmit="event.preventDefault();"
+          on:submit={() => {
+                laptime_track.set(track);
+          }}
+        >
+          <div class="flex flex-col pt-4">
+            <label for="track" class="text-lg">Track ID</label>
+            <input
+              type="number"
+              id="track"
+              placeholder="Track"
+              bind:value={track}
+              class:border-red-500={!isTokenValid}
+              class:border-solid={!isTokenValid}
+              class:border-3={!isTokenValid}
+              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"
+            />
+          </div>
+          <button
+            disabled={!track}
+            class:cursor-pointer={track}
+            class:opacity-50={!track}
+            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
+          >
+        </form>
       {:else}
         <form
           class="flex flex-col pt-3 md:pt-8"
diff --git a/src/store.js b/src/store.js
index 1c360c3..9f73b43 100644
--- a/src/store.js
+++ b/src/store.js
@@ -15,6 +15,11 @@ export const stationinfo = writable(stored_stationinfo);
 stationinfo.subscribe((value) => {
 	localStorage.setItem('stationinfo', value);
 });
+const stored_laptime_track = localStorage.getItem('laptime_track');
+export const laptime_track = writable(stored_laptime_track);
+laptime_track.subscribe((value) => {
+	localStorage.setItem('laptime_track', value);
+});
 const stored_page = localStorage.getItem('page');
 export const page = writable(stored_page);
 page.subscribe((value) => {