nemunaire/reveil
1
0
Fork 0
Code Issues 1 Pull requests 3 Releases 27 Activity

Handle settings

Browse source
This commit is contained in:
nemunaire 2022-10-05 20:16:53 +02:00
commit d79e31f673
7 changed files with 208 additions and 56 deletions
Download patch file Download diff file Expand all files Collapse all files

38
ui/src/lib/settings.js Normal file
View file

@ -0,0 +1,38 @@
export class Settings {
constructor(res) {
if (res) {
this.update(res);
}
}
update({ language, gong_interval, weather_delay, weather_action }) {
this.language = language;
this.gong_interval = gong_interval;
this.weather_delay = weather_delay;
this.weather_action = weather_action;
}
async save() {
const res = await fetch(`api/settings`, {
method: 'PUT',
headers: {'Accept': 'application/json'},
body: JSON.stringify(this),
});
if (res.status == 200) {
const data = await res.json();
this.update(data);
return data;
} else {
throw new Error((await res.json()).errmsg);
}
}
}
export async function getSettings() {
const res = await fetch(`api/settings`, {headers: {'Accept': 'application/json'}})
if (res.status == 200) {
return new Settings(await res.json());
} else {
throw new Error((await res.json()).errmsg);
}
}

124
ui/src/routes/settings/+page.svelte
View file

@ -8,7 +8,17 @@
InputGroup,
InputGroupText,
Label,
Spinner,
} from 'sveltestrap';
import { actions } from '../../stores/actions';
import { getSettings } from '../../lib/settings';
let settingsP = getSettings();
$: settingsP.then((s) => settings = s);
let settings;
</script>
<Container class="flex-fill d-flex flex-column py-2">
@ -16,51 +26,75 @@
Paramètres
</h2>
<Form>
<FormGroup>
<Label for="gongIntervals">Intervalle entre les gongs</Label>
<InputGroup>
{#await settingsP}
<div class="d-flex justify-content-center align-items-center gap-2">
<Spinner color="primary" /> Chargement en cours&hellip;
</div>
{:then}
<FormGroup>
<Label for="gongIntervals">Intervalle entre les gongs</Label>
<InputGroup>
<Input
type="number"
id="gongIntervals"
placeholder="20"
bind:value={settings.gong_interval}
on:change={() => settings.save()}
/>
<InputGroupText>min</InputGroupText>
</InputGroup>
</FormGroup>
<FormGroup>
<Label for="weatherDelay">Annonce météo après</Label>
<InputGroup>
<Input
type="number"
id="weatherDelay"
placeholder="5"
bind:value={settings.weather_delay}
on:change={() => settings.save()}
/>
<InputGroupText>min</InputGroupText>
</InputGroup>
</FormGroup>
<FormGroup>
<Label for="weatherRituel">Rituel pour l'annonce météo</Label>
{#if $actions.list}
<Input
type="select"
id="weatherRituel"
bind:value={settings.weather_action}
on:change={() => settings.save()}
>
{#each $actions.list as action (action.id)}
<option value="{action.path}">{action.name}</option>
{/each}
</Input>
{:else}
{#await actions.refresh()}
<div class="d-flex justify-content-center align-items-center gap-2">
<Spinner color="primary" /> Chargement en cours&hellip;
</div>
{/await}
{/if}
</FormGroup>
<FormGroup>
<Label for="greetingLanguage">Langue de salutation</Label>
<Input
type="number"
id="gongIntervals"
placeholder="20"
/>
<InputGroupText>min</InputGroupText>
</InputGroup>
</FormGroup>
<FormGroup>
<Label for="weatherDelay">Annonce météo après</Label>
<InputGroup>
<Input
type="number"
id="weatherDelay"
placeholder="5"
/>
<InputGroupText>min</InputGroupText>
</InputGroup>
</FormGroup>
<FormGroup>
<Label for="weatherRituel">Rituel pour l'annonce météo</Label>
<Input
type="select"
id="weatherRituel"
>
<option value="1">test</option>
</Input>
</FormGroup>
<FormGroup>
<Label for="greetingLanguage">Langue de salutation</Label>
<Input
type="select"
id="greetingLanguage"
>
<option value="fr_FR">Français</option>
<option value="en_US">Anglais</option>
<option value="es_ES">Espagnol</option>
<option value="de_DE">Allemand</option>
</Input>
</FormGroup>
type="select"
id="greetingLanguage"
bind:value={settings.lang}
on:change={() => settings.save()}
>
<option value="fr_FR">Français</option>
<option value="en_US">Anglais</option>
<option value="es_ES">Espagnol</option>
<option value="de_DE">Allemand</option>
</Input>
</FormGroup>
{/await}
</Form>
</Container>