diff --git a/display/graph.js b/display/graph.js index 0c14467f517f6a3d94a34eaf24271b7c9e349c7f..7f975db61ddae74f302a4038e450c9799711824b 100644 --- a/display/graph.js +++ b/display/graph.js @@ -50,11 +50,12 @@ class Graph { this.updateNodeMap(); this.addBackground(); + loadComponents(); + // Catch resize events - getCanvasDivNode().addEventListener("fullscreenchange", this.resize()); - window.onresize = G.resize(); + document.addEventListener("fullscreenchange", () => this.resize()); + window.addEventListener("resize", () => this.resize()); - loadComponents(); this.firstTick = false; } } @@ -159,10 +160,13 @@ class Graph { } resize() { + console.log(document.fullscreenElement); if(document.fullscreenElement == getCanvasDivNode()) { + console.log("Resizing to fullscreen"); this.graph.height(screen.height); this.graph.width(screen.width); } else { + console.log("Resizing to column"); this.graph.height(window.innerHeight - 200); this.graph.width(getWidth()); } @@ -188,12 +192,6 @@ class Graph { } } - resize() { - this.graph.width(getWidth()); - this.graph.height(getHeight()); - } - - drawNode(node) { // Draw node as label + image const nodeDiv = document.createElement('div'); @@ -252,8 +250,12 @@ function createFullScreenButton() { overlayNode.className = 'fullscreen_button'; overlayNode.innerText = 'fullscreen'; overlayNode.addEventListener("click", function () { + console.log("Catched event"); if(getCanvasDivNode().requestFullscreen) { - getCanvasDivNode().requestFullscreen().catch(); + getCanvasDivNode().requestFullscreen().then( + () => G.resize() + ); + } }); sceneNode.appendChild(overlayNode);