Add bicycle page
This commit is contained in:
Thomas Klaehn
parent
52dbdb0b65
commit
99d0cb478a
@ -15,7 +15,8 @@
|
|||||||
|
|
||||||
<ul class="menu">
|
<ul class="menu">
|
||||||
<li><a href="/">Home</a></li>
|
<li><a href="/">Home</a></li>
|
||||||
<li><a href="/sauna">Sauna</a></li>
|
<li><a href="/bicycle">Bicycle</a></li>
|
||||||
<!-- <li><a href="/chicken">Chicken</a></li> -->
|
<!-- <li><a href="/chicken">Chicken</a></li> -->
|
||||||
|
<li><a href="/sauna">Sauna</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</header>
|
</header>
|
||||||
|
|||||||
53
webui/src/lib/images/wheels.svg
Normal file
53
webui/src/lib/images/wheels.svg
Normal file
@ -0,0 +1,53 @@
|
|||||||
|
<?xml version="1.0" encoding="iso-8859-1"?>
|
||||||
|
<!-- Generator: Adobe Illustrator 18.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||||
|
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||||
|
<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||||
|
viewBox="0 0 397.6 397.6" style="enable-background:new 0 0 397.6 397.6;" xml:space="preserve">
|
||||||
|
<path d="M313.1,147.875c-6.057,0-11.962,0.654-17.661,1.871l-15.805-53.435l37.842-2.565c4.447-0.301,8.487,2.613,9.602,6.932
|
||||||
|
c0.689,2.671,0.161,5.488-1.45,7.728c-1.611,2.24-4.113,3.638-6.865,3.834l-9.126,0.652c-3.581,0.256-6.276,3.366-6.02,6.947
|
||||||
|
s3.361,6.289,6.947,6.02l9.126-0.652c6.611-0.472,12.623-3.829,16.493-9.21c3.87-5.382,5.14-12.148,3.484-18.566
|
||||||
|
c-2.677-10.375-12.376-17.364-23.069-16.654l-45.936,3.114c-1.969,0.134-3.77,1.154-4.896,2.773
|
||||||
|
c-1.127,1.62-1.457,3.663-0.897,5.556l6.405,21.656H145.477l-6.316-12H155.5c3.59,0,6.5-2.91,6.5-6.5s-2.91-6.5-6.5-6.5h-47
|
||||||
|
c-3.59,0-6.5,2.91-6.5,6.5s2.91,6.5,6.5,6.5h16.086l9.542,18.349l-18.836,33.485c-9.549-3.751-19.929-5.834-30.792-5.834
|
||||||
|
c-46.593,0-84.5,37.906-84.5,84.5s37.907,84.5,84.5,84.5c44.404,0,80.892-34.436,84.225-78c0,0,31.695,0,31.776,0
|
||||||
|
c2.235,0,4.32-1.15,5.511-3.055l68.779-110.047l8.185,27.672c-31.758,12.162-54.376,42.945-54.376,78.93
|
||||||
|
c0,46.594,37.907,84.5,84.5,84.5s84.5-37.906,84.5-84.5S359.693,147.875,313.1,147.875z M84.5,303.875
|
||||||
|
c-39.425,0-71.5-32.075-71.5-71.5s32.075-71.5,71.5-71.5c8.549,0,16.75,1.513,24.355,4.276l-31.482,55.968
|
||||||
|
c-3.726,2.365-6.206,6.516-6.206,11.256c0,7.363,5.969,13.333,13.333,13.333c5.002,0,9.354-2.759,11.636-6.833h59.556
|
||||||
|
C152.395,275.263,121.733,303.875,84.5,303.875z M96.136,225.875c-0.99-1.769-2.37-3.285-4.025-4.439l28.528-50.717
|
||||||
|
c19.37,11.397,32.922,31.647,35.052,55.156H96.136z M168.725,225.875c-2.17-28.365-18.393-52.845-41.715-66.482l14.327-25.471
|
||||||
|
l48.396,91.953H168.725z M200.983,219.337l-48.665-92.462h106.454L200.983,219.337z M313.1,303.875c-39.425,0-71.5-32.075-71.5-71.5
|
||||||
|
c0-30.093,18.697-55.885,45.077-66.418l16.89,57.105c-2.348,2.403-3.8,5.687-3.8,9.313c0,7.363,5.969,13.333,13.333,13.333
|
||||||
|
s13.333-5.97,13.333-13.333c0-6.354-4.449-11.661-10.399-12.999l-16.895-57.123c4.518-0.897,9.184-1.378,13.962-1.378
|
||||||
|
c39.425,0,71.5,32.075,71.5,71.5S352.525,303.875,313.1,303.875z"/>
|
||||||
|
<g>
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.5 KiB |
2
webui/src/routes/bicycle/+page.js
Normal file
2
webui/src/routes/bicycle/+page.js
Normal file
@ -0,0 +1,2 @@
|
|||||||
|
export const prerender = true;
|
||||||
|
export const trailingSlash = 'always';
|
||||||
50
webui/src/routes/bicycle/+page.svelte
Normal file
50
webui/src/routes/bicycle/+page.svelte
Normal file
@ -0,0 +1,50 @@
|
|||||||
|
<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 = 2023;
|
||||||
|
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 => {
|
||||||
|
console.log(data.Years[year])
|
||||||
|
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>
|
||||||
Loading…
Reference in New Issue
Block a user