added in-fullscreen class when in fullscreen

Viewer/assets/templates/default/navbar.html

@@ -143,19 +143,7 @@
     A few browsers dont support combining the next rule to one. Redudant.
     */
 
-    viewer:fullscreen .fullscreen-icon:after {
-        content: "\E73F";
-    }
-
-    viewer:-webkit-full-screen .fullscreen-icon:after {
-        content: "\E73F";
-    }
-
-    viewer:-moz-full-screen .fullscreen-icon:after {
-        content: "\E73F";
-    }
-
-    viewer:-ms-full-screen .fullscreen-icon:after {
+    viewer.in-fullscreen .fullscreen-icon:after {
         content: "\E73F";
     }
 
@@ -438,15 +426,7 @@
 </style>
 {{/if}} {{/if}} {{#if disableOnFullscreen}}
 <style>
-    viewer:fullscreen nav-bar {
-        display: none;
-    }
-
-    viewer:-moz-full-screen nav-bar {
-        display: none;
-    }
-
-    viewer:-webkit-full-screen nav-bar {
+    viewer.fullscreen nav-bar {
         display: none;
     }
 </style>

Viewer/src/viewer/defaultViewer.ts

@@ -312,16 +312,23 @@ export class DefaultViewer extends AbstractViewer {
      */
     public toggleFullscreen = () => {
         let viewerTemplate = this.templateManager.getTemplate('viewer');
-        let fullscreenElement = this.fullscreenElement || (viewerTemplate && viewerTemplate.parent);
+        let viewerElement = viewerTemplate && viewerTemplate.parent;
+        let fullscreenElement = this.fullscreenElement || viewerElement;
 
         if (fullscreenElement) {
-            let fullscreenElement = document.fullscreenElement || document.webkitFullscreenElement || (<any>document).mozFullScreenElement || (<any>document).msFullscreenElement;
-            if (!fullscreenElement) {
+            let currentElement = document.fullscreenElement || document.webkitFullscreenElement || (<any>document).mozFullScreenElement || (<any>document).msFullscreenElement;
+            if (!currentElement) {
                 let requestFullScreen = fullscreenElement.requestFullscreen || fullscreenElement.webkitRequestFullscreen || (<any>fullscreenElement).msRequestFullscreen || (<any>fullscreenElement).mozRequestFullScreen;
                 requestFullScreen.call(fullscreenElement);
+                if (viewerElement) {
+                    viewerElement.classList.add("in-fullscreen");
+                }
             } else {
                 let exitFullscreen = document.exitFullscreen || document.webkitExitFullscreen || (<any>document).msExitFullscreen || (<any>document).mozCancelFullScreen
                 exitFullscreen.call(document);
+                if (viewerElement) {
+                    viewerElement.classList.remove("in-fullscreen");
+                }
             }
         }
     }