Attachment 608 Details for Bug 5454 – Adds the option to toggle fullscreen in the HTML5 client

[patch] Adds the option to toggle fullscreen in the HTML5 client

fullscreen.patch (text/plain), 4.44 KB, created by Samuel Mannehed on 2015-03-02 13:17:03 CET

(hide)

Description:

Filename:

MIME Type:

Creator: Samuel Mannehed

Created: 2015-03-02 13:17:03 CET

Size: 4.44 KB

patch

obsolete

>diff --git a/images/fullscreen.png b/images/fullscreen.png
>new file mode 100644
>index 0000000..f4fa0ce
>Binary files /dev/null and b/images/fullscreen.png differ
>diff --git a/include/ui.js b/include/ui.js
>index e923ea8..b12f2d2 100644
>--- a/include/ui.js
>+++ b/include/ui.js
>@@ -159,6 +159,19 @@ var UI;
>                 }, 500);
>             } );
> 
>+
>+            // iOS Safari does not support fullscreen
>+            if ((navigator.userAgent.match(/iPhone/i)) ||
>+                (navigator.userAgent.match(/iPod/i)) ||
>+                (navigator.userAgent.match(/iPad/i))) {
>+                $D('fullscreenButton').style.display = "none";
>+            } else {
>+                Util.addEvent(window, 'fullscreenchange', UI.updateFullscreenButton);
>+                Util.addEvent(window, 'mozfullscreenchange', UI.updateFullscreenButton);
>+                Util.addEvent(window, 'webkitfullscreenchange', UI.updateFullscreenButton);
>+                Util.addEvent(window, 'msfullscreenchange', UI.updateFullscreenButton);
>+            }
>+
>             Util.addEvent(window, 'load', UI.keyboardinputReset);
> 
>             Util.addEvent(window, 'beforeunload', function () {
>@@ -222,6 +235,7 @@ var UI;
>             $D("noVNC_popup_status_panel").onclick = UI.togglePopupStatusPanel;
>             $D("xvpButton").onclick = UI.toggleXvpPanel;
>             $D("clipboardButton").onclick = UI.toggleClipboardPanel;
>+            $D("fullscreenButton").onclick = UI.toggleFullscreen;
>             $D("settingsButton").onclick = UI.toggleSettingsPanel;
>             $D("connectButton").onclick = UI.toggleConnectPanel;
>             $D("disconnectButton").onclick = UI.disconnect;
>@@ -400,6 +414,46 @@ var UI;
>             }
>         },
> 
>+        // Toggle fullscreen mode
>+        toggleFullscreen: function() {
>+            if (document.fullscreenElement || // alternative standard method
>+                document.mozFullScreenElement || // currently working methods
>+                document.webkitFullscreenElement ||
>+                document.msFullscreenElement ) {
>+                if (document.exitFullscreen) {
>+                    document.exitFullscreen();
>+                } else if (document.msExitFullscreen) {
>+                    document.msExitFullscreen();
>+                } else if (document.mozCancelFullScreen) {
>+                    document.mozCancelFullScreen();
>+                } else if (document.webkitExitFullscreen) {
>+                    document.webkitExitFullscreen();
>+                }
>+            } else {
>+                if (document.documentElement.requestFullscreen) {
>+                    document.documentElement.requestFullscreen();
>+                } else if (document.documentElement.msRequestFullscreen) {
>+                    document.documentElement.msRequestFullscreen();
>+                } else if (document.documentElement.mozRequestFullScreen) {
>+                    document.documentElement.mozRequestFullScreen();
>+                } else if (document.documentElement.webkitRequestFullscreen) {
>+                    document.documentElement.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
>+                }
>+            }
>+            UI.updateFullscreenButton();
>+        },
>+
>+        updateFullscreenButton: function() {
>+            if (document.fullscreenElement || // alternative standard method
>+                document.mozFullScreenElement || // currently working methods
>+                document.webkitFullscreenElement ||
>+                document.msFullscreenElement ) {
>+                $D('fullscreenButton').className = "noVNC_status_button_selected";
>+            } else {
>+                $D('fullscreenButton').className = "noVNC_status_button";
>+            }
>+        },
>+
>         // Show the connection settings panel/menu
>         toggleConnectPanel: function() {
>             // Close the description panel
>diff --git a/vnc.html b/vnc.html
>index 7cc07cf..fa0e97b 100644
>--- a/vnc.html
>+++ b/vnc.html
>@@ -100,6 +100,9 @@
>             <input type="image" alt="Clipboard" src="images/clipboard.png"
>                 id="clipboardButton" class="noVNC_status_button"
>                 title="Clipboard" />
>+            <input type="image" alt="Fullscreen" src="images/fullscreen.png"
>+                id="fullscreenButton" class="noVNC_status_button"
>+                title="Fullscreen" />
>             <input type="image" alt="Settings" src="images/settings.png"
>                 id="settingsButton" class="noVNC_status_button"
>                 title="Settings" />

Actions: View | Diff

Attachments on bug 5454: 608 | 609