jeena/en.javascript.info
1
0
Fork 0
Code Issues Pull requests Projects Packages Wiki Activity Actions

draft

Browse source
This commit is contained in:
Ilya Kantor 2019-03-30 14:32:38 +03:00
parent 65671ab7ba
commit 9c3ac133e3
23 changed files with 330 additions and 273 deletions
Download patch file Download diff file Expand all files Collapse all files

32
8-web-components/2-custom-elements/1-custom-timer/live-timer.js
View file

@ -1,32 +0,0 @@
class LiveTimer extends HTMLElement {
render() {
this.innerHTML = `
<time-formatted hour="numeric" minute="numeric" second="numeric">
</time-formatted>
`;
this.timerElem = this.firstElementChild;
}
connectedCallback() { // (2)
if (!this.rendered) {
this.render();
this.rendered = true;
}
this.timer = setInterval(() => this.update(), 1000);
}
update() {
this.date = new Date();
this.timerElem.setAttribute('datetime', this.date);
this.dispatchEvent(new CustomEvent('tick', { detail: this.date }));
}
disconnectedCallback() {
clearInterval(this.timer); // important to let the element be garbage-collected
}
}
customElements.define("live-timer", LiveTimer);