streaming/Priority
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

removed priorityStore - used priority local var

Browse source
This commit is contained in:
Miki 2024-01-18 10:55:36 +00:00
parent b05639c931
commit 7fbfef66f0
9 changed files with 198 additions and 243 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
backend.light/backend.light
View file

Binary file not shown.

19
backend.light/priority.go
View file

@ -7,6 +7,7 @@ type Priority struct {
} }
type Surfer struct { type Surfer struct {
Id string `json:"id"`
Name string `json:"name"` Name string `json:"name"`
Color string `json:"color"` Color string `json:"color"`
Priority string `json:"priority"` Priority string `json:"priority"`
@ -17,3 +18,21 @@ type Round struct {
Heat int `json:"heat"` Heat int `json:"heat"`
Category string `json:"category"` Category string `json:"category"`
} }
func initPriority() interface{} {
return Priority{
Surfers: []Surfer{
{
Name: "",
Color: "lightgray",
Priority: "",
},
},
Round: Round{
Name: "",
Heat: 1,
Category: "",
},
Count: 1,
}
}

1
backend.light/sse_stream.go
View file

@ -18,6 +18,7 @@ func InitSse() *SseStream {
Clients: make([]Client, 0), Clients: make([]Client, 0),
MsgId: map[string]int{}, MsgId: map[string]int{},
Events: events, Events: events,
Data: initPriority(),
} }
for i := range events { for i := range events {

32
frontend.light/src/lib/priority.js Normal file
View file

@ -0,0 +1,32 @@
export const surfer = {
id: 0,
color: 'lightgray',
priority: '',
name: ''
}
export function createPriority() {
const priority = {
surfers: [],
round: {
name: '',
heat: 1,
category: ''
},
surfersCount: 4
};
for (let i = 0; i < priority.surfersCount; i++) {
let s = {};
Object.assign(s, surfer)
s.id = i + 1
priority.surfers.push(s)
};
console.log(`priority: ${JSON.stringify(priority)}`)
return priority;
}
// export const priority = createPriority();

0
frontend.light/src/lib/stores/priority.js → frontend.light/src/lib/stores/priorityStore.js
View file

124
frontend.light/src/routes/display-h/+page.svelte
View file

@ -1,124 +0,0 @@
<script>
import { dev } from '$app/environment';
import { onMount } from 'svelte';
import { priorityStore } from '$lib/stores/priority.js';
if (dev) {
console.log('Dev mode');
} else {
console.log('Not dev mode');
}
const events = ['priority'];
$: setup_height = 100 / $priorityStore.surfersCount - 2.2 / $priorityStore.surfersCount;
window.document.body.oncontextmenu = function () {
return false;
};
onMount(async () => {
if (!dev) {
const sse = StartSSE();
LoadPriority();
return sse;
}
});
function StartSSE() {
let url = '/api/sse?';
for (let e in events) {
url += `event=${events[e]}&`;
}
console.log(`sse url: ${url}`);
const sse = new EventSource(url);
console.log(`subscribe: ${sse}`);
sse.onopen = () => {
console.log(`sse open ${Date.now()}`);
};
sse.addEventListener('priority', (e) => {
let Msg = JSON.parse(e.data);
console.log(JSON.stringify(Msg));
console.log(`surfers: ${Msg.data.priority}`);
$priorityStore = Msg.data.priority;
});
return () => {
sse.close();
console.log(`sse closing ${Date.now()}`);
};
}
async function LoadPriority() {
const res = await fetch(`/api/priority`);
const data = await res.json();
console.log(`load priority: ${JSON.stringify(data)}`);
$priorityStore = data.priority;
}
</script>
<ul>
{#each Array($priorityStore.surfersCount) as _, id}
<li style="--height:{setup_height}vh">
{#if $priorityStore.surfers[id].priority == 'P'}
<div class="priority" id="p">
{$priorityStore.surfers[id].priority}
</div>
{:else}
<div class="priority" id="n">
{$priorityStore.surfers[id].priority}
</div>
{/if}
<div class="color" style:background-color={$priorityStore.surfers[id].color}></div>
</li>
{/each}
</ul>
<style>
:global(body) {
overflow-y: hidden;
overflow-x: hidden;
margin: 0.2vmin;
align-content: center;
justify-content: center;
}
ul {
margin: 0;
padding: 0;
}
li {
display: flex;
flex-direction: row;
margin-top: 0.2vh;
margin-bottom: 0.2vh;
overflow: hidden;
}
.priority {
text-align: center;
align-self: center;
min-height: 19vh;
min-width: 19vh;
margin-right: 0.2vw;
background-color: gray;
}
.priority#p {
font-size: 16vmin;
background-color: lightgray;
height: 100%;
}
.priority#n {
font-size: 14vmin;
height: 100%;
}
.color {
width: 100vw;
}
</style>

29
frontend.light/src/routes/display/+page.svelte
View file

@ -1,7 +1,7 @@
<script> <script>
import { dev } from '$app/environment'; import { dev } from '$app/environment';
import { onMount } from 'svelte'; import { onMount } from 'svelte';
import { priorityStore } from '$lib/stores/priority.js'; import { createPriority } from '$lib/priority.js';
let base; let base;
@ -13,13 +13,16 @@
base = ''; base = '';
} }
const events = ['priority']; const events = ['priority'];
window.document.body.oncontextmenu = function () { window.document.body.oncontextmenu = function () {
return false; return false;
}; };
let priority = createPriority();
$: priority;
LoadPriority(); LoadPriority();
onMount(async () => { onMount(async () => {
@ -46,9 +49,9 @@
let Msg = JSON.parse(e.data); let Msg = JSON.parse(e.data);
console.log(JSON.stringify(Msg)); console.log(JSON.stringify(Msg));
console.log(`surfers: ${Msg.data.priority}`); console.log(`surfers: ${Msg.data.priority}`);
$priorityStore.surfers = Msg.data.surfers; priority.surfers = Msg.data.surfers;
$priorityStore.round = Msg.data.round; priority.round = Msg.data.round;
$priorityStore.surfersCount = Msg.data.surfersCount; priority.surfersCount = Msg.data.surfersCount;
}); });
return () => { return () => {
@ -61,21 +64,21 @@
const res = await fetch(`${base}/api/priority`); const res = await fetch(`${base}/api/priority`);
const data = await res.json(); const data = await res.json();
console.log(`load priority: ${JSON.stringify(data)}`); console.log(`load priority: ${JSON.stringify(data)}`);
$priorityStore.surfers = data.surfers; priority.surfers = data.surfers;
$priorityStore.round = data.round; priority.round = data.round;
$priorityStore.surfersCount = data.surfersCount; priority.surfersCount = data.surfersCount;
} }
</script> </script>
<div class="wall"> <div class="wall">
{#each Array($priorityStore.surfersCount) as _, id} {#each Array(priority.surfersCount) as _, id}
<div class="column"> <div class="column">
{#if $priorityStore.surfers[id].priority == 'P'} {#if priority.surfers[id].priority == 'P'}
<div class="priority" id="p">{$priorityStore.surfers[id].priority}</div> <div class="priority" id="p">{priority.surfers[id].priority}</div>
{:else} {:else}
<div class="priority" id="n">{$priorityStore.surfers[id].priority}</div> <div class="priority" id="n">{priority.surfers[id].priority}</div>
{/if} {/if}
<div class="color" style="background-color: {$priorityStore.surfers[id].color}"></div> <div class="color" style="background-color: {priority.surfers[id].color}"></div>
</div> </div>
{/each} {/each}
</div> </div>

82
frontend.light/src/routes/mobile/+page.svelte
View file

@ -1,14 +1,14 @@
<script> <script>
// import { page } from '$app/stores';
import { onMount } from 'svelte'; import { onMount } from 'svelte';
import { dev } from '$app/environment'; import { dev } from '$app/environment';
import { priorityStore } from '$lib/stores/priority.js'; import { createPriority } from '$lib/priority.js';
let base; let base;
if (dev) { if (dev) {
console.log('Dev mode'); console.log('Dev mode');
base = 'http://10.39.253.16:8080'; // base = 'http://10.39.253.16:8080';
base = 'http://172.22.110.142:8080';
} else { } else {
console.log('Not dev mode'); console.log('Not dev mode');
base = ''; base = '';
@ -18,10 +18,27 @@
let width; let width;
let header_height = 8; let priority = createPriority();
$: setup_height = (100 - header_height) / $priorityStore.surfersCount - 12 / $priorityStore.surfersCount;
LoadPriority(); $: priority;
// $: priority = {
// surfers: [
// { color: 'lightgray', priority: '', name: '' },
// { color: 'lightgray', priority: '', name: '' },
// { color: 'lightgray', priority: '', name: '' },
// { color: 'lightgray', priority: '', name: '' }
// ],
// round: {
// name: '',
// category: '',
// heat: 0
// },
// surfersCount: 4
// };
let header_height = 8;
$: setup_height = (100 - header_height) / priority.surfersCount - 12 / priority.surfersCount;
// $: if ($surfers || $surfersCount || $round) { // $: if ($surfers || $surfersCount || $round) {
// SaveSession(); // SaveSession();
@ -42,20 +59,20 @@
sse.onmessage = (e) => { sse.onmessage = (e) => {
let Msg = JSON.parse(e.data); let Msg = JSON.parse(e.data);
console.log(JSON.stringify(Msg)); console.log(`onmessage: ${JSON.stringify(Msg)}`);
console.log(`surfers: ${Msg.data.priority}`); priority.surfers = Msg.data.surfers;
$priorityStore.surfers = Msg.data.surfers; priority.round = Msg.data.round;
$priorityStore.round = Msg.data.round; priority.surfersCount = Msg.data.surfersCount;
$priorityStore.surfersCount = Msg.data.surfersCount; console.log(`surfers: ${JSON.stringify(priority)}`);
}; };
sse.addEventListener('priority', (e) => { sse.addEventListener('priority', (e) => {
let Msg = JSON.parse(e.data); let Msg = JSON.parse(e.data);
console.log(JSON.stringify(Msg)); console.log(`event priority: ${JSON.stringify(Msg.data)}`);
console.log(`surfers: ${Msg.data.priority}`); priority.surfers = Msg.data.surfers;
$priorityStore.surfers = Msg.data.surfers; priority.round = Msg.data.round;
$priorityStore.round = Msg.data.round; priority.surfersCount = Msg.data.surfersCount;
$priorityStore.surfersCount = Msg.data.surfersCount; console.log(`surfers: ${JSON.stringify(priority)}`);
// SaveSession(); // SaveSession();
}); });
@ -75,18 +92,23 @@
const res = await fetch(`${base}/api/priority`); const res = await fetch(`${base}/api/priority`);
const data = await res.json(); const data = await res.json();
console.log(`load priority: ${JSON.stringify(data)}`); console.log(`load priority: ${JSON.stringify(data)}`);
$priorityStore.surfers = data.surfers; priority.surfers = data.surfers;
$priorityStore.round = data.round; priority.round = data.round;
$priorityStore.surfersCount = data.surfersCount; priority.surfersCount = data.surfersCount;
console.log(`loaded data: ${JSON.stringify(priority)}`);
} }
onMount(async () => { onMount(async () => {
const sse = StartSSE(); const sse = StartSSE();
let pri = window.sessionStorage.getItem('priority') let pri = window.sessionStorage.getItem('priority');
if (pri) { if (pri) {
$priorityStore = JSON.parse(pri); priority.surfers = JSON.parse(pri.surfers);
console.log(`loaded: ${JSON.stringify($priorityStore)}`); priority.round = JSON.parse(pri.round);
priority.surfersCount = JSON.parse(pri.surfersCount);
console.log(`loaded: ${JSON.stringify(priority)}`);
} else {
LoadPriority();
} }
return sse; return sse;
@ -96,23 +118,23 @@
<svelte:window bind:innerWidth={width} /> <svelte:window bind:innerWidth={width} />
<div class="header" style="--height:{header_height}vh"> <div class="header" style="--height:{header_height}vh">
<span class="title">{$priorityStore.round.name}</span> <span class="title">{priority.round.name}</span>
<span class="title">{$priorityStore.round.category}</span> <span class="title">{priority.round.category}</span>
<span class="heat">Heat {$priorityStore.round.heat}</span> <span class="heat">Heat {priority.round.heat}</span>
</div> </div>
<div class="container"> <div class="container">
{#each Array($priorityStore.surfersCount) as _, id} {#each Array(priority.surfersCount) as _, id}
<div class="box"> <div class="box">
<div <div
class="square" class="square"
style="background-color: {$priorityStore.surfers[id].color}; --height:{setup_height}vh" style="background-color: {priority.surfers[id].color}; --height:{setup_height}vh"
> >
{#if $priorityStore.surfers[id].priority != ''} {#if priority.surfers[id].priority != ''}
<span class="priority">{$priorityStore.surfers[id].priority}</span> <span class="priority">{priority.surfers[id].priority}</span>
{/if} {/if}
</div> </div>
<div class="text">{$priorityStore.surfers[id].name}</div> <div class="text">{priority.surfers[id].name}</div>
</div> </div>
{/each} {/each}
</div> </div>

148
frontend.light/src/routes/priority/+page.svelte
View file

@ -1,20 +1,25 @@
<script> <script>
import { onMount } from 'svelte'; import { onMount } from 'svelte';
import { priorityStore } from '$lib/stores/priority.js';
import { colors } from '$lib/stores/colors.js'; import { colors } from '$lib/stores/colors.js';
import { rounds } from '$lib/stores/rounds.js'; import { rounds } from '$lib/stores/rounds.js';
import { categories } from '$lib/stores/categories.js'; import { categories } from '$lib/stores/categories.js';
import { dev } from '$app/environment'; import { dev } from '$app/environment';
import { createPriority, surfer } from '$lib/priority.js';
window.document.body.oncontextmenu = function () { window.document.body.oncontextmenu = function () {
return false; return false;
}; };
// $: $priorityStore = $priorityStore;
$: start = false; $: start = false;
let priority = createPriority();
$: priority;
console.log(`surfers: ${JSON.stringify(priority.surfers)}`);
let footer_height = 8; let footer_height = 8;
let setup_height = (100 - footer_height) / $priorityStore.surfersCount - 2.2 / $priorityStore.surfersCount; let setup_height = (100 - footer_height) / priority.surfersCount - 2.2 / priority.surfersCount;
// $: if ($priority.surfers) { // $: if ($priority.surfers) {
// SaveToLocalCahe(); // SaveToLocalCahe();
@ -22,16 +27,16 @@
onMount(async () => { onMount(async () => {
LoadFromLocalCache(); LoadFromLocalCache();
console.log(`loaded: ${JSON.stringify($priorityStore)}`); console.log(`loaded: ${JSON.stringify(priority)}`);
}); });
function hasDuplicateColors() { function hasDuplicateColors() {
const colors = []; const colors = [];
console.log(JSON.stringify($priorityStore.surfers)); console.log(JSON.stringify(priority.surfers));
for (let i = 0; i < $priorityStore.surfersCount; i++) { for (let i = 0; i < priority.surfersCount; i++) {
const color = $priorityStore.surfers[i].color; const color = priority.surfers[i].color;
if (colors.includes(color)) { if (colors.includes(color)) {
console.log(`duplicate color: ${color}`); console.log(`duplicate color: ${color}`);
@ -45,8 +50,8 @@
} }
function ResetPriority() { function ResetPriority() {
for (let i = 0; i < $priorityStore.surfersCount; i++) { for (let i = 0; i < priority.surfersCount; i++) {
$priorityStore.surfers[i].priority = ''; priority.surfers[i].priority = '';
} }
} }
@ -69,37 +74,41 @@
} }
function AddSurfer() { function AddSurfer() {
if ($priorityStore.surfersCount < 6) { if (priority.surfersCount < 6) {
$priorityStore.surfersCount += 1; priority.surfersCount += 1;
priority.surfers.push(surfer);
} }
} }
function RemSurfer() { function RemSurfer() {
if ($priorityStore.surfersCount > 2) { if (priority.surfersCount > 2) {
$priorityStore.surfersCount -= 1; priority.surfersCount -= 1;
priority.surfers.pop();
} }
} }
function ResetLocalCache() { function ResetLocalCache() {
console.log('ResetLocalCache'); console.log('ResetLocalCache');
window.sessionStorage.clear(); window.sessionStorage.clear();
priorityStore.clear(); priority = createPriority();
console.log(`reset store: ${JSON.stringify($priorityStore)}`); console.log(`reset store: ${JSON.stringify(priority)}`);
} }
function SaveToLocalCahe() { function SaveToLocalCahe() {
window.sessionStorage.setItem('priority', JSON.stringify($priorityStore)); window.sessionStorage.setItem('priority', JSON.stringify(priority));
window.sessionStorage.setItem('start', JSON.stringify(start)); window.sessionStorage.setItem('start', JSON.stringify(start));
console.log(`update cache: ${JSON.stringify($priorityStore)}`); console.log(`update cache: ${JSON.stringify(priority)}`);
} }
function LoadFromLocalCache() { function LoadFromLocalCache() {
let pri = window.sessionStorage.getItem('priority') let pri = window.sessionStorage.getItem('priority');
if (pri) { if (pri) {
// $priority = JSON.parse(pri); // $priority = JSON.parse(pri);
$priorityStore = JSON.parse(pri); priority.surfers = JSON.parse(pri.surfers);
priority.round = JSON.parse(pri.round);
priority.surfersCount = JSON.parse(pri.surfersCount);
start = JSON.parse(window.sessionStorage.getItem('start')); start = JSON.parse(window.sessionStorage.getItem('start'));
console.log(`load cache: ${JSON.stringify($priorityStore)} - ${start}`); console.log(`load cache: ${JSON.stringify(priority)} - ${start}`);
} else { } else {
console.log(`no cache found`); console.log(`no cache found`);
} }
@ -112,69 +121,69 @@
const res = await fetch(`/api/priority`, { const res = await fetch(`/api/priority`, {
method: 'POST', method: 'POST',
body: JSON.stringify({ body: JSON.stringify({
surfers: $priorityStore.surfers, surfers: priority.surfers,
round: $priorityStore.round, round: priority.round,
surfersCount: $priorityStore.surfersCount surfersCount: priority.surfersCount
}), }),
headers: { headers: {
'Content-Type': 'application/json' 'Content-Type': 'application/json'
} }
}); });
console.log(`SendPriority: ${JSON.stringify($priorityStore)}`); console.log(`SendPriority: ${JSON.stringify(priority)}`);
} }
async function ChangePriority(id) { async function ChangePriority(id) {
console.log($priorityStore.surfers[id]); console.log(priority.surfers[id]);
if ($priorityStore.surfers[id].priority === 'P') { if (priority.surfers[id].priority === 'P') {
for (let i = 0; i < $priorityStore.surfersCount; i++) { for (let i = 0; i < priority.surfersCount; i++) {
if (i != id) { if (i != id) {
let pos = parseInt($priorityStore.surfers[i].priority) - 1; let pos = parseInt(priority.surfers[i].priority) - 1;
if (pos === 1) { if (pos === 1) {
$priorityStore.surfers[i].priority = 'P'; priority.surfers[i].priority = 'P';
} else { } else {
$priorityStore.surfers[i].priority = pos.toString(); priority.surfers[i].priority = pos.toString();
} }
} }
} }
$priorityStore.surfers[id].priority = $priorityStore.surfersCount.toString(); priority.surfers[id].priority = priority.surfersCount.toString();
} else if ($priorityStore.surfers[id].priority === '') { } else if (priority.surfers[id].priority === '') {
console.log(`priority empty; pressed: [${id}] ${$priorityStore.surfers[id].priority}`); console.log(`priority empty; pressed: [${id}] ${priority.surfers[id].priority}`);
for (let i = 0; i < $priorityStore.surfersCount; i++) { for (let i = 0; i < priority.surfersCount; i++) {
console.log(`looping(${id}): ${i} - ${$priorityStore.surfers[i].priority}`); console.log(`looping(${id}): ${i} - ${priority.surfers[i].priority}`);
if (i != id) { if (i != id) {
if ($priorityStore.surfers[i].priority === '') { if (priority.surfers[i].priority === '') {
console.log(`empty: [${i}] ${$priorityStore.surfers[i].priority}`); console.log(`empty: [${i}] ${priority.surfers[i].priority}`);
continue; continue;
} else { } else {
console.log(`not empty: [${i}] ${$priorityStore.surfers[i].priority}`); console.log(`not empty: [${i}] ${priority.surfers[i].priority}`);
let pos = parseInt($priorityStore.surfers[i].priority) - 1; let pos = parseInt(priority.surfers[i].priority) - 1;
if (pos === 1) { if (pos === 1) {
$priorityStore.surfers[i].priority = 'P'; priority.surfers[i].priority = 'P';
} else { } else {
$priorityStore.surfers[i].priority = pos.toString(); priority.surfers[i].priority = pos.toString();
} }
} }
} }
$priorityStore.surfers[id].priority = $priorityStore.surfersCount.toString(); priority.surfers[id].priority = priority.surfersCount.toString();
} }
} else { } else {
console.log(`pressed: [${id}] ${$priorityStore.surfers[id].priority}`); console.log(`pressed: [${id}] ${priority.surfers[id].priority}`);
let oldpos = parseInt($priorityStore.surfers[id].priority); let oldpos = parseInt(priority.surfers[id].priority);
for (let i = 0; i < $priorityStore.surfersCount; i++) { for (let i = 0; i < priority.surfersCount; i++) {
if (i != id) { if (i != id) {
console.log( console.log(
`pos: [${i}] ${$priorityStore.surfers[i].priority} ${$priorityStore.surfers[i].priority > oldpos}` `pos: [${i}] ${priority.surfers[i].priority} ${priority.surfers[i].priority > oldpos}`
); );
if ($priorityStore.surfers[i].priority != 'P') { if (priority.surfers[i].priority != 'P') {
let pos = parseInt($priorityStore.surfers[i].priority); let pos = parseInt(priority.surfers[i].priority);
if (pos > oldpos) { if (pos > oldpos) {
console.log(`newpos: ${$priorityStore.surfers[i].priority}`); console.log(`newpos: ${priority.surfers[i].priority}`);
$priorityStore.surfers[i].priority = (pos - 1).toString(); priority.surfers[i].priority = (pos - 1).toString();
} }
} }
} else { } else {
$priorityStore.surfers[i].priority = $priorityStore.surfersCount.toString(); priority.surfers[i].priority = priority.surfersCount.toString();
console.log(`last: [${i}] ${$priorityStore.surfers[i].priority}`); console.log(`last: [${i}] ${priority.surfers[i].priority}`);
} }
} }
} }
@ -208,9 +217,9 @@
</div> </div>
<ul> <ul>
{#each Array($priorityStore.surfersCount) as _, id} {#each priority.surfers as surfer, id}
<li style="--height:{setup_height}vh"> <li style="--height:{setup_height}vh">
{#if $priorityStore.surfers[id].priority == 'P'} {#if surfer.priority == 'P'}
<div <div
class="priority" class="priority"
id="p" id="p"
@ -219,7 +228,7 @@
role="button" role="button"
tabindex="-1" tabindex="-1"
> >
{$priorityStore.surfers[id].priority} {surfer.priority}
</div> </div>
{:else} {:else}
<div <div
@ -230,11 +239,11 @@
role="button" role="button"
tabindex="-1" tabindex="-1"
> >
{$priorityStore.surfers[id].priority} {surfer.priority}
</div> </div>
{/if} {/if}
<div class="color" style:background-color={$priorityStore.surfers[id].color}> <div class="color" style:background-color={surfer.color}>
{$priorityStore.surfers[id].name} {surfer.name}
</div> </div>
</li> </li>
{/each} {/each}
@ -255,7 +264,7 @@
<div class="col align-self-center"> <div class="col align-self-center">
<div class="btn-toolbar btn-group-sm" role="toolbar"> <div class="btn-toolbar btn-group-sm" role="toolbar">
<button class="btn btn-primary" on:click={AddSurfer}>+</button> <button class="btn btn-primary" on:click={AddSurfer}>+</button>
<button class="btn btn-outline-black disabled">{$priorityStore.surfersCount}</button> <button class="btn btn-outline-black disabled">{priority.surfersCount}</button>
<button class="btn btn-primary" on:click={RemSurfer}>-</button> <button class="btn btn-primary" on:click={RemSurfer}>-</button>
</div> </div>
</div> </div>
@ -268,7 +277,7 @@
class="form-select form-select-sm" class="form-select form-select-sm"
name="round" name="round"
id="round" id="round"
bind:value={$priorityStore.round.name} bind:value={priority.round.name}
> >
{#each $rounds as round} {#each $rounds as round}
<option value={round}>{round}</option> <option value={round}>{round}</option>
@ -283,7 +292,7 @@
class="form-select form-select-sm" class="form-select form-select-sm"
name="cetegory" name="cetegory"
id="category" id="category"
bind:value={$priorityStore.round.category} bind:value={priority.round.category}
> >
{#each $categories as category} {#each $categories as category}
<option value={category}>{category}</option> <option value={category}>{category}</option>
@ -300,7 +309,7 @@
min="1" min="1"
max="999" max="999"
size="3" size="3"
bind:value={$priorityStore.round.heat} bind:value={priority.round.heat}
/> />
</div> </div>
</div> </div>
@ -320,23 +329,16 @@
</tr> </tr>
</thead> </thead>
<tbody class="table-group-divider"> <tbody class="table-group-divider">
{#each Array($priorityStore.surfersCount) as _, id} {#each priority.surfers as surfer, id (surfer.id)}
<tr class="table-light"> <tr class="table-light">
<td <td><input class="input" type="text" size="30" bind:value={surfer.name} /></td>
><input
class="input"
type="text"
size="30"
bind:value={$priorityStore.surfers[id].name}
/></td
>
<td> <td>
<div class="select"> <div class="select">
<select <select
name="color{id}" name="color{id}"
{id} {id}
bind:value={$priorityStore.surfers[id].color} bind:value={surfer.color}
style="background-color: {$priorityStore.surfers[id].color};" style="background-color: {surfer.color};"
> >
{#each $colors as color} {#each $colors as color}
<option value={color} style="background-color: {color}">{color}</option> <option value={color} style="background-color: {color}">{color}</option>