cyp/app/js/elements/menu.js

27 lines
659 B
JavaScript
Raw Normal View History

2020-03-10 05:24:31 +08:00
import Component from "../component.js";
2020-03-09 05:11:46 +08:00
class Menu extends Component {
connectedCallback() {
2020-03-29 01:31:28 +08:00
/** @type HTMLElement[] */
2020-03-09 05:11:46 +08:00
this._tabs = Array.from(this.querySelectorAll("[data-for]"));
2020-03-29 01:31:28 +08:00
2020-03-09 05:11:46 +08:00
this._tabs.forEach(tab => {
2020-03-29 01:31:28 +08:00
tab.addEventListener("click", _ => this._app.setAttribute("component", tab.dataset.for));
2020-03-09 05:11:46 +08:00
});
}
2020-03-09 05:11:46 +08:00
_onAppLoad() {
2020-03-17 05:57:13 +08:00
this._app.addEventListener("queue-length-change", e => {
this.querySelector(".queue-length").textContent = `(${e.detail})`;
});
}
2020-03-09 05:11:46 +08:00
_onComponentChange(component) {
2020-05-06 05:03:36 +08:00
this._tabs.forEach(tab => {
2020-03-09 05:11:46 +08:00
tab.classList.toggle("active", tab.dataset.for == component);
});
}
}
customElements.define("cyp-menu", Menu);