+store: frontend peristent data

frontend/src/routes/priority/+page.svelte

@@ -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} />