display.js

import * as Helpers from "./helpers";
import * as Config from "../config";
import { FilterOverlay } from "./overlays/filteroverlay";
import { NodeInfoOverlay } from "./overlays/nodeinfo";
import Graph from "./graph";

function loadComponents() {
    filterOverlay.create();
    infoOverlay.create();
    filterOverlay.filterChangedCallback = (cls) =>
        infoOverlay.bottomMenu.toggleTabVisibility(cls);
    createFullScreenButton();
}

function createFullScreenButton() {
    const sceneNode = Helpers.getCanvasDivNode();
    const overlayNode = document.createElement("div");
    overlayNode.className = "fullscreen-button";
    overlayNode.innerHTML = "<p>&#10530;</p>";
    overlayNode.addEventListener("click", function () {
        if (!document.fullscreenElement) {
            Helpers.getCanvasDivNode().requestFullscreen();
        } else {
            document.exitFullscreen();
        }
        G.resize();
    });
    sceneNode.appendChild(overlayNode);
}

let G = null;
let filterOverlay = null;
let infoOverlay = null;

// Only execute, if corresponding dom is present
if (document.getElementById("3d-graph") !== null) {
    G = new Graph(Config.SPACE, loadComponents);
    filterOverlay = new FilterOverlay(G, "node");
    infoOverlay = new NodeInfoOverlay(G);
    G.infoOverlay = infoOverlay;
}