🚀Bumped version to 1.0.1

And bumped build image to fresh node

.drone.yml

@@ -12,6 +12,13 @@ get:
   path: odit-registry-builder
   name: password
 
+---
+kind: secret
+name: npm_url
+get:
+  path: odit-npm-cache
+  name: url
+
 ---
 kind: pipeline
 type: kubernetes
@@ -26,6 +33,9 @@ steps:
         from_secret: docker_username
       password:
         from_secret: docker_password
+      build_args:
+        - NPM_REGISTRY_URL:
+          from_secret: npm_url
       repo: registry.odit.services/lfk/beamershow
       tags:
         - dev
@@ -37,6 +47,34 @@ trigger:
   event:
     - push
 
+---
+kind: pipeline
+type: kubernetes
+name: build:latest
+
+steps:
+  - name: build latest
+    image: plugins/docker
+    depends_on: [clone]
+    settings:
+      username:
+        from_secret: docker_username
+      password:
+        from_secret: docker_password
+      build_args:
+        - NPM_REGISTRY_URL:
+          from_secret: npm_url
+      repo: registry.odit.services/lfk/beamershow
+      tags:
+        - latest
+      registry: registry.odit.services
+      mtu: 1000
+trigger:
+  branch:
+    - main
+  event:
+    - push
+
 ---
 kind: pipeline
 type: kubernetes
@@ -50,6 +88,9 @@ steps:
         from_secret: docker_username
       password:
         from_secret: docker_password
+      build_args:
+        - NPM_REGISTRY_URL:
+          from_secret: npm_url
       repo: registry.odit.services/lfk/beamershow
       tags:
         - '${DRONE_TAG}'

CHANGELOG.md

@@ -2,11 +2,57 @@
 
 All notable changes to this project will be documented in this file. Dates are displayed in UTC.
 
+#### [1.0.1](https://git.odit.services/lfk/beamershow/compare/1.0.0...1.0.1)
+
+- fix bg image? [`dc588e8`](https://git.odit.services/lfk/beamershow/commit/dc588e83c03d7e381f67c52b5fd5430fd0462742)
+
+### [1.0.0](https://git.odit.services/lfk/beamershow/compare/0.1.5...1.0.0)
+
+> 15 April 2023
+
+- pin clock to bottom [`b287db4`](https://git.odit.services/lfk/beamershow/commit/b287db4d0a57e8a07d30b756ce0bea30da5ef4e3)
+- update font to match lfk 2023 branding [`70a6120`](https://git.odit.services/lfk/beamershow/commit/70a61204471cea8f8d5dc17ad225c39c5cd91a43)
+- bump windicss [`c33157e`](https://git.odit.services/lfk/beamershow/commit/c33157e2d4c5e4a5e9d30d96650e0bfa5ab1ab57)
+- 1 more empty state [`f909575`](https://git.odit.services/lfk/beamershow/commit/f909575ca5ac862ec8e34d783831c2fcb53f2083)
+- add empty state for runners_laptime [`8139a3f`](https://git.odit.services/lfk/beamershow/commit/8139a3f60b3544a8992d97b8b9d49520b28270bd)
+- 🚀Bumped version to 1.0.0 [`5d764a8`](https://git.odit.services/lfk/beamershow/commit/5d764a80a7d25be7f6c2bb29a22b816875a739bf)
+- updated pnpm lock [`de37339`](https://git.odit.services/lfk/beamershow/commit/de373390ba7051e22f1c4904b1ed60e1dc0e0c7a)
+- text responsiveness [`9b83b38`](https://git.odit.services/lfk/beamershow/commit/9b83b38356b3faa677421a98c8655bc2357fb489)
+- fix: font responsiveness [`38b0fcc`](https://git.odit.services/lfk/beamershow/commit/38b0fccb5abf762b88d5a8a3ad27cb80cf85ccb0)
+- fix: typo [`8a4974f`](https://git.odit.services/lfk/beamershow/commit/8a4974ffa95b4d45f14c14130d7b7cb584c5cb52)
+- format donation total [`431fc5a`](https://git.odit.services/lfk/beamershow/commit/431fc5a0474076568e9184d4c6b9819af6cc2e3f)
+- default fallback on no data [`e04e671`](https://git.odit.services/lfk/beamershow/commit/e04e6713bc282810da2a0d103484cb6043af6063)
+- formatting [`047941b`](https://git.odit.services/lfk/beamershow/commit/047941babbccb1f0674347babfa1468ac51fa487)
+- monospace clock [`b50398f`](https://git.odit.services/lfk/beamershow/commit/b50398f6eb4e99e4d1c0d654e2710b265186837a)
+- formatting [`ee97997`](https://git.odit.services/lfk/beamershow/commit/ee9799736f912f32e37e0d5d06a5591ec6180a31)
+- improved clock position on xl [`0f32c71`](https://git.odit.services/lfk/beamershow/commit/0f32c71ef0e0267b2dc271507346c60b83eaa176)
+- improved clock alignment [`4b1a1a3`](https://git.odit.services/lfk/beamershow/commit/4b1a1a324b865354472e45e0ef24230678be6111)
+- fix container width [`5692969`](https://git.odit.services/lfk/beamershow/commit/569296928ee0a3c21844c183d74a36d759f65150)
+- improved footer [`8d38e81`](https://git.odit.services/lfk/beamershow/commit/8d38e81b782252c84163aa87ec660199a2e2b065)
+- updated width [`7005ec6`](https://git.odit.services/lfk/beamershow/commit/7005ec6a28b50763a5e4ee42a8d50e9953149168)
+- drop "teams_distance" screen [`b483ed1`](https://git.odit.services/lfk/beamershow/commit/b483ed1e49aebbdfb59b41df75160a8acab546b2)
+- improved empty state [`2ce93b4`](https://git.odit.services/lfk/beamershow/commit/2ce93b45c772284e59d84f063069e1546434bbc3)
+- fix: width of general container [`b3ce711`](https://git.odit.services/lfk/beamershow/commit/b3ce711e6b8a8497ccbe6e5eea5ff1d6cd550e91)
+- reload data every 90s [`456c063`](https://git.odit.services/lfk/beamershow/commit/456c0635a4fb5e129e94d4537fb735dc94933a12)
+
+#### [0.1.5](https://git.odit.services/lfk/beamershow/compare/0.1.4...0.1.5)
+
+> 29 March 2023
+
+- Switched dockerfile over to pnpm + cache [`701aae9`](https://git.odit.services/lfk/beamershow/commit/701aae9ed4af66b973e88fec384e46752fcb9ca2)
+- Switched ci over to pnpm cache [`324612b`](https://git.odit.services/lfk/beamershow/commit/324612b5ddc1cf148a7750a02cdce557bef54d38)
+- pinned dependencies [`d284e81`](https://git.odit.services/lfk/beamershow/commit/d284e8184c5a3c357398e3ab5a24a2e611001640)
+- 🚀Bumped version to 0.1.5 [`5be665b`](https://git.odit.services/lfk/beamershow/commit/5be665b65fc021ae8ae544a965444cc29ec20e62)
+- Docker copy all [`ca1c96b`](https://git.odit.services/lfk/beamershow/commit/ca1c96b252c9665b94dd9ef37c700afbb0039d46)
+
 #### [0.1.4](https://git.odit.services/lfk/beamershow/compare/0.1.3...0.1.4)
 
+> 5 February 2023
+
 - cleanup invalid track stuff (leftovers from scanclient) [`c485898`](https://git.odit.services/lfk/beamershow/commit/c485898b7db7ae09f6e405e12aa6d458833f2dcf)
 - bullet-proof login ux [`ea08127`](https://git.odit.services/lfk/beamershow/commit/ea08127927e2b1ebcbcd7907fbf51a66a43da421)
 - add rst command [`ee6af3e`](https://git.odit.services/lfk/beamershow/commit/ee6af3e06921ef33651076b8767149c2df3a1f2d)
+- 🚀Bumped version to 0.1.4 [`7f7b743`](https://git.odit.services/lfk/beamershow/commit/7f7b743f414b77902a358b6bd813412096d195b3)
 - Settings: reload on lang change [`e0f400a`](https://git.odit.services/lfk/beamershow/commit/e0f400a800f2652cf3edf2ac0a5f802b65d0c460)
 
 #### [0.1.3](https://git.odit.services/lfk/beamershow/compare/0.1.2...0.1.3)

Dockerfile

@@ -1,12 +1,12 @@
-FROM node:15.11.0-alpine3.13
+FROM registry.odit.services/hub/library/node:19.8.1-alpine3.16 as build
+ARG NPM_REGISTRY_URL=https://registry.npmjs.org
 WORKDIR /app
-COPY . .
+
-RUN yarn
+COPY . ./
-RUN yarn build
+RUN npm config set registry $NPM_REGISTRY_URL && npm i -g pnpm@8 && pnpm i
+RUN pnpm build
 
 # final image
-FROM alpine
+FROM registry.odit.services/library/nginx-brotli:3.15 as final
-COPY --from=0 /app/dist /app
+COPY --from=build /app/dist /usr/share/nginx/html
-FROM fholzer/nginx-brotli:v1.19.1
-COPY --from=1 /app /usr/share/nginx/html
 COPY ./nginx.conf /etc/nginx/nginx.conf

index.html

@@ -6,6 +6,11 @@
     <title>LfK!Beamershow</title>
     <base href="./" />
     <link rel="icon" type="image/png" href="./favicon.png" />
+    <style>
+      * {
+        font-family: "Athiti", sans-serif;
+      }
+    </style>
   </head>
 
   <body class="bg-white font-family-karla h-screen">

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@lfk/beamershow",
-	"version": "0.1.4",
+	"version": "1.0.1",
 	"scripts": {
 		"dev": "vite",
 		"build": "vite build",
@@ -10,22 +10,22 @@
 		"release": "release-it --only-version"
 	},
 	"devDependencies": {
-		"@odit/license-exporter": "^0.0.11",
+		"@odit/license-exporter": "0.0.11",
-		"@svitejs/vite-plugin-svelte": "^0.11.1",
+		"@svitejs/vite-plugin-svelte": "0.11.1",
-		"@tsconfig/svelte": "^1.0.10",
+		"@tsconfig/svelte": "1.0.10",
-		"@types/html-minifier": "^4.0.0",
+		"@types/html-minifier": "4.0.0",
-		"axios": "^0.21.1",
+		"axios": "0.21.1",
-		"html-minifier": "^4.0.0",
+		"html-minifier": "4.0.0",
-		"husky": "^5.1.3",
+		"husky": "5.1.3",
-		"prettier": "^2.2.1",
+		"prettier": "2.2.1",
-		"prettier-plugin-svelte": "^2.2.0",
+		"prettier-plugin-svelte": "2.2.0",
 		"release-it": "14.5.0",
 		"svelte": "3.36.0",
 		"svelte-i18n": "3.3.9",
 		"svelte-preprocess": "4.7.0",
-		"validator": "^13.5.2",
+		"validator": "13.5.2",
 		"vite": "2.1.4",
-		"vite-plugin-windicss": "0.11.2"
+		"vite-plugin-windicss": "1.8.10"
 	},
 	"release-it": {
 		"git": {
@@ -44,5 +44,8 @@
 		"hooks": {
 			"after:bump": "npx auto-changelog --commit-limit false -p -u --hide-credit && git add CHANGELOG.md && node order.js  && git add src/locales"
 		}
+	},
+	"dependencies": {
+		"@fontsource/athiti": "^4.5.10"
 	}
 }

src/Beamershow.svelte

@@ -1,5 +1,6 @@
 <script>
   import axios from "axios";
+  import bg from "../public/beamershow_background.png?import";
   import { _ } from "svelte-i18n";
   import { slide } from "svelte/transition";
   import { apikey, api_endpoint, laptime_track } from "./store.js";
@@ -11,7 +12,7 @@
     "runners_distance",
     "runners_laptime",
     "orgs_distance",
-    "teams_distance",
+    // "teams_distance",
   ];
   $: current_page = "general";
   $: general = {};
@@ -130,7 +131,7 @@
   }, 1000);
   setInterval(() => {
     fetch_all();
-  }, 15000);
+  }, 90000);
   setInterval(() => {
     current_page = pages.cycle(current_page);
   }, 20000);
@@ -138,35 +139,44 @@
 
 <div
   class="min-h-screen flex items-center justify-center bg-gray-100"
-  style="background-image: url('/beamershow_background.png');background-position: center;background-size: contain;background-repeat:no-repeat;"
+  style="background-image: url({bg});background-position: center;background-size: contain;background-repeat:no-repeat;"
 >
-  <div class="max-w-xl w-full">
+  <div class="w-full">
+    <div class="w-3/4 xl:w-1/2 mx-auto">
+      <!--  -->
       {#if current_page === "general"}
         <div transition:slide|local>
-        <h1 class="mr-6 text-7xl font-semibold text-center text-gray-900">
+          <h1
-          {hours}:{minutes}:{seconds}
+            class="mr-6 text-5xl xl:text-7xl font-bold text-center text-gray-900"
+          >
+            Statistiken
           </h1>
           <!--  -->
           <div class="flex flex-wrap -mx-1 overflow-hidden mt-5">
             <div class="my-1 px-1 w-full overflow-hidden sm:w-1/2 md:w-1/3">
-            <h1 class="text-5xl font-semibold text-center text-gray-900">
+              <h1 class="text-5xl font-bold text-center text-gray-900">
-              {general.total_runners}
+                {general.total_runners || "0"}
               </h1>
               <h1 class="text-2xl font-semibold text-center text-gray-900">
                 {$_("laeufer")}
               </h1>
             </div>
             <div class="my-1 px-1 w-full overflow-hidden sm:w-1/2 md:w-1/3">
-            <h1 class="text-5xl font-semibold text-center text-gray-900">
+              <h1 class="text-5xl font-bold text-center text-gray-900">
-              {general.total_distance}
+                {general.total_distance || "0"}
               </h1>
               <h1 class="text-2xl font-semibold text-center text-gray-900">
                 {$_("kilometer-gesamt")}
               </h1>
             </div>
             <div class="my-1 px-1 w-full overflow-hidden sm:w-1/2 md:w-1/3">
-            <h1 class="text-5xl font-semibold text-center text-gray-900">
+              <h1 class="text-5xl font-bold text-center text-gray-900">
-              {general.total_donation} €
+                {parseFloat(
+                  ((general.total_donation || 0) / 100).toFixed(2)
+                ).toLocaleString(undefined, {
+                  minimumFractionDigits: 2,
+                  maximumFractionDigits: 2,
+                }) || "0"} €
               </h1>
               <h1 class="text-2xl font-semibold text-center text-gray-900">
                 {$_("spendensumme")}
@@ -176,10 +186,19 @@
         </div>
       {:else if current_page === "runners_distance"}
         <div transition:slide|local>
-        <h1 class="mr-6 text-7xl font-semibold text-center text-gray-900 mb-5">
+          <h1
+            class="mr-6 text-5xl xl:text-7xl font-bold text-center text-gray-900 mb-3"
+          >
             {$_("top-laeufer")} ({$_("distanz")})
           </h1>
-        <table class="table p-4 bg-white shadow rounded-lg w-full">
+          {#if runners_by_laptime.length === 0}
+            <p class="w-full text-center text-3xl font-semibold">
+              Noch keine Daten...
+            </p>
+          {:else}
+            <table
+              class="table font-semibold p-4 bg-white shadow rounded-lg w-full"
+            >
               <thead>
                 <tr>
                   <th
@@ -224,13 +243,23 @@
                 {/each}
               </tbody>
             </table>
+          {/if}
         </div>
       {:else if current_page === "runners_laptime"}
         <div transition:slide|local>
-        <h1 class="mr-6 text-7xl font-semibold text-center text-gray-900 mb-5">
+          <h1
+            class="mr-6 text-5xl xl:text-7xl font-bold text-center text-gray-900 mb-3"
+          >
             {$_("top-laeufer")} ({$_("rundenzeit")})
           </h1>
-        <table class="table p-4 bg-white shadow rounded-lg w-full">
+          {#if runners_by_laptime.length === 0}
+            <p class="w-full text-center text-3xl font-semibold">
+              Noch keine Daten...
+            </p>
+          {:else}
+            <table
+              class="table font-semibold p-4 bg-white shadow rounded-lg w-full"
+            >
               <thead>
                 <tr>
                   <th
@@ -275,13 +304,18 @@
                 {/each}
               </tbody>
             </table>
+          {/if}
         </div>
       {:else if current_page === "orgs_distance"}
         <div transition:slide|local>
-        <h1 class="mr-6 text-7xl font-semibold text-center text-gray-900 mb-5">
+          <h1
-          {$_("top-organsiationen")}
+            class="mr-6 text-5xl xl:text-7xl font-bold text-center text-gray-900 mb-3"
+          >
+            {$_("top-organisationen")}
           </h1>
-        <table class="table p-4 bg-white shadow rounded-lg w-full">
+          <table
+            class="table font-semibold p-4 bg-white shadow rounded-lg w-full"
+          >
             <thead>
               <tr>
                 <th
@@ -320,10 +354,14 @@
         </div>
       {:else if current_page === "teams_distance"}
         <div transition:slide|local>
-        <h1 class="mr-6 text-7xl font-semibold text-center text-gray-900 mb-5">
+          <h1
+            class="mr-6 text-5xl xl:text-7xl font-bold text-center text-gray-900 mb-3"
+          >
             {$_("top-teams")}
           </h1>
-        <table class="table p-4 bg-white shadow rounded-lg w-full">
+          <table
+            class="table font-semibold p-4 bg-white shadow rounded-lg w-full"
+          >
             <thead>
               <tr>
                 <th
@@ -365,3 +403,15 @@
       {/if}
     </div>
   </div>
+  <h1
+    class="text-6xl font-semibold text-right text-gray-900 font-mono top-2 w-full fixed pr-4 xl:top-6 xl:pr-8"
+  >
+    {hours}:{minutes}:{seconds}
+  </h1>
+  <h1
+    class="text-xl xl:text-3xl font-medium text-center text-gray-900 font-mono bottom-2 xl:bottom-4 w-full fixed"
+  >
+    <span class="text-black font-extrabold">LfK!2023 </span>powered by
+    ODIT.Services
+  </h1>
+</div>

src/locales/de.json

@@ -34,7 +34,7 @@
     "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.",
     "top-laeufer": "Top-Läufer",
-    "top-organsiationen": "Top-Organsiationen",
+    "top-organisationen": "Top-Organisationen",
     "top-teams": "Top-Teams",
     "track_distance": "Länge des Tracks",
     "track_id": "Track ID",

src/locales/en.json

@@ -34,7 +34,7 @@
     "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.",
     "top-laeufer": "Top runners",
-    "top-organsiationen": "Top organizations",
+    "top-organisationen": "Top organizations",
     "top-teams": "Top teams",
     "track_distance": "Track Distance",
     "track_id": "Track ID",

src/main.js

@@ -1,5 +1,6 @@
 import App from './App.svelte';
 import 'windi.css';
+import "@fontsource/athiti"
 
 const app = new App({
 	target: document.body