Request click for floating actions buttons and add fullscreen toggle for better mobile use

public/javascripts/index.js

@@ -45,6 +45,14 @@ socket.on("setSlot", data => {
         setSlot(data.name, data.data, ...data.position)
 });
 
+document.getElementById("fullScreen").addEventListener("click", ev => {
+    ev.stopPropagation();
+    if (!document.fullscreenElement)
+        document.documentElement.requestFullscreen();
+    else if (document.exitFullscreen)
+            document.exitFullscreen();
+});
+
 deckSelect.addEventListener("change", ev => {
     ev.stopPropagation();
     socket.emit("getDeck", deckSelect.value);
@@ -74,4 +82,5 @@ function setSlot(name, data, x, y) {
 
 document.addEventListener("DOMContentLoaded", () => {
     M.AutoInit();
+    M.FloatingActionButton.init(document.querySelector(".fixed-action-btn"), {hoverEnabled: false})
 });

views/index.pug

@@ -4,13 +4,19 @@ block content
   h1.center OpenDeck
   .container#deck
 
-  .fixed-action-btn
-    a(href="#modal").btn-floating.btn-large.green.modal-trigger
-      i.large.material-icons toc
+  .fixed-action-btn.no-autoinit
+    a.btn-floating.btn-large.green
+      i.large.material-icons menu
     ul
       li
         a(href="/settings").btn-floating.red
           i.material-icons settings
+      li
+        a(href="#modal").btn-floating.blue.modal-trigger
+          i.material-icons toc
+      li
+        a#fullScreen.btn-floating.yellow
+          i.material-icons fullscreen
 
   #modal.modal
     .modal-content