Replaced fullscreen auto logic with button toggle

platypush/backend/http/static/js/application.js

@@ -25,26 +25,8 @@ window.vm = new Vue({
     },
 
     methods: {
-        enterFullScreen: function() {
-            const self = this;
-            enterFullScreen().then(() => {
-                self.fullscreen = true;
-            });
-        },
-
-        exitFullScreen: function() {
-            const self = this;
-            exitFullscreen().finally(() => {
-                self.fullscreen = false;
-            });
-        },
-
         toggleFullScreen: function() {
-            if (this.fullscreen) {
+            toggleFullScreen();
-                this.exitFullScreen();
-            } else {
-                this.enterFullScreen();
-            }
         },
     },
 
@@ -54,12 +36,6 @@ window.vm = new Vue({
             this.selectedPlugin = m[1];
         }
 
-        m = window.location.href.match('[?&]fs=([01])');
-        if (m) {
-            this.fullscreen = !parseInt(m[1]);
-            this.toggleFullScreen();
-        }
-
         const self = this;
         setInterval(() => {
             self.now = new Date();

platypush/backend/http/static/js/utils.js

@@ -32,3 +32,16 @@ function exitFullScreen() {
     }
 }
 
+function toggleFullScreen() {
+    const elem = document.fullscreenElement
+            || document.webkitFullscreenElement
+            || document.msFullscreenElement
+            || document.mozFullScreenElement;
+
+    if (elem) {
+        exitFullScreen();
+    } else {
+        enterFullScreen();
+    }
+}
+

platypush/backend/http/templates/nav.html

@@ -41,6 +41,10 @@
     </ul>
 
     <div class="date-time pull-right">
+        <a href="#" class="settings" @click="toggleFullScreen()">
+            <i class="fas fa-compress"></i>
+        </a>
+
         <a href="/settings" class="settings">
             <i class="fas fa-cog"></i>
         </a>