diff options
author | samhed <samuel@cendio.se> | 2015-06-18 10:45:59 +0200 |
---|---|---|
committer | samhed <samuel@cendio.se> | 2015-06-25 22:37:05 +0200 |
commit | 7d1dc09ad0010924c6940832225e5eb2dc803f4f (patch) | |
tree | 090683d1cf170c342e646afb378d9b28ce422f3b | |
parent | b098afc234528af8d3e6d708226d8839d8132d20 (diff) | |
download | novnc-7d1dc09ad0010924c6940832225e5eb2dc803f4f.tar.gz |
Fixes #498 - Add the ability to toggle fullscreen mode
-rw-r--r-- | images/fullscreen.png | bin | 0 -> 851 bytes | |||
-rw-r--r-- | include/ui.js | 54 | ||||
-rw-r--r-- | vnc.html | 3 |
3 files changed, 57 insertions, 0 deletions
diff --git a/images/fullscreen.png b/images/fullscreen.png Binary files differnew file mode 100644 index 0000000..f4fa0ce --- /dev/null +++ b/images/fullscreen.png diff --git a/include/ui.js b/include/ui.js index 3d3c41e..0d9ad82 100644 --- a/include/ui.js +++ b/include/ui.js @@ -131,6 +131,19 @@ var UI; UI.setBarPosition(); } ); + // Hide the button if fullscreen isn't supported + if (!document.documentElement.requestFullscreen && + !document.documentElement.mozRequestFullScreen && + !document.documentElement.webkitRequestFullscreen && + !document.body.msRequestFullscreen) { + $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 () { @@ -201,6 +214,7 @@ var UI; $D("noVNC_popup_status").onclick = UI.togglePopupStatus; $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; @@ -437,6 +451,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.mozCancelFullScreen) { + document.mozCancelFullScreen(); + } else if (document.webkitExitFullscreen) { + document.webkitExitFullscreen(); + } else if (document.msExitFullscreen) { + document.msExitFullscreen(); + } + } else { + if (document.documentElement.requestFullscreen) { + document.documentElement.requestFullscreen(); + } else if (document.documentElement.mozRequestFullScreen) { + document.documentElement.mozRequestFullScreen(); + } else if (document.documentElement.webkitRequestFullscreen) { + document.documentElement.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT); + } else if (document.body.msRequestFullscreen) { + document.body.msRequestFullscreen(); + } + } + 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 @@ -99,6 +99,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" /> |