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

+stores readable

Browse source
This commit is contained in:
Linux User 2023-12-26 22:50:38 +00:00
parent c6ff2f1110
commit 2b694290f2
8 changed files with 100 additions and 81 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
backend/heats.go
View file

@ -17,7 +17,7 @@ type Surfer struct {
}
type Heat struct {
Name string `json:"name"`
Round string `json:"round"`
Category string `json:"category"`
Number int `json:"number"`
Timer int `json:"timer"`
@ -26,7 +26,7 @@ type Heat struct {
}
func heatName(heat Heat) string {
str := fmt.Sprintf("%s.%d.%s", heat.Name, heat.Number, heat.Category)
str := fmt.Sprintf("%s.%d.%s", heat.Round, heat.Number, heat.Category)
strings.ReplaceAll(str, " ", "_")
return str
}

3
backend/http.go
View file

@ -58,6 +58,9 @@ func (app *App) RegisterWebRoutes() {
setup := app.Engine.Group("/setup")
setup.Static("/", "./static/setup")
surfers := app.Engine.Group("/surfers")
surfers.Static("/", "./static/surfers")
draws := app.Engine.Group("/draws")
draws.Static("/", "./static/draws")

29
frontend/src/lib/header-setup.svelte Normal file
View file

@ -0,0 +1,29 @@
<script>
import Logo from "$lib/img/topscorer_logo_web.png"
export let title = "Setup";
</script>
<div class="header">
<a href="/"><img src={Logo} alt="logo"></a>
<span class="title">{title}</span>
</div>
<style>
.header {
background-color: black;
display:grid;
grid-template-columns: auto 2fr;
align-items: center;
}
.header img {
height: 3rem;
}
.header .title {
font-size: 1.5em;
color: aliceblue;
margin: 0 auto;
}
</style>

12
frontend/src/lib/stores/categories.js Normal file
View file

@ -0,0 +1,12 @@
import {readable} from "svelte/store"
export const categories = readable([
"Under 12 Women",
"Under 12 Men",
"Under 14 Women",
"Under 14 Men",
"Under 16 Women",
"Under 16 Men",
"Under 18 Women",
"Under 18 Men",
]);

13
frontend/src/lib/stores/rounds.js Normal file
View file

@ -0,0 +1,13 @@
import {readable} from "svelte/store"
export const rounds = readable([
"Qualifying",
"Opening",
"Elimination",
"Round of 48",
"Round of 32",
"Round of 16",
"Quarterfinal",
"Semifinal",
"Final",
]);

8
frontend/src/routes/+page.svelte
View file

@ -1,2 +1,8 @@
<h1>Welcome to SvelteKit</h1>
<p>Visit <a href="https://kit.svelte.dev">kit.svelte.dev</a> to read the documentation</p>
<a href="priority">priority</a>
<br>
<a href="setup">setup</a>
<br>
<a href="surfers">surfers</a>

69
frontend/src/routes/setup/+page.svelte
View file

@ -1,6 +1,9 @@
<script>
import { onMount } from 'svelte';
import Logo from "$lib/img/topscorer_logo_web.png"
import Header from "$lib/header-setup.svelte"
import {categories} from "$lib/stores/categories.js"
import {rounds} from "$lib/stores/rounds.js"
let colors = [
"black",
@ -12,29 +15,6 @@
"white",
];
let rounds = [
"Qualifying",
"Opening",
"Elimination",
"Round of 48",
"Round of 32",
"Round of 16",
"Quarterfinal",
"Semifinal",
"Final",
];
let categories = [
"Under 12 Women",
"Under 12 Men",
"Under 14 Women",
"Under 14 Men",
"Under 16 Women",
"Under 16 Men",
"Under 18 Women",
"Under 18 Men",
];
$: surfers = 2;
$: heats = [];
@ -62,7 +42,7 @@
heat = {
number: 1,
name: '',
round: '',
category: '',
timer: 20,
surfers: surfer_list
@ -98,7 +78,7 @@
console.log(`setHeat: ${id}`);
console.log(heats[id]);
heat.number = heats[id].number;
heat.name = heats[id].name;
heat.round = heats[id].round;
heat.category = heats[id].category;
heat.timer = heats[id].timer;
surfer_list = heats[id].surfers;
@ -108,7 +88,7 @@
function addSurfers() {
surfers++;
surfer_list.push({
name: '',
round: '',
color: '',
score: '',
priority: ''
@ -132,7 +112,7 @@
return;
}
if(heat.name === '') {
if(heat.round === '') {
alert('Must have a name');
return;
}
@ -200,29 +180,24 @@
</script>
<div class="header">
<img class="img" src={Logo} alt="logo">
<span class="title" style="color: aliceblue;">Heat setup</span>
</div>
<Header title="Heat setup" />
<div class="container">
<div class="heat">
<label class="label" for="heat">Heat</label>
<select name="heat" id="heat" bind:value={heat.name}>
{#each rounds as round}
<label class="label" for="round">Round</label>
<select name="round" id="round" bind:value={heat.round}>
{#each $rounds as round}
<option value={round}>{round}</option>
{/each}
</select>
<!-- <input bind:value={heat.name} on:change={capitalize(heat, "name")} id="name" type="text"> -->
<label class="label" for="number">Number</label>
<input bind:value={heat.number} id="number" type="number" min="1" max="20">
<label class="label" for="category">Category</label>
<select name="category" id="category" bind:value={heat.category}>
{#each categories as category}
{#each $categories as category}
<option value={category}>{category}</option>
{/each}
</select>
<!-- <input bind:value={heat.category} on:change={capitalize(heat, "category")} id="category" type="text"> -->
<label class="label" for="timer">Duration</label>
<input bind:value={heat.timer} id="timer" type="number" min="5" max="60" step="5"> <!-- on:keydown={(event) => {event.preventDefault()}} -->
</div>
@ -263,7 +238,7 @@
<hr>
{#each heats as h, id}
<div class="surfer">
<button on:click={() => {setHeat(id);}}>{h.name} {h.number} {h.category}</button>
<button on:click={() => {setHeat(id);}}>{h.round} {h.number} {h.category}</button>
<button class="plus" on:click={() => {deleteHeat(id);}}>X</button>
</div>
{/each}
@ -274,22 +249,6 @@
<style>
.header {
background-color: black;
display: grid;
grid-template-columns: auto 2fr;
align-items: center;
}
.header .img {
height: 3rem;
}
.header .title {
font-size: 3rem;
margin: 0 auto;
}
.container {
background-color: lightgrey;
}

43
frontend/src/routes/surfers/+page.svelte
View file

@ -1,27 +1,24 @@
<script>
import Logo from "$lib/img/topscorer_logo_web.png"
import Header from "$lib/header-setup.svelte"
import {categories} from "$lib/stores/categories.js"
let surfer = {
name: "",
category: ""
}
</script>
<div class="header">
<img src={Logo} alt="logo">
<span class="title">Surfers Edit</span>
</div>
<Header title="Surfer Edit" />
<style>
.header {
background-color: black;
display:grid;
grid-template-columns: auto 2fr;
align-items: center;
}
.header img {
height: 3rem;
}
.header .title {
font-size: 1.5em;
color: aliceblue;
margin: 0 auto;
}
</style>
<div class="form">
<label for="name">Name</label>
<input type="text" id="name" bind:value={surfer.name}>
<label for="catrgoty">Category</label>
<select name="category" id="category">
{#each $categories as category}
<option value={category}>{category}</option>
{/each}
</select>
</div>