Merge branch 'add-fullscreen-toggle' into 'v3'

Add fullscreen toggle button.

Closes #390

See merge request openflexure/openflexure-microscope-server!377

webapp/src/components/tabContentComponents/settingsComponents/appSettings.vue

@@ -11,9 +11,13 @@
         </select>
       </label>
     </p>
+    <p>
+      <button class="uk-button uk-button-default" @click="toggleFullscreen">
+        Toggle Fullscreen
+      </button>
+    </p>
   </div>
 </template>
-
 <script>
 // Export main app
 export default {
@@ -34,6 +38,16 @@ export default {
     }
   },
 
+  methods: {
+    async toggleFullscreen() {
+      if (!document.fullscreenElement) {
+        await document.documentElement.requestFullscreen();
+      } else {
+        await document.exitFullscreen();
+      }
+    }
+  },
+
   watch: {
     appTheme: function() {
       this.setLocalStorageObj("appTheme", this.appTheme);