Fix scroll-bar behaviour.

remoting/webapp/client_session.js

 // Copyright (c) 2012 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 /**
  * @fileoverview
  * Class handling creation and teardown of a remoting client session.
  *
  * The ClientSession class controls lifetime of the client plugin
  * object and provides the plugin with the functionality it needs to
@@ skipping 136 matching lines @@
 /**
  * @param {?function(remoting.ClientSession.State,
                      remoting.ClientSession.State):void} onStateChange
  *     The callback to invoke when the session changes state.
  */
 remoting.ClientSession.prototype.setOnStateChange = function(onStateChange) {
   this.onStateChange_ = onStateChange;
 };
 
 /**
- * Called when the connection has been established to set the initial scroll-
- * bar visibility correctly.
+ * Called when the window or desktop size or the scaling settings change,
+ * to set the scroll-bar visibility.
  *
  * TODO(jamiewalch): crbug.com/252796: Remove this once crbug.com/240772 is
  * fixed.
  */
-remoting.ClientSession.prototype.setScrollbarVisibility = function() {
+remoting.ClientSession.prototype.updateScrollbarVisibility = function() {
+  var needsVerticalScroll = false;
+  var needsHorizontalScroll = false;
+  if (!this.shrinkToFit_) {
+    console.log('Checking for scrollbars: window height = ' +
+        window.innerHeight + "; plugin height = " + this.plugin.desktopHeight);

[Wez, 2013/08/03 02:48:49]

Won't this result in a lot of logging, and potentially a performance hit,
whenever the user resizes the window?

[Jamie, 2013/08/05 18:33:05]

Left-over debugging; removed.

+    // Determine whether or not horizontal or vertical scrollbars are
+    // required, taking into account their width.
+    needsVerticalScroll = window.innerHeight < this.plugin.desktopHeight;
+    needsHorizontalScroll = window.innerWidth < this.plugin.desktopWidth;
+    var kScrollBarWidth = 16;
+    if (needsHorizontalScroll && !needsVerticalScroll) {
+      needsVerticalScroll =
+          window.innerHeight - kScrollBarWidth < this.plugin.desktopHeight;
+    } else if (!needsHorizontalScroll && needsVerticalScroll) {
+      needsHorizontalScroll =
+          window.innerWidth - kScrollBarWidth < this.plugin.desktopWidth;
+    }
+  }
+
   var htmlNode = /** @type {HTMLElement} */ (document.body.parentNode);
-  if (this.shrinkToFit_) {
-    htmlNode.classList.add('no-scroll');
+  if (needsHorizontalScroll) {
+    htmlNode.classList.remove('no-horizontal-scroll');
   } else {
-    htmlNode.classList.remove('no-scroll');
+    htmlNode.classList.add('no-horizontal-scroll');
+  }
+  if (needsVerticalScroll) {
+    htmlNode.classList.remove('no-vertical-scroll');
+  } else {
+    htmlNode.classList.add('no-vertical-scroll');
   }
 };
 
 // Note that the positive values in both of these enums are copied directly
 // from chromoting_scriptable_object.h and must be kept in sync. The negative
 // values represent state transitions that occur within the web-app that have
 // no corresponding plugin state transition.
 /** @enum {number} */
 remoting.ClientSession.State = {
   CONNECTION_CANCELED: -5,  // Connection closed (gracefully) before connecting.
@@ skipping 475 matching lines @@
     this.plugin.notifyClientResolution(window.innerWidth,
                                        window.innerHeight,
                                        window.devicePixelRatio);
   }
 
   // If enabling shrink, reset bump-scroll offsets.
   var needsScrollReset = shrinkToFit && !this.shrinkToFit_;
 
   this.shrinkToFit_ = shrinkToFit;
   this.resizeToClient_ = resizeToClient;
-  this.setScrollbarVisibility();
+  this.updateScrollbarVisibility();
 
   if (this.hostId != '') {
     var options = {};
     options[remoting.ClientSession.KEY_SHRINK_TO_FIT] = this.shrinkToFit_;
     options[remoting.ClientSession.KEY_RESIZE_TO_CLIENT] = this.resizeToClient_;
     remoting.HostSettings.save(this.hostId, options);
   }
 
   this.updateDimensions();
   if (needsScrollReset) {
@@ skipping 248 matching lines @@
         this.plugin.notifyClientResolution.bind(this.plugin,
                                                 window.innerWidth,
                                                 window.innerHeight,
                                                 window.devicePixelRatio),
         kResizeRateLimitMs);
   }
 
   // If bump-scrolling is enabled, adjust the plugin margins to fully utilize
   // the new window area.
   this.scroll_(0, 0);
+
+  this.updateScrollbarVisibility();
 };
 
 /**
  * Requests that the host pause or resume video updates.
  *
  * @param {boolean} pause True to pause video, false to resume.
  * @return {void} Nothing.
  */
 remoting.ClientSession.prototype.pauseVideo = function(pause) {
   if (this.plugin) {
@@ skipping 20 matching lines @@
  * @private
  * @return {void} Nothing.
  */
 remoting.ClientSession.prototype.onDesktopSizeChanged_ = function() {
   console.log('desktop size changed: ' +
               this.plugin.desktopWidth + 'x' +
               this.plugin.desktopHeight +' @ ' +
               this.plugin.desktopXDpi + 'x' +
               this.plugin.desktopYDpi + ' DPI');
   this.updateDimensions();
+  this.updateScrollbarVisibility();
 };
 
 /**
  * Refreshes the plugin's dimensions, taking into account the sizes of the
  * remote desktop and client window, and the current scale-to-fit setting.
  *
  * @return {void} Nothing.
  */
 remoting.ClientSession.prototype.updateDimensions = function() {
   if (this.plugin.desktopWidth == 0 ||
@@ skipping 273 matching lines @@
       var lateAdjustment = 1 + (now - expected) / timeout;
       if (!that.scroll_(lateAdjustment * dx, lateAdjustment * dy)) {
         that.bumpScrollTimer_ = window.setTimeout(
             function() { repeatScroll(now + timeout); },
             timeout);
       }
     };
     repeatScroll(new Date().getTime());
   }
 };