homeservice/webui/src/routes/sauna/+page.svelte

<script>
	import { onMount } from "../../../node_modules/svelte/internal";
	import icon from "$lib/images/sauna.svg"

	let backend_url = "https://home.blackfinn.de/api/sauna";

	let temperature_value = 0.0
	let temperature_unit = "°C"
	let time = "00:00:00";
	let updated = false;

	function get_temperature() {
		fetch(backend_url)
		.then(response => response.json())
		.then(data => {
			temperature_unit = data.unit
			temperature_value = data.value
			time = data.time.slice(11, 19)
			updated = JSON.parse(data.valid);
		}).catch(error => {
			console.log(error);
			return [];
		});
	}

	setInterval(() => {
		get_temperature();
	}, 1000)

	onMount(async () => {
		get_temperature();
	});
</script>

<svelte:head>
	<title>Sauna</title>
	<meta name="description" content="Sauna"/>
</svelte:head>

<section id='content_id' class='content'>
	<h1>Sauna</h1>
	<figure>
		<img src={icon} alt="Sauna" width=150/>
	</figure>
	{#if updated}
		<div>{time} Uhr:</div>
		<h1>{temperature_value} {temperature_unit}</h1>
	{/if}
</section>