diff options
author | wez@chromium.org <wez@chromium.org@0039d316-1c4b-4281-b951-d872f2087c98> | 2012-11-01 22:05:46 +0000 |
---|---|---|
committer | wez@chromium.org <wez@chromium.org@0039d316-1c4b-4281-b951-d872f2087c98> | 2012-11-01 22:05:46 +0000 |
commit | 590a56cab70efd6475afffeeb7a86e6c4698bfb2 (patch) | |
tree | f95d97169c5b7dd3fcc95abf61eb0eed707809c2 /remoting | |
parent | 11b93faaecc56a050b4a4f818b56e3111f21e4ae (diff) | |
download | chromium_src-590a56cab70efd6475afffeeb7a86e6c4698bfb2.zip chromium_src-590a56cab70efd6475afffeeb7a86e6c4698bfb2.tar.gz chromium_src-590a56cab70efd6475afffeeb7a86e6c4698bfb2.tar.bz2 |
Avoid letterboxing when connecting to multi-monitor hosts in full-screen.
Scaling a multi-monitor desktop to fit a single-monitor client ("scale-to-fit")
results in the desktop being letter-boxed, leaving much of the client area
unused. In this case the client now prefers to scale to fit the smaller host
dimension, and have the user pan to see other parts of the host desktop
("scale-and-pan").
Scale-and-pan is used only in full-screen mode, when the client dimensions match
those of a client device monitor, and bump-scrolling can be used to pan around.
Scale-and-pan will be used when less than 65% of the client area would be
occupied by the desktop if we were to scale-to-fit. For example:
C: 1280x800 H: 1280x1024 -> scale-to-fit
C: 1280x800 H: (2x1280)x1024 -> scale-and-pan (horizontal)
C: 1280x1024 H: 1600x1200 -> scale-to-fit
C: 1600x1200 H: 1280x(2x1024) -> scale-and-pan (vertical)
BUG=145709
Review URL: https://chromiumcodereview.appspot.com/11369023
git-svn-id: svn://svn.chromium.org/chrome/trunk/src@165515 0039d316-1c4b-4281-b951-d872f2087c98
Diffstat (limited to 'remoting')
-rw-r--r-- | remoting/webapp/client_session.js | 51 |
1 files changed, 38 insertions, 13 deletions
diff --git a/remoting/webapp/client_session.js b/remoting/webapp/client_session.js index 56ccaf7..87151f9 100644 --- a/remoting/webapp/client_session.js +++ b/remoting/webapp/client_session.js @@ -641,33 +641,58 @@ remoting.ClientSession.prototype.updateDimensions = function() { var windowWidth = window.innerWidth; var windowHeight = window.innerHeight; + var desktopWidth = this.plugin.desktopWidth; + var desktopHeight = this.plugin.desktopHeight; var scale = 1.0; if (this.getScaleToFit()) { - var scaleFitWidth = 1.0 * windowWidth / this.plugin.desktopWidth; - var scaleFitHeight = 1.0 * windowHeight / this.plugin.desktopHeight; - scale = Math.min(1.0, scaleFitHeight, scaleFitWidth); + // Scale to fit the entire desktop in the client window. + var scaleFitWidth = Math.min(1.0, 1.0 * windowWidth / desktopWidth); + var scaleFitHeight = Math.min(1.0, 1.0 * windowHeight / desktopHeight); + scale = Math.min(scaleFitHeight, scaleFitWidth); + + // If we're running full-screen then try to handle common side-by-side + // multi-monitor combinations more intelligently. + if (document.webkitIsFullScreen) { + // If the host has two monitors each the same size as the client then + // scale-to-fit will have the desktop occupy only 50% of the client area, + // in which case it would be preferable to down-scale less and let the + // user bump-scroll around ("scale-and-pan"). + // Triggering scale-and-pan if less than 65% of the client area would be + // used adds enough fuzz to cope with e.g. 1280x800 client connecting to + // a (2x1280)x1024 host nicely. + // Note that we don't need to account for scrollbars while fullscreen. + if (scale <= scaleFitHeight * 0.65) { + scale = scaleFitHeight; + } + if (scale <= scaleFitWidth * 0.65) { + scale = scaleFitWidth; + } + } } - var width = this.plugin.desktopWidth * scale; - var height = this.plugin.desktopHeight * scale; + var pluginWidth = desktopWidth * scale; + var pluginHeight = desktopHeight * scale; // Resize the plugin if necessary. - this.plugin.element().width = width; - this.plugin.element().height = height; + // TODO(wez): Handle high-DPI to high-DPI properly (crbug.com/135089). + this.plugin.element().width = pluginWidth; + this.plugin.element().height = pluginHeight; // Position the container. - // TODO(wez): We should take into account scrollbars when positioning. + // Note that clientWidth/Height take into account scrollbars. + var clientWidth = document.documentElement.clientWidth; + var clientHeight = document.documentElement.clientHeight; var parentNode = this.plugin.element().parentNode; - if (width < windowWidth) { - parentNode.style.left = (windowWidth - width) / 2 + 'px'; + if (pluginWidth < clientWidth) { + parentNode.style.left = (clientWidth - pluginWidth) / 2 + 'px'; } else { parentNode.style.left = '0'; } - if (height < windowHeight) { - parentNode.style.top = (windowHeight - height) / 2 + 'px'; + if (pluginHeight < clientHeight) { + parentNode.style.top = (clientHeight - pluginHeight) / 2 + 'px'; } else { parentNode.style.top = '0'; } @@ -675,7 +700,7 @@ remoting.ClientSession.prototype.updateDimensions = function() { console.log('plugin dimensions: ' + parentNode.style.left + ',' + parentNode.style.top + '-' + - width + 'x' + height + '.'); + pluginWidth + 'x' + pluginHeight + '.'); }; /** |