From 530bb7c5b6ac5d5e35bce3afcf65e5f0464b984b Mon Sep 17 00:00:00 2001
From: Matthias Konitzny <konitzny@ibr.cs.tu-bs.de>
Date: Tue, 7 Dec 2021 15:05:45 +0100
Subject: [PATCH] Increased browser-compatibility when toggling fullscreen
 mode. #8

---
 display/display.js |  9 +++++----
 package-lock.json  | 17 +++++++++++++++++
 package.json       |  1 +
 3 files changed, 23 insertions(+), 4 deletions(-)

diff --git a/display/display.js b/display/display.js
index 2c4d416..21484a3 100644
--- a/display/display.js
+++ b/display/display.js
@@ -3,6 +3,7 @@ import * as Config from "../config";
 import { FilterOverlay } from "./overlays/filteroverlay";
 import { NodeInfoOverlay } from "./overlays/nodeinfo";
 import Graph from "./graph";
+import screenfull from "screenfull";
 
 function loadComponents() {
     filterOverlay.create();
@@ -18,12 +19,12 @@ function createFullScreenButton() {
     overlayNode.className = "fullscreen-button";
     overlayNode.innerHTML = "<p>&#10530;</p>";
     overlayNode.addEventListener("click", function () {
-        if (!document.fullscreenElement) {
-            Helpers.getCanvasDivNode().requestFullscreen();
+        if (screenfull.isEnabled) {
+            screenfull.toggle(Helpers.getCanvasDivNode());
+            G.resize();
         } else {
-            document.exitFullscreen();
+            console.log("No fullscreen mode available :(");
         }
-        G.resize();
     });
     sceneNode.appendChild(overlayNode);
 }
diff --git a/package-lock.json b/package-lock.json
index c072d3c..193edb8 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -12,6 +12,7 @@
         "3d-force-graph": "^1.70.5",
         "force-graph": "^1.42.4",
         "jquery": "^3.6.0",
+        "screenfull": "^6.0.0",
         "three": ">=0.118.3"
       },
       "devDependencies": {
@@ -11856,6 +11857,17 @@
         "node": ">=8"
       }
     },
+    "node_modules/screenfull": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/screenfull/-/screenfull-6.0.0.tgz",
+      "integrity": "sha512-LGY0nhNQkC4FX4DT4pZdJ5cZH5EOz9Gfh9KcVMl779pS677k4IV1Wv7sY/CwC9VKFT21fYgCh7zkTVVefi5XKA==",
+      "engines": {
+        "node": "^14.13.1 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/semver": {
       "version": "6.3.0",
       "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
@@ -23002,6 +23014,11 @@
         "xmlchars": "^2.1.1"
       }
     },
+    "screenfull": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/screenfull/-/screenfull-6.0.0.tgz",
+      "integrity": "sha512-LGY0nhNQkC4FX4DT4pZdJ5cZH5EOz9Gfh9KcVMl779pS677k4IV1Wv7sY/CwC9VKFT21fYgCh7zkTVVefi5XKA=="
+    },
     "semver": {
       "version": "6.3.0",
       "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
diff --git a/package.json b/package.json
index aa1e5c8..d50ff2e 100644
--- a/package.json
+++ b/package.json
@@ -48,6 +48,7 @@
     "3d-force-graph": "^1.70.5",
     "force-graph": "^1.42.4",
     "jquery": "^3.6.0",
+    "screenfull": "^6.0.0",
     "three": ">=0.118.3"
   }
 }
-- 
GitLab