diff --git a/images/fullscreen.png b/images/fullscreen.png
new file mode 100644
index 00000000..f4fa0ce8
Binary files /dev/null and b/images/fullscreen.png differ
diff --git a/include/base.css b/include/base.css
index f69e64b7..2769357e 100644
--- a/include/base.css
+++ b/include/base.css
@@ -59,6 +59,9 @@ html {
#sendCtrlAltDelButton {
display: none;
}
+#fullscreenButton {
+ display: none;
+}
#noVNC_xvp_buttons {
display: none;
}
diff --git a/include/display.js b/include/display.js
index 9a8e4559..8994856b 100644
--- a/include/display.js
+++ b/include/display.js
@@ -229,13 +229,14 @@ var Display;
saveImg = this._drawCtx.getImageData(0, 0, img_width, img_height);
}
- if (canvas.width !== width) { canvas.width = width; }
- if (canvas.height !== height) { canvas.height = height; }
-
- if (this._viewport) {
- canvas.style.height = height + 'px';
+ if (canvas.width !== width) {
+ canvas.width = width;
canvas.style.width = width + 'px';
}
+ if (canvas.height !== height) {
+ canvas.height = height;
+ canvas.style.height = height + 'px';
+ }
if (saveImg) {
this._drawCtx.putImageData(saveImg, 0, 0);
diff --git a/include/ui.js b/include/ui.js
index 3d3c41e3..2e9d731a 100644
--- a/include/ui.js
+++ b/include/ui.js
@@ -38,6 +38,7 @@ var UI;
ctrlOn: false,
altOn: false,
isTouchDevice: false,
+ rememberedClipSetting: null,
// Setup rfb object, load settings from browser storage, then call
// UI.init to setup the UI/menus
@@ -131,6 +132,23 @@ var UI;
UI.setBarPosition();
} );
+ var isSafari = (navigator.userAgent.indexOf('Safari') != -1 &&
+ navigator.userAgent.indexOf('Chrome') == -1);
+
+ // Only show the button if fullscreen is properly supported
+ // * Safari doesn't support alphanumerical input while in fullscreen
+ if (!isSafari &&
+ (document.documentElement.requestFullscreen ||
+ document.documentElement.mozRequestFullScreen ||
+ document.documentElement.webkitRequestFullscreen ||
+ document.body.msRequestFullscreen)) {
+ $D('fullscreenButton').style.display = "inline";
+ 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 +219,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;
@@ -217,10 +236,7 @@ var UI;
$D("noVNC_connect_button").onclick = UI.connect;
- $D("noVNC_resize").onchange = function () {
- var connected = UI.rfb && UI.rfb_state === 'normal';
- UI.enableDisableViewClip(connected);
- };
+ $D("noVNC_resize").onchange = UI.enableDisableViewClip;
},
onresize: function (callback) {
@@ -437,6 +453,47 @@ 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.enableDisableViewClip();
+ 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
@@ -664,7 +721,7 @@ var UI;
$D('noVNC_cursor').disabled = true;
}
- UI.enableDisableViewClip(connected);
+ UI.enableDisableViewClip();
$D('noVNC_resize').disabled = connected;
$D('noVNC_shared').disabled = connected;
$D('noVNC_view_only').disabled = connected;
@@ -821,6 +878,7 @@ var UI;
if (UI.rfb) {
display = UI.rfb.get_display();
} else {
+ UI.forceSetting('clip', clip);
return;
}
@@ -867,15 +925,30 @@ var UI;
},
// Handle special cases where clipping is forced on/off or locked
- enableDisableViewClip: function (connected) {
+ enableDisableViewClip: function () {
var resizeElem = $D('noVNC_resize');
+ var connected = UI.rfb && UI.rfb_state === 'normal';
+
if (resizeElem.value === 'downscale' || resizeElem.value === 'scale') {
- UI.forceSetting('clip', false);
+ // Disable clipping if we are scaling
+ UI.setViewClip(false);
$D('noVNC_clip').disabled = true;
+ } else if (document.msFullscreenElement) {
+ // The browser is IE and we are in fullscreen mode.
+ // - We need to force clipping while in fullscreen since
+ // scrollbars doesn't work.
+ UI.togglePopupStatus("Forcing clipping mode since scrollbars aren't supported by IE in fullscreen");
+ UI.rememberedClipSetting = UI.getSetting('clip');
+ UI.setViewClip(true);
+ $D('noVNC_clip').disabled = true;
+ } else if (document.body.msRequestFullscreen && UI.rememberedClip !== null) {
+ // Restore view clip to what it was before fullscreen on IE
+ UI.setViewClip(UI.rememberedClipSetting);
+ $D('noVNC_clip').disabled = connected || UI.isTouchDevice;
} else {
$D('noVNC_clip').disabled = connected || UI.isTouchDevice;
if (UI.isTouchDevice) {
- UI.forceSetting('clip', true);
+ UI.setViewClip(true);
}
}
},
diff --git a/vnc.html b/vnc.html
index 6acd7929..1a293d09 100644
--- a/vnc.html
+++ b/vnc.html
@@ -99,6 +99,9 @@
+