+store: frontend peristent data
This commit is contained in:
parent
a6513e9af3
commit
e82c27b2ba
11 changed files with 91 additions and 171 deletions
|
@ -5,22 +5,22 @@
|
|||
"scripts": {
|
||||
"dev": "vite dev --host",
|
||||
"build": "vite build",
|
||||
"preview": "vite preview",
|
||||
"preview": "vite preview --host",
|
||||
"lint": "prettier --check . && eslint .",
|
||||
"format": "prettier --write ."
|
||||
},
|
||||
"devDependencies": {
|
||||
"@sveltejs/adapter-auto": "^3.0.1",
|
||||
"@sveltejs/adapter-auto": "^3.0.0",
|
||||
"@sveltejs/adapter-static": "^3.0.1",
|
||||
"@sveltejs/kit": "^2.0.4",
|
||||
"@sveltejs/vite-plugin-svelte": "^3.0.1",
|
||||
"eslint": "^8.56.0",
|
||||
"@sveltejs/kit": "^2.0.0",
|
||||
"@sveltejs/vite-plugin-svelte": "^3.0.0",
|
||||
"eslint": "^8.28.0",
|
||||
"eslint-config-prettier": "^9.1.0",
|
||||
"eslint-plugin-svelte": "^2.35.1",
|
||||
"eslint-plugin-svelte": "^2.30.0",
|
||||
"prettier": "^3.1.1",
|
||||
"prettier-plugin-svelte": "^3.1.2",
|
||||
"svelte": "^4.2.8",
|
||||
"vite": "^5.0.10"
|
||||
"svelte": "^4.2.7",
|
||||
"vite": "^5.0.3"
|
||||
},
|
||||
"type": "module"
|
||||
}
|
||||
|
|
46
frontend/pnpm-lock.yaml
generated
46
frontend/pnpm-lock.yaml
generated
|
@ -6,25 +6,25 @@ settings:
|
|||
|
||||
devDependencies:
|
||||
'@sveltejs/adapter-auto':
|
||||
specifier: ^3.0.1
|
||||
version: 3.0.1(@sveltejs/kit@2.0.4)
|
||||
specifier: ^3.0.0
|
||||
version: 3.0.1(@sveltejs/kit@2.0.6)
|
||||
'@sveltejs/adapter-static':
|
||||
specifier: ^3.0.1
|
||||
version: 3.0.1(@sveltejs/kit@2.0.4)
|
||||
version: 3.0.1(@sveltejs/kit@2.0.6)
|
||||
'@sveltejs/kit':
|
||||
specifier: ^2.0.4
|
||||
version: 2.0.4(@sveltejs/vite-plugin-svelte@3.0.1)(svelte@4.2.8)(vite@5.0.10)
|
||||
specifier: ^2.0.0
|
||||
version: 2.0.6(@sveltejs/vite-plugin-svelte@3.0.1)(svelte@4.2.8)(vite@5.0.10)
|
||||
'@sveltejs/vite-plugin-svelte':
|
||||
specifier: ^3.0.1
|
||||
specifier: ^3.0.0
|
||||
version: 3.0.1(svelte@4.2.8)(vite@5.0.10)
|
||||
eslint:
|
||||
specifier: ^8.56.0
|
||||
specifier: ^8.28.0
|
||||
version: 8.56.0
|
||||
eslint-config-prettier:
|
||||
specifier: ^9.1.0
|
||||
version: 9.1.0(eslint@8.56.0)
|
||||
eslint-plugin-svelte:
|
||||
specifier: ^2.35.1
|
||||
specifier: ^2.30.0
|
||||
version: 2.35.1(eslint@8.56.0)(svelte@4.2.8)
|
||||
prettier:
|
||||
specifier: ^3.1.1
|
||||
|
@ -33,10 +33,10 @@ devDependencies:
|
|||
specifier: ^3.1.2
|
||||
version: 3.1.2(prettier@3.1.1)(svelte@4.2.8)
|
||||
svelte:
|
||||
specifier: ^4.2.8
|
||||
specifier: ^4.2.7
|
||||
version: 4.2.8
|
||||
vite:
|
||||
specifier: ^5.0.10
|
||||
specifier: ^5.0.3
|
||||
version: 5.0.10
|
||||
|
||||
packages:
|
||||
|
@ -477,25 +477,25 @@ packages:
|
|||
dev: true
|
||||
optional: true
|
||||
|
||||
/@sveltejs/adapter-auto@3.0.1(@sveltejs/kit@2.0.4):
|
||||
/@sveltejs/adapter-auto@3.0.1(@sveltejs/kit@2.0.6):
|
||||
resolution: {integrity: sha512-OpilmvRN136lUgOa9F0zpSI6g+PouOmk+YvJQrB+/hAtllLghjjYuoyfUsrF7U6oJ52cxCtAJTPXgZdyyCffrQ==}
|
||||
peerDependencies:
|
||||
'@sveltejs/kit': ^2.0.0
|
||||
dependencies:
|
||||
'@sveltejs/kit': 2.0.4(@sveltejs/vite-plugin-svelte@3.0.1)(svelte@4.2.8)(vite@5.0.10)
|
||||
'@sveltejs/kit': 2.0.6(@sveltejs/vite-plugin-svelte@3.0.1)(svelte@4.2.8)(vite@5.0.10)
|
||||
import-meta-resolve: 4.0.0
|
||||
dev: true
|
||||
|
||||
/@sveltejs/adapter-static@3.0.1(@sveltejs/kit@2.0.4):
|
||||
/@sveltejs/adapter-static@3.0.1(@sveltejs/kit@2.0.6):
|
||||
resolution: {integrity: sha512-6lMvf7xYEJ+oGeR5L8DFJJrowkefTK6ZgA4JiMqoClMkKq0s6yvsd3FZfCFvX1fQ0tpCD7fkuRVHsnUVgsHyNg==}
|
||||
peerDependencies:
|
||||
'@sveltejs/kit': ^2.0.0
|
||||
dependencies:
|
||||
'@sveltejs/kit': 2.0.4(@sveltejs/vite-plugin-svelte@3.0.1)(svelte@4.2.8)(vite@5.0.10)
|
||||
'@sveltejs/kit': 2.0.6(@sveltejs/vite-plugin-svelte@3.0.1)(svelte@4.2.8)(vite@5.0.10)
|
||||
dev: true
|
||||
|
||||
/@sveltejs/kit@2.0.4(@sveltejs/vite-plugin-svelte@3.0.1)(svelte@4.2.8)(vite@5.0.10):
|
||||
resolution: {integrity: sha512-pqUOo1Slp2fybNjTouF7qgeN815hO2boRCNO1Z7/XtXu5IPNg9OSwI485qmQ0GUU2v2NmA0XZciFHGrgzOixyw==}
|
||||
/@sveltejs/kit@2.0.6(@sveltejs/vite-plugin-svelte@3.0.1)(svelte@4.2.8)(vite@5.0.10):
|
||||
resolution: {integrity: sha512-dnHtyjBLGXx+hrZQ9GuqLlSfTBixewJaByUVWai7LmB4dgV3FwkK155OltEgONDQW6KW64hLNS/uojdx3uC2/g==}
|
||||
engines: {node: '>=18.13'}
|
||||
hasBin: true
|
||||
requiresBuild: true
|
||||
|
@ -511,10 +511,10 @@ packages:
|
|||
esm-env: 1.0.0
|
||||
kleur: 4.1.5
|
||||
magic-string: 0.30.5
|
||||
mrmime: 1.0.1
|
||||
mrmime: 2.0.0
|
||||
sade: 1.8.1
|
||||
set-cookie-parser: 2.6.0
|
||||
sirv: 2.0.3
|
||||
sirv: 2.0.4
|
||||
svelte: 4.2.8
|
||||
tiny-glob: 0.2.9
|
||||
vite: 5.0.10
|
||||
|
@ -1170,8 +1170,8 @@ packages:
|
|||
engines: {node: '>=4'}
|
||||
dev: true
|
||||
|
||||
/mrmime@1.0.1:
|
||||
resolution: {integrity: sha512-hzzEagAgDyoU1Q6yg5uI+AorQgdvMCur3FcKf7NhMKWsaYg+RnbTyHRa/9IlLF9rf455MOCtcqqrQQ83pPP7Uw==}
|
||||
/mrmime@2.0.0:
|
||||
resolution: {integrity: sha512-eu38+hdgojoyq63s+yTpN4XMBdt5l8HhMhc4VKLO9KM5caLIBvUm4thi7fFaxyTmCKeNnXZ5pAlBwCUnhA09uw==}
|
||||
engines: {node: '>=10'}
|
||||
dev: true
|
||||
|
||||
|
@ -1412,12 +1412,12 @@ packages:
|
|||
engines: {node: '>=8'}
|
||||
dev: true
|
||||
|
||||
/sirv@2.0.3:
|
||||
resolution: {integrity: sha512-O9jm9BsID1P+0HOi81VpXPoDxYP374pkOLzACAoyUQ/3OUVndNpsz6wMnY2z+yOxzbllCKZrM+9QrWsv4THnyA==}
|
||||
/sirv@2.0.4:
|
||||
resolution: {integrity: sha512-94Bdh3cC2PKrbgSOUqTiGPWVZeSiXfKOVZNJniWoqrWrRkB1CJzBU3NEbiTsPcYy1lDsANA/THzS+9WBiy5nfQ==}
|
||||
engines: {node: '>= 10'}
|
||||
dependencies:
|
||||
'@polka/url': 1.0.0-next.24
|
||||
mrmime: 1.0.1
|
||||
mrmime: 2.0.0
|
||||
totalist: 3.0.1
|
||||
dev: true
|
||||
|
||||
|
|
|
@ -1,24 +0,0 @@
|
|||
<script>
|
||||
// import { Button, Tooltip } from 'flowbite-svelte';
|
||||
|
||||
export let pill = false;
|
||||
export let color = 'blue';
|
||||
export let size = 'sm';
|
||||
export let href = "/login";
|
||||
</script>
|
||||
|
||||
<button size={size} class="!p-2" {pill} color={color} href={href}>
|
||||
<svg
|
||||
class="w-6 h-6 text-gray-100 dark:text-white"
|
||||
aria-hidden="true"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="currentColor"
|
||||
viewBox="0 0 20 20"
|
||||
>
|
||||
<path
|
||||
fill="currentColor"
|
||||
d="M10 0a10 10 0 1 0 10 10A10.011 10.011 0 0 0 10 0Zm0 5a3 3 0 1 1 0 6 3 3 0 0 1 0-6Zm0 13a8.949 8.949 0 0 1-4.951-1.488A3.987 3.987 0 0 1 9 13h2a3.987 3.987 0 0 1 3.951 3.512A8.949 8.949 0 0 1 10 18Z"
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
<!-- <Tooltip id="type-auto" arrow={false} type="custom" defaultClass="" class="p-1 text-sm bg-blue-700 text-gray-100" >Login</Tooltip> -->
|
|
@ -1,43 +0,0 @@
|
|||
<script>
|
||||
// import { Button, Tooltip } from 'flowbite-svelte';
|
||||
|
||||
|
||||
export let pill = false;
|
||||
export let color = 'blue';
|
||||
export let size = 'sm';
|
||||
</script>
|
||||
|
||||
<button {size} class="!p-2" {pill} {color}>
|
||||
<svg class="w-6 h-6" viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
fill="currentColor"
|
||||
d="m62.578 41.956 -28.444 21.333a3.556 3.556 0 0 1 -4.267 0l-28.444 -21.333a3.637 3.637 0 0 1 -1.244 -3.982A3.605 3.605 0 0 1 3.556 35.556h7.111V32a3.566 3.566 0 0 1 3.556 -3.556h35.556a3.566 3.566 0 0 1 3.556 3.556v3.556h7.111a3.552 3.552 0 0 1 2.133 6.4Z"
|
||||
/>
|
||||
<path
|
||||
fill="currentColor"
|
||||
x="3"
|
||||
y="4"
|
||||
width="12"
|
||||
height="2"
|
||||
rx="1"
|
||||
ry="1"
|
||||
d="M14.222 14.222H49.778A3.556 3.556 0 0 1 53.333 17.778V17.778A3.556 3.556 0 0 1 49.778 21.333H14.222A3.556 3.556 0 0 1 10.667 17.778V17.778A3.556 3.556 0 0 1 14.222 14.222z"
|
||||
/>
|
||||
<path
|
||||
fill="currentColor"
|
||||
x="3"
|
||||
width="12"
|
||||
height="2"
|
||||
rx="1"
|
||||
ry="1"
|
||||
d="M14.222 0H49.778A3.556 3.556 0 0 1 53.333 3.556V3.556A3.556 3.556 0 0 1 49.778 7.111H14.222A3.556 3.556 0 0 1 10.667 3.556V3.556A3.556 3.556 0 0 1 14.222 0z"
|
||||
/></svg
|
||||
>
|
||||
</button>
|
||||
<!-- <Tooltip
|
||||
id="type-auto"
|
||||
arrow={false}
|
||||
type="custom"
|
||||
defaultClass=""
|
||||
class="p-1 text-sm bg-blue-700 text-gray-100">Priority</Tooltip
|
||||
> -->
|
|
@ -1,32 +0,0 @@
|
|||
<script>
|
||||
// import { Button, Tooltip } from 'flowbite-svelte';
|
||||
|
||||
|
||||
export let pill = false;
|
||||
export let color = 'blue';
|
||||
export let size = 'sm';
|
||||
</script>
|
||||
|
||||
<button size={size} class="!p-2" {pill} color={color}>
|
||||
<svg
|
||||
class="w-6 h-6"
|
||||
version="1.1"
|
||||
id="Layer_1"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
x="0px"
|
||||
y="0px"
|
||||
viewBox="0 0 455 455"
|
||||
style="enable-background:new 0 0 455 455;"
|
||||
xml:space="preserve"
|
||||
fill="currentColor"
|
||||
>
|
||||
<g>
|
||||
<rect x="162" y="323" width="293" height="132" />
|
||||
<rect x="162" y="161" width="293" height="132" />
|
||||
<rect width="455" height="131" />
|
||||
<rect y="161" width="132" height="294" />
|
||||
</g>
|
||||
</svg>
|
||||
</button>
|
||||
<!-- <Tooltip id="type-auto" arrow={false} type="custom" defaultClass="" class="p-1 text-sm bg-blue-700 text-gray-100" >Score</Tooltip> -->
|
Binary file not shown.
Before Width: | Height: | Size: 9.6 KiB |
Binary file not shown.
Before Width: | Height: | Size: 20 KiB |
Binary file not shown.
Before Width: | Height: | Size: 3.2 KiB |
9
frontend/src/lib/stores/priority.js
Normal file
9
frontend/src/lib/stores/priority.js
Normal file
|
@ -0,0 +1,9 @@
|
|||
import { writable } from'svelte/store';
|
||||
|
||||
export const priority = writable({
|
||||
surfers: [],
|
||||
end: false,
|
||||
start: false,
|
||||
min: 0,
|
||||
sec: 0,
|
||||
})
|
|
@ -1,7 +1,8 @@
|
|||
<script>
|
||||
// import { page } from '$app/stores';
|
||||
import { onDestroy, onMount } from 'svelte';
|
||||
import { onMount } from 'svelte';
|
||||
import { dev } from '$app/environment';
|
||||
import { priority } from '$lib/stores/priority.js';
|
||||
|
||||
if (dev) {
|
||||
console.log('Dev mode');
|
||||
|
@ -9,28 +10,50 @@
|
|||
console.log('Not dev mode');
|
||||
}
|
||||
|
||||
let heat_number;
|
||||
let heats = [];
|
||||
$: surfers = [];
|
||||
// { name: 'Kanoa Igarashi', color: 'red', score: '4.50', priority: '3' },
|
||||
// { name: 'Griffin Colapinto', color: 'white', score: '5.60', priority: 'P' },
|
||||
// { name: 'Jack Robinson', color: 'blue', score: '6.10', priority: '5' },
|
||||
// { name: 'Gabriel Medina', color: 'green', score: '4.30', priority: '2' },
|
||||
// { name: 'Italo Ferreira', color: 'black', score: '6.50', priority: '4' }
|
||||
// ];
|
||||
let saved = false;
|
||||
|
||||
$: if (saved && $priority) {
|
||||
window.sessionStorage.setItem('priority', JSON.stringify($priority));
|
||||
console.log(`saved: ${JSON.stringify($priority)}`);
|
||||
}
|
||||
|
||||
let width;
|
||||
// $: activeUrl = $page.url.pathname;
|
||||
|
||||
const pad2 = (number) => `00${number}`.slice(-2);
|
||||
let heat_number = 0;
|
||||
let heats = [];
|
||||
|
||||
$: surfers = [];
|
||||
$: min = 0;
|
||||
$: sec = 0;
|
||||
$: end = false;
|
||||
$: start = false;
|
||||
|
||||
let end = false;
|
||||
let start = false;
|
||||
// let end = false;
|
||||
// let start = false;
|
||||
|
||||
loadHeats();
|
||||
onMount(async () => {
|
||||
let ses = window.sessionStorage.getItem('priority');
|
||||
if (ses) {
|
||||
$priority = JSON.parse(ses);
|
||||
console.log(`loaded: ${JSON.stringify($priority)}`);
|
||||
}
|
||||
saved = true;
|
||||
loadHeats();
|
||||
const unsub = Subscribe();
|
||||
return unsub;
|
||||
});
|
||||
|
||||
function pad2(number) {
|
||||
return `00${number}`.slice(-2);
|
||||
}
|
||||
|
||||
async function loadHeats() {
|
||||
const res = await fetch(`/api/loadheats`);
|
||||
const data = await res.json();
|
||||
for (let i in data) {
|
||||
heats[i] = data[i];
|
||||
console.log(`${i} retval: ${JSON.stringify(data[i])}`);
|
||||
}
|
||||
}
|
||||
|
||||
function Subscribe() {
|
||||
const sse = new EventSource(`/api/sse`);
|
||||
|
@ -74,6 +97,7 @@
|
|||
const res = await fetch(`/api/stopheat`);
|
||||
const data = await res.json();
|
||||
console.log(`stop: ${JSON.stringify(data)}`);
|
||||
console.log(`dblclick = ${JSON.stringify(pri)}`);
|
||||
}
|
||||
|
||||
async function startHeat() {
|
||||
|
@ -92,15 +116,6 @@
|
|||
end = false;
|
||||
}
|
||||
|
||||
async function loadHeats() {
|
||||
const res = await fetch(`/api/loadheats`);
|
||||
const data = await res.json();
|
||||
for (let i in data) {
|
||||
heats[i] = data[i];
|
||||
console.log(`${i} retval: ${JSON.stringify(data[i])}`);
|
||||
}
|
||||
}
|
||||
|
||||
function setHeat(id) {
|
||||
console.log(`setHeat: ${id}`);
|
||||
if (id === '99') {
|
||||
|
@ -110,6 +125,8 @@
|
|||
}
|
||||
min = heats[id].timer;
|
||||
surfers = heats[id].surfers;
|
||||
$priority.surfers = surfers;
|
||||
$priority.min = min;
|
||||
}
|
||||
|
||||
async function click(id) {
|
||||
|
@ -184,15 +201,6 @@
|
|||
);
|
||||
console.log(`retval: ${JSON.stringify(res)}`);
|
||||
}
|
||||
|
||||
onMount(() => {
|
||||
const unsub = Subscribe();
|
||||
return unsub;
|
||||
});
|
||||
|
||||
// onDestroy(() => {
|
||||
// clearInterval(timer); // Pulisci il timer quando il componente viene distrutto
|
||||
// });
|
||||
</script>
|
||||
|
||||
<svelte:window bind:innerWidth={width} />
|
||||
|
|
|
@ -7,13 +7,15 @@ const config = {
|
|||
// adapter-auto only supports some environments, see https://kit.svelte.dev/docs/adapter-auto for a list.
|
||||
// If your environment is not supported or you settled on a specific environment, switch out the adapter.
|
||||
// See https://kit.svelte.dev/docs/adapters for more information about adapters.
|
||||
adapter: adapter({
|
||||
pages: '../backend/static',
|
||||
assets: '../backend/static',
|
||||
fallback: 'index.html',
|
||||
precompress: true,
|
||||
strict: true
|
||||
})
|
||||
adapter: adapter(
|
||||
{
|
||||
pages: '../backend/static',
|
||||
assets: '../backend/static',
|
||||
fallback: 'index.html',
|
||||
precompress: true,
|
||||
strict: true
|
||||
}
|
||||
)
|
||||
}
|
||||
};
|
||||
|
||||
|
|
Loading…
Add table
Reference in a new issue