HTML Timer

timer.html

<script type="module">
	import {Better} from "/better.js"

	class ConstantInterval extends Better {
		#timer
		static attributes = {
			interval: { get: Number },
			onTick: {
				get: Function,
				set: e => `(${e.toString()})()`
			}
		}
		intervalChanged(t) {
			if (this.#timer) window.clearInterval(this.#timer)
			this.#timer = window.setInterval(() => this.tick(), Number(t)*1e3)
		}
		tick() {
			this.onTick()
			this.dispatchEvent(new CustomEvent("tick"))
		}
	}
	ConstantInterval.initialize()
</script>

<constant-interval interval=2 on-tick="console.log('tick')"></constant-interval>