Add fullscreen framework

Signed-off-by: Justin Georgi <justin.georgi@gmail.com>

modules/glmv.css

@@ -84,6 +84,18 @@
 
 .glmv-container {
     position: relative;
+
+    & .full-show {
+        display: none !important;
+    }
+
+    &:fullscreen .full-hide {
+        display: none !important;
+    }
+
+    &:fullscreen .full-show {
+        display: flex !important;
+    }
 }
 
 .glmv-menu {
@@ -103,7 +115,7 @@
     justify-content: flex-start;
 
     &:hover {
-        width: 160px;
+        width: 196px;
 
         & .glmv-menu-image {
             transform: rotate(180deg);

modules/glmv.js

@@ -413,4 +413,17 @@ downloadImage = function(defName) {
         .then(imgBlob => {
             reader.readAsDataURL(imgBlob)
         })
+}
+
+/**
+ * Respond to full screen changes on the gl container
+ * 
+ * @param {Element} glCont container element to enlarge or reduce
+ */
+toggleFullScreen = function(glCont) {
+    if (document.fullscreenElement) {
+        document.exitFullscreen()
+    } else {
+        glCont.requestFullscreen()
+    }
 }