import * as nav from "./nav.js"; import * as mpd from "./lib/mpd.js"; import * as player from "./player.js"; import * as html from "./lib/html.js"; import * as queue from "./queue.js"; import * as library from "./library.js"; import * as fs from "./fs.js"; import * as playlists from "./playlists.js"; import * as yt from "./yt.js"; const components = { queue, library, fs, playlists, yt }; export function activate(what) { location.hash = what; for (let id in components) { let node = document.querySelector(`#${id}`); if (what == id) { node.style.display = ""; components[id].activate(); } else { node.style.display = "none"; } } nav.active(what); } function initIcons() { Array.from(document.querySelectorAll("[data-icon]")).forEach(node => { let icon = html.icon(node.dataset.icon); node.insertBefore(icon, node.firstChild); }); } function fromHash() { let hash = location.hash.substring(1); activate(hash || "queue"); } function onHashChange(e) { fromHash(); } async function init() { initIcons(); await mpd.init(); nav.init(document.querySelector("nav")); for (let id in components) { let node = document.querySelector(`#${id}`); components[id].init(node); } player.init(document.querySelector("#player")); window.addEventListener("hashchange", onHashChange); fromHash(); } init();