fullscreen mode added (not finalized)

graph.js

@@ -7,6 +7,7 @@ let firstTick = true;
 const colorPallette = ['rgb(104, 169, 77)', 'rgb(102, 75, 154)', 'rgb(41, 171, 226)', 'rgb(224, 133, 35)',
     'rgb(214, 207, 126)', 'rgb(239, 65, 35)', 'rgb(255, 255, 255)'];
 const edgeColors = {};
+var graph_element = document.getElementById('3d-graph');
 
 loadGraph();
 
@@ -40,12 +41,13 @@ function loadComponents() {
         add_background();
         createLinkOverlay();
         createInfoOverlay();
+        add_fullscreen_mode_button();
         firstTick = false;
     }
 }
 
 function getWidth() {
-    return document.getElementById('3d-graph').parentElement.offsetWidth;
+    return graph_element.parentElement.offsetWidth;
 }
 
 function mapEdgeColors() {
@@ -183,6 +185,21 @@ function createLinkOverlay() {
     }
 }
 
+function add_fullscreen_mode_button() {
+    const sceneNode = getCanvasDivNode();
+    const overlayNode = document.createElement('button');
+    overlayNode.className = 'fullscreen_button';
+    overlayNode.innerText = 'fullscreen';
+    overlayNode.addEventListener("click", fullscreen_mode);
+    sceneNode.insertBefore(overlayNode, sceneNode.childNodes[2]);
+}
+
+function fullscreen_mode(){
+
+    if(graph_element.requestFullscreen) {
+        graph_element.requestFullscreen().catch();
+    }
+}
 
 function add_background() {
     const sphereGeometry = new THREE.SphereGeometry(20000, 32, 32);