64 lines
2.4 KiB
JavaScript
64 lines
2.4 KiB
JavaScript
|
import { getScene, getCategory } from "../api";
|
||
|
|
|
||
|
|
// Function to add a navbar to the destination object
|
||
|
|
|
||
|
|
async function loadNavbar(scene_id, destination) {
|
||
|
|
getScene(scene_id).then((scene) => {
|
||
|
|
getCategory(scene.obj.category).then((category) => {
|
||
|
|
var nav = document.createElement("nav");
|
||
|
|
nav.setAttribute("class", "navbar navbar-expand-lg navbar-dark bg-dark");
|
||
|
|
nav.setAttribute("id", "sceneNavbar");
|
||
|
|
|
||
|
|
var container = document.createElement("div");
|
||
|
|
container.setAttribute("class", "container-fluid");
|
||
|
|
|
||
|
|
var dropdown = document.createElement("div");
|
||
|
|
dropdown.setAttribute("class", "dropdown");
|
||
|
|
|
||
|
|
var sceneSelector = document.createElement("button");
|
||
|
|
sceneSelector.setAttribute("class", "btn btn-secondary dropdown-toggle");
|
||
|
|
sceneSelector.setAttribute("type", "button");
|
||
|
|
sceneSelector.setAttribute("id", "sceneSelector");
|
||
|
|
sceneSelector.setAttribute("data-bs-toggle", "dropdown");
|
||
|
|
sceneSelector.setAttribute("aria-expanded", "true");
|
||
|
|
sceneSelector.textContent = "Select Scene";
|
||
|
|
|
||
|
|
var dropdownMenu = document.createElement("ul");
|
||
|
|
dropdownMenu.setAttribute("class", "dropdown-menu show");
|
||
|
|
dropdownMenu.setAttribute("aria-labelledby", "sceneSelector");
|
||
|
|
console.log(dropdownMenu);
|
||
|
|
|
||
|
|
category.obj.scenes.forEach((scene) => {
|
||
|
|
console.log(scene);
|
||
|
|
var sceneLink = document.createElement("a");
|
||
|
|
sceneLink.setAttribute("class", "dropdown-item");
|
||
|
|
sceneLink.setAttribute("href", "#");
|
||
|
|
sceneLink.textContent = scene.title;
|
||
|
|
sceneLink.addEventListener("click", function () {
|
||
|
|
loadScene(scene.id, -1, -1, -1, destination);
|
||
|
|
});
|
||
|
|
|
||
|
|
dropdownMenu.appendChild(sceneLink);
|
||
|
|
});
|
||
|
|
|
||
|
|
var sceneTitle = document.createElement("a");
|
||
|
|
sceneTitle.setAttribute("class", "navbar-brand");
|
||
|
|
sceneTitle.setAttribute("href", "#");
|
||
|
|
sceneTitle.setAttribute("id", "sceneTitle");
|
||
|
|
sceneTitle.textContent = scene.obj.title;
|
||
|
|
|
||
|
|
dropdown.appendChild(sceneSelector);
|
||
|
|
dropdown.appendChild(dropdownMenu);
|
||
|
|
console.log(dropdownMenu);
|
||
|
|
|
||
|
|
container.appendChild(dropdown);
|
||
|
|
container.appendChild(sceneTitle);
|
||
|
|
|
||
|
|
nav.appendChild(container);
|
||
|
|
|
||
|
|
destination.prepend(nav);
|
||
|
|
});
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
export { loadNavbar };
|