50 lines
1.2 KiB
Svelte
50 lines
1.2 KiB
Svelte
<script>
|
|
import { onMount } from "../../../node_modules/svelte/internal";
|
|
import icon from "$lib/images/wheels.svg"
|
|
|
|
let backend_url = "https://home.blackfinn.de/api/bicycle";
|
|
// let backend_url = "http://localhost:5000/api/bicycle";
|
|
|
|
let year = "2024";
|
|
let total_distance_value = 0.0;
|
|
let total_distance_unit = "m"
|
|
let year_result_value = 0.0;
|
|
let year_result_unit = "m"
|
|
|
|
function get_api() {
|
|
fetch(backend_url)
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
total_distance_value = data.Years[year].total_distance.value
|
|
total_distance_unit = data.Years[year].total_distance.unit
|
|
year_result_value = data.Years[year].year_result.value
|
|
year_result_unit = data.Years[year].year_result.unit
|
|
}).catch(error => {
|
|
console.log(error);
|
|
return [];
|
|
});
|
|
}
|
|
|
|
setInterval(() => {
|
|
get_api();
|
|
}, 1000)
|
|
|
|
onMount(async () => {
|
|
get_api();
|
|
});
|
|
</script>
|
|
|
|
<svelte:head>
|
|
<title>Bicycle</title>
|
|
<meta name="description" content="Bicycle"/>
|
|
</svelte:head>
|
|
|
|
<section id='content_id' class='content'>
|
|
<h1>Bicycle</h1>
|
|
<figure>
|
|
<img src={icon} alt="Bicycle" width=150/>
|
|
</figure>
|
|
<h1>Total distance: {total_distance_value} {total_distance_unit}</h1>
|
|
<h1>Year result: {year_result_value} {year_result_unit}</h1>
|
|
</section>
|