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 @@ +