| OLD | NEW |
| 1 // Copyright 2016 The Chromium Authors. All rights reserved. | 1 // Copyright 2016 The Chromium Authors. All rights reserved. |
| 2 // Use of this source code is governed by a BSD-style license that can be | 2 // Use of this source code is governed by a BSD-style license that can be |
| 3 // found in the LICENSE file. | 3 // found in the LICENSE file. |
| 4 | 4 |
| 5 /** | 5 /** |
| 6 * @fileoverview Behavior for scrollable containers with <iron-list>. | 6 * @fileoverview Behavior for scrollable containers with <iron-list>. |
| 7 * | 7 * |
| 8 * Any containers with the 'scrollable' attribute set will have the following | 8 * Any containers with the 'scrollable' attribute set will have the following |
| 9 * classes toggled appropriately: can-scroll, is-scrolled, scrolled-to-bottom. | 9 * classes toggled appropriately: can-scroll, is-scrolled, scrolled-to-bottom. |
| 10 * These classes are used to style the container div and list elements | 10 * These classes are used to style the container div and list elements |
| (...skipping 83 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 94 | 94 |
| 95 /** | 95 /** |
| 96 * Setup the intial scrolling related classes for each scrollable container. | 96 * Setup the intial scrolling related classes for each scrollable container. |
| 97 * Called from ready() and updateScrollableContents(). May also be called | 97 * Called from ready() and updateScrollableContents(). May also be called |
| 98 * directly when the contents change (e.g. when not using iron-list). | 98 * directly when the contents change (e.g. when not using iron-list). |
| 99 */ | 99 */ |
| 100 requestUpdateScroll: function() { | 100 requestUpdateScroll: function() { |
| 101 requestAnimationFrame(function() { | 101 requestAnimationFrame(function() { |
| 102 var scrollableElements = this.root.querySelectorAll('[scrollable]'); | 102 var scrollableElements = this.root.querySelectorAll('[scrollable]'); |
| 103 for (var i = 0; i < scrollableElements.length; i++) | 103 for (var i = 0; i < scrollableElements.length; i++) |
| 104 this.updateScroll_(/** @type {!HTMLElement} */(scrollableElements[i])); | 104 this.updateScroll_(/** @type {!HTMLElement} */ (scrollableElements[i])); |
| 105 }.bind(this)); | 105 }.bind(this)); |
| 106 }, | 106 }, |
| 107 | 107 |
| 108 /** @param {!IronListElement} list */ | 108 /** @param {!IronListElement} list */ |
| 109 saveScroll: function(list) { | 109 saveScroll: function(list) { |
| 110 // Store a FIFO of saved scroll positions so that multiple updates in a | 110 // Store a FIFO of saved scroll positions so that multiple updates in a |
| 111 // frame are applied correctly. Specifically we need to track when '0' is | 111 // frame are applied correctly. Specifically we need to track when '0' is |
| 112 // saved (but not apply it), and still handle patterns like [30, 0, 32]. | 112 // saved (but not apply it), and still handle patterns like [30, 0, 32]. |
| 113 list.savedScrollTops = list.savedScrollTops || []; | 113 list.savedScrollTops = list.savedScrollTops || []; |
| 114 list.savedScrollTops.push(list.scrollTarget.scrollTop); | 114 list.savedScrollTops.push(list.scrollTarget.scrollTop); |
| (...skipping 23 matching lines...) Expand all Loading... |
| 138 /** | 138 /** |
| 139 * This gets called once intially and any time a scrollable container scrolls. | 139 * This gets called once intially and any time a scrollable container scrolls. |
| 140 * @param {!HTMLElement} scrollable | 140 * @param {!HTMLElement} scrollable |
| 141 * @private | 141 * @private |
| 142 */ | 142 */ |
| 143 updateScroll_: function(scrollable) { | 143 updateScroll_: function(scrollable) { |
| 144 scrollable.classList.toggle( | 144 scrollable.classList.toggle( |
| 145 'can-scroll', scrollable.clientHeight < scrollable.scrollHeight); | 145 'can-scroll', scrollable.clientHeight < scrollable.scrollHeight); |
| 146 scrollable.classList.toggle('is-scrolled', scrollable.scrollTop > 0); | 146 scrollable.classList.toggle('is-scrolled', scrollable.scrollTop > 0); |
| 147 scrollable.classList.toggle( | 147 scrollable.classList.toggle( |
| 148 'scrolled-to-bottom', scrollable.scrollTop + scrollable.clientHeight >= | 148 'scrolled-to-bottom', |
| 149 scrollable.scrollTop + scrollable.clientHeight >= |
| 149 scrollable.scrollHeight); | 150 scrollable.scrollHeight); |
| 150 }, | 151 }, |
| 151 }; | 152 }; |
| OLD | NEW |