MD Settings: Never underscroll

chrome/browser/resources/settings/settings_main/settings_main.js

 // Copyright 2015 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
  * 'settings-main' displays the selected settings page.
  */
 Polymer({
   is: 'settings-main',
@@ skipping 64 matching lines @@
       this.advancedToggleExpanded_ = e.detail;
       settings.navigateTo(this.advancedToggleExpanded_ ?
           settings.Route.ADVANCED : settings.Route.BASIC);
     }.bind(this));
 
   },
 
   /** @private */
   overscrollChanged_: function() {
     if (!this.overscroll_ && this.boundScroll_) {
-      this.parentNode.scroller.removeEventListener('scroll', this.boundScroll_);
+      this.offsetParent.removeEventListener('scroll', this.boundScroll_);
       this.boundScroll_ = null;
     } else if (this.overscroll_ && !this.boundScroll_) {
-      this.boundScroll_ = this.scrollEventListener_.bind(this);
-      this.parentNode.scroller.addEventListener('scroll', this.boundScroll_);
+      this.boundScroll_ = this.setOverscroll_.bind(this, 0);
+      this.offsetParent.addEventListener('scroll', this.boundScroll_);
     }
   },
 
-  /** @private */
-  scrollEventListener_: function() {
-    var scroller = this.parentNode.scroller;
+  /**
+   * Sets the overscroll padding. Never forces a scroll, i.e., always leaves
+   * any currently visible overflow as-is.
+   * @param {number=} opt_minHeight The minimum overscroll height needed.
+   */
+  setOverscroll_: function(opt_minHeight) {
+    var scroller = this.offsetParent;
+    if (!scroller)
+      return;
     var overscroll = this.$.overscroll;
     var visibleBottom = scroller.scrollTop + scroller.clientHeight;
     var overscrollBottom = overscroll.offsetTop + overscroll.scrollHeight;
     // How much of the overscroll is visible (may be negative).
     var visibleOverscroll = overscroll.scrollHeight -
                             (overscrollBottom - visibleBottom);
-    this.overscroll_ = Math.max(0, visibleOverscroll);
+    this.overscroll_ = Math.max(opt_minHeight || 0, visibleOverscroll);
   },
 
   /**
    * @param {boolean} opened Whether the menu is expanded.
    * @return {string} Which icon to use.
    * @private
    */
   arrowState_: function(opened) {
     return opened ? 'settings:arrow-drop-up' : 'cr:arrow-drop-down';
   },
@@ skipping 28 matching lines @@
             this.pageVisibility.advancedSettings !== false);
         this.advancedToggleExpanded_ = true;
       }
     }
 
     // Wait for any other changes prior to calculating the overflow padding.
     setTimeout(function() {
       // Ensure any dom-if reflects the current properties.
       Polymer.dom.flush();
 
-      this.overscroll_ = this.overscrollHeight_();
+      this.setOverscroll_(this.overscrollHeight_());
     }.bind(this));
   },
 
   /**
    * Return the height that the overscroll padding should be set to.
    * This is used to determine how much padding to apply to the end of the
    * content so that the last element may align with the top of the content
    * area.
    * @return {number}
    * @private
    */
   overscrollHeight_: function() {
     var route = settings.getCurrentRoute();
-    if (route.subpage.length != 0 || this.showPages_.about)
+    if (!route.section || route.subpage.length || this.showPages_.about)
       return 0;
 
     var page = this.getPage_(route);
-    var topSection = page && page.getSection(route.section);
-    if (!topSection || !topSection.offsetParent)
+    var section = page && page.getSection(route.section);
+    if (!section || !section.offsetParent)
       return 0;
 
-    // Offset to the selected section (relative to the scrolling window).
-    let sectionTop = topSection.offsetParent.offsetTop + topSection.offsetTop;
-    // The height of the selected section and remaining content (sections).
-    let heightOfShownSections = this.$.overscroll.offsetTop - sectionTop;
-    return Math.max(0, this.parentNode.scrollHeight - heightOfShownSections);
+    // Find the distance from the section's top to the overscroll.
+    var sectionTop = section.offsetParent.offsetTop + section.offsetTop;
+    var distanceToBottom = this.$.overscroll.offsetTop - sectionTop;

[dschuyler, 2016/08/10 17:00:16]

Let's make this just 'distance' rather than distanceToBottom.

[michaelpg, 2016/08/15 16:41:48]

Done.

+
+    return Math.max(0, this.offsetParent.clientHeight - distanceToBottom);
   },
 
   /** @private */
   toggleAdvancedPage_: function() {
     this.fire('toggle-advanced-page', !this.advancedToggleExpanded_);
   },
 
   /**
    * Returns the root page (if it exists) for a route.
    * @param {!settings.Route} route
@@ skipping 63 matching lines @@
 
   /**
    * @param {(boolean|undefined)} visibility
    * @return {boolean} True unless visibility is false.
    * @private
    */
   showAdvancedSettings_: function(visibility) {
     return visibility !== false;
   },
 });