|
13
|
1 import { css, html, LitElement } from "lit";
|
|
|
2 import { shared } from "./shared";
|
|
|
3
|
|
|
4
|
|
|
5 export class FdClock extends LitElement {
|
|
|
6 constructor() {
|
|
|
7 super();
|
|
|
8 setInterval(() => {
|
|
|
9 this.requestUpdate();
|
|
|
10 }, 1000);
|
|
|
11 }
|
|
|
12 static styles = [
|
|
|
13 shared,
|
|
|
14 css`
|
|
|
15 :host {
|
|
|
16 display: inline block;
|
|
|
17 }
|
|
|
18 `,
|
|
|
19 ];
|
|
|
20 render() {
|
|
|
21 const t = new Date();
|
|
|
22 const h = t.getHours().toString().padStart(2, "0");
|
|
|
23 const m = t.getMinutes().toString().padStart(2, "0");
|
|
|
24 const s = t.getSeconds().toString().padStart(2, "0");
|
|
|
25 return html` <span class="t">${h}:${m.slice(0, 2)}:${s.slice(0, 2)}</span> `;
|
|
|
26 }
|
|
|
27 }
|
|
|
28 customElements.define("fd-clock", FdClock);
|
