Add setter to the toggle

This commit is contained in:
a 2020-07-26 21:14:45 +02:00
parent 1eb88d524f
commit f63d03b87a

View file

@ -1,20 +1,28 @@
import { browser } from "webextension-polyfill-ts"; import { browser } from "webextension-polyfill-ts";
import "./popup.scss"; import "./popup.scss";
class ExtensionToggle extends HTMLButtonElement { class ExtensionToggle extends HTMLButtonElement {
on: boolean = false; isON: boolean = false;
innerHTML: string = "OFF"; innerHTML: string = "OFF";
constructor() {
super(); public set on(v: boolean) {
this.addEventListener("click", this.toggle); if (this.isON == v) {
return;
} }
toggle() { this.isON = v;
this.on = !this.on;
this.innerHTML = this.on ? "ON" : "OFF"; this.innerHTML = this.on ? "ON" : "OFF";
const toggleEvent = new CustomEvent("extensionToggled", { const toggleEvent = new CustomEvent("extensionToggled", {
detail: this.on, detail: this.on,
}); });
this.dispatchEvent(toggleEvent); this.dispatchEvent(toggleEvent);
} }
public get on(): boolean {
return this.isON;
}
constructor() {
super();
this.addEventListener("click", () => (this.on = !this.on));
}
} }
customElements.define("extension-toggle", ExtensionToggle, { customElements.define("extension-toggle", ExtensionToggle, {
extends: "button", extends: "button",