first version of clock widget
This commit is contained in:
parent
71b87437c7
commit
3f03e8f8ba
9
WebApp/src/components/widgets/clock.css
Normal file
9
WebApp/src/components/widgets/clock.css
Normal 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;
|
||||||
|
}
|
@ -1,8 +1,21 @@
|
|||||||
import m from 'mithril';
|
import m from 'mithril';
|
||||||
import { Component } from 'components/component'
|
import { Component } from 'components/component'
|
||||||
|
|
||||||
|
require("./clock.css");
|
||||||
|
|
||||||
export default class Clock extends Component {
|
export default class Clock extends Component {
|
||||||
view(vnode: m.Vnode<{}, {}>): m.Children {
|
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>;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user