From 2957ded7d832c14ddac09362013c1e2cd02e39d7 Mon Sep 17 00:00:00 2001 From: Ondrej Zara Date: Sat, 28 Mar 2020 18:31:28 +0100 Subject: [PATCH] cleanup --- app/cyp.js | 24 ++++++++---------------- app/js/elements/menu.js | 24 ++++++++---------------- 2 files changed, 16 insertions(+), 32 deletions(-) diff --git a/app/cyp.js b/app/cyp.js index b2c07ec..1570fcc 100644 --- a/app/cyp.js +++ b/app/cyp.js @@ -808,29 +808,21 @@ class Component extends HTMLElement { } class Menu extends Component { - constructor() { - super(); - - this._tabs = Array.from(this.querySelectorAll("[data-for]")); - this._tabs.forEach(tab => { - tab.addEventListener("click", _ => this._activate(tab.dataset.for)); - }); - } - _onAppLoad() { + /** @type HTMLElement[] */ + this._tabs = Array.from(this.querySelectorAll("[data-for]")); + + this._tabs.forEach(tab => { + tab.addEventListener("click", _ => this._app.setAttribute("component", tab.dataset.for)); + }); + this._app.addEventListener("queue-length-change", e => { this.querySelector(".queue-length").textContent = `(${e.detail})`; }); } - - async _activate(component) { - const app = await this._app; - app.setAttribute("component", component); - } - _onComponentChange(component) { - this._tabs.forEach(/** @param {HTMLElement} tab */ tab => { + this._tabs.forEach( tab => { tab.classList.toggle("active", tab.dataset.for == component); }); } diff --git a/app/js/elements/menu.js b/app/js/elements/menu.js index 00bc229..90a7a72 100644 --- a/app/js/elements/menu.js +++ b/app/js/elements/menu.js @@ -1,29 +1,21 @@ import Component from "../component.js"; class Menu extends Component { - constructor() { - super(); - - this._tabs = Array.from(this.querySelectorAll("[data-for]")); - this._tabs.forEach(tab => { - tab.addEventListener("click", _ => this._activate(tab.dataset.for)); - }); - } - _onAppLoad() { + /** @type HTMLElement[] */ + this._tabs = Array.from(this.querySelectorAll("[data-for]")); + + this._tabs.forEach(tab => { + tab.addEventListener("click", _ => this._app.setAttribute("component", tab.dataset.for)); + }); + this._app.addEventListener("queue-length-change", e => { this.querySelector(".queue-length").textContent = `(${e.detail})`; }); } - - async _activate(component) { - const app = await this._app; - app.setAttribute("component", component); - } - _onComponentChange(component) { - this._tabs.forEach(/** @param {HTMLElement} tab */ tab => { + this._tabs.forEach( tab => { tab.classList.toggle("active", tab.dataset.for == component); }); }