Youen Toupin
3 years ago
2 changed files with 23 additions and 1 deletions
@ -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