youen/vehicle-monitor
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

first version of clock widget

Browse Source
This commit is contained in:
Youen Toupin 2022-04-09 19:52:06 +02:00
parent 71b87437c7
commit 3f03e8f8ba
2 changed files with 23 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
WebApp/src/components/widgets/clock.css Normal file
View File

@ -0,0 +1,9 @@
div.clock div.date {
display: inline-block;
}
div.clock p.time {
display: inline-block;
font-size: 3rem;
margin-left: 0.5rem;
}

15
WebApp/src/components/widgets/clock.tsx
View File

@ -1,8 +1,21 @@
import m from 'mithril';
import { Component } from 'components/component'
require("./clock.css");
export default class Clock extends Component {
view(vnode: m.Vnode<{}, {}>): m.Children {
return <p>clock</p>;
var now = new Date();
var days = ['Lundi', 'Mardi', 'Mercredi', 'Jeudi', 'Vendredi', 'Samedi', 'Dimanche'];
var nextUpdateDelay = 61 - now.getSeconds();
setTimeout(() => m.redraw(), nextUpdateDelay * 1000);
return <div class="clock">
<div class="date">
<p class="day">{days[now.getDay()-1]}</p>
<p class="date">{('0'+now.getDate()).slice(-2) + '/' + ('0'+now.getMonth()).slice(-2)}</p>
</div>
<p class="time">{('0'+now.getHours()).slice(-2) + ':' + ('0'+now.getMinutes()).slice(-2)}</p>
</div>;
}
}