Update Polymer from 1.2.1 -> 1.2.3

third_party/polymer/v1_0/components-chromium/iron-list/iron-list-extracted.js

 (function() {
 
   var IOS = navigator.userAgent.match(/iP(?:hone|ad;(?: U;)? CPU) OS (\d+)/);
   var IOS_TOUCH_SCROLLING = IOS && IOS[1] >= 8;
-  var DEFAULT_PHYSICAL_COUNT = 20;
+  var DEFAULT_PHYSICAL_COUNT = 3;
   var MAX_PHYSICAL_COUNT = 500;
 
   Polymer({
 
     is: 'iron-list',
 
     properties: {
 
       /**
        * An array containing items determining how many instances of the template
@@ skipping 162 matching lines @@
      * The estimated scroll height based on `_physicalAverage`
      */
     _estScrollHeight: 0,
 
     /**
      * The scroll height of the dom node
      */
     _scrollHeight: 0,
 
     /**
-     * The size of the viewport
+     * The height of the list. This is referred as the viewport in the context of list.
      */
     _viewportSize: 0,
 
     /**
      * An array of DOM nodes that are currently in the tree
      * @type {?Array<!TemplatizerNode>}
      */
     _physicalItems: null,
 
     /**
@@ skipping 15 matching lines @@
      */
     _collection: null,
 
     /**
      * True if the current item list was rendered for the first time
      * after attached.
      */
     _itemsRendered: false,
 
     /**
+     * The page that is currently rendered.
+     */
+    _lastPage: null,
+
+    /**
+     * The max number of pages to render. One page is equivalent to the height of the list.
+     */
+    _maxPages: 3,
+
+    /**
      * The bottom of the physical content.
      */
     get _physicalBottom() {
       return this._physicalTop + this._physicalSize;
     },
 
     /**
      * The bottom of the scroll.
      */
     get _scrollBottom() {
@@ skipping 51 matching lines @@
     },
 
     /**
      * An optimal physical size such that we will have enough physical items
      * to fill up the viewport and recycle when the user scrolls.
      *
      * This default value assumes that we will at least have the equivalent
      * to a viewport of physical items above and below the user's viewport.
      */
     get _optPhysicalSize() {
-      return this._viewportSize * 3;
+      return this._viewportSize * this._maxPages;
     },
 
    /**
     * True if the current list is visible.
     */
     get _isVisible() {
       return this._scroller && Boolean(this._scroller.offsetWidth || this._scroller.offsetHeight);
     },
 
     /**
@@ skipping 80 matching lines @@
 
     /**
      * Update the models, the position of the
      * items in the viewport and recycle tiles as needed.
      */
     _refresh: function() {
       // clamp the `scrollTop` value
       // IE 10|11 scrollTop may go above `_maxScrollTop`
       // iOS `scrollTop` may go below 0 and above `_maxScrollTop`
       var scrollTop = Math.max(0, Math.min(this._maxScrollTop, this._scroller.scrollTop));
-      var tileHeight, tileTop, kth, recycledTileSet, scrollBottom;
+      var tileHeight, tileTop, kth, recycledTileSet, scrollBottom, physicalBottom;
       var ratio = this._ratio;
       var delta = scrollTop - this._scrollPosition;
       var recycledTiles = 0;
       var hiddenContentSize = this._hiddenContentSize;
       var currentRatio = ratio;
       var movingUp = [];
 
       // track the last `scrollTop`
       this._scrollPosition = scrollTop;
 
       // clear cached visible index
       this._firstVisibleIndexVal = null;
 
       scrollBottom = this._scrollBottom;
+      physicalBottom = this._physicalBottom;
 
       // random access
       if (Math.abs(delta) > this._physicalSize) {
         this._physicalTop += delta;
         recycledTiles =  Math.round(delta / this._physicalAverage);
       }
       // scroll up
       else if (delta < 0) {
         var topSpace = scrollTop - this._physicalTop;
         var virtualStart = this._virtualStart;
-        var physicalBottom = this._physicalBottom;
 
         recycledTileSet = [];
 
         kth = this._physicalEnd;
         currentRatio = topSpace / hiddenContentSize;
 
         // move tiles from bottom to top
         while (
             // approximate `currentRatio` to `ratio`
             currentRatio < ratio &&
@@ skipping 11 matching lines @@
           recycledTileSet.push(kth);
           recycledTiles++;
           kth = (kth === 0) ? this._physicalCount - 1 : kth - 1;
         }
 
         movingUp = recycledTileSet;
         recycledTiles = -recycledTiles;
       }
       // scroll down
       else if (delta > 0) {
-        var bottomSpace = this._physicalBottom - scrollBottom;
+        var bottomSpace = physicalBottom - scrollBottom;
         var virtualEnd = this._virtualEnd;
         var lastVirtualItemIndex = this._virtualCount-1;
 
         recycledTileSet = [];
 
         kth = this._physicalStart;
         currentRatio = bottomSpace / hiddenContentSize;
 
         // move tiles from top to bottom
         while (
@@ skipping 14 matching lines @@
           recycledTileSet.push(kth);
           recycledTiles++;
           kth = (kth + 1) % this._physicalCount;
         }
       }
 
       if (recycledTiles === 0) {
         // If the list ever reach this case, the physical average is not significant enough
         // to create all the items needed to cover the entire viewport.
         // e.g. A few items have a height that differs from the average by serveral order of magnitude.
-        if (this._increasePoolIfNeeded()) {
-          // yield and set models to the new items
-          this.async(this._update);
+        if (physicalBottom < scrollBottom || this._physicalTop > scrollTop) {
+          this.async(this._increasePool.bind(this, 1));
         }
       } else {
         this._virtualStart = this._virtualStart + recycledTiles;
         this._update(recycledTileSet, movingUp);
       }
     },
 
     /**
      * Update the list of items, starting from the `_virtualStartVal` item.
      * @param {!Array<number>=} itemSet
@@ skipping 11 matching lines @@
         while (movingUp.length) {
           this._physicalTop -= this._physicalSizes[movingUp.pop()];
         }
       }
       // update the position of the items
       this._positionItems();
 
       // set the scroller size
       this._updateScrollerSize();
 
-      // increase the pool of physical items if needed
-      if (this._increasePoolIfNeeded()) {
-        // yield set models to the new items
-        this.async(this._update);
-      }
+      // increase the pool of physical items
+      this._increasePoolIfNeeded();
     },
 
     /**
      * Creates a pool of DOM elements and attaches them to the local dom.
      */
     _createPool: function(size) {
       var physicalItems = new Array(size);
 
       this._ensureTemplatized();
 
       for (var i = 0; i < size; i++) {
         var inst = this.stamp(null);
-
         // First element child is item; Safari doesn't support children[0]
         // on a doc fragment
         physicalItems[i] = inst.root.querySelector('*');
         Polymer.dom(this).appendChild(inst.root);
       }
 
       return physicalItems;
     },
 
     /**
      * Increases the pool of physical items only if needed.
      * This function will allocate additional physical items
-     * (limited by `MAX_PHYSICAL_COUNT`) if the content size is shorter than
-     * `_optPhysicalSize`
-     *
-     * @return boolean
+     * if the physical size is shorter than `_optPhysicalSize`
      */
     _increasePoolIfNeeded: function() {
-      if (this._physicalAverage === 0) {
-        return false;
-      }
-      if (this._physicalBottom < this._scrollBottom || this._physicalTop > this._scrollPosition) {
-        return this._increasePool(1);
-      }
-      if (this._physicalSize < this._optPhysicalSize) {
-        return this._increasePool(Math.round((this._optPhysicalSize - this._physicalSize) * 1.2 / this._physicalAverage));
+      if (this._viewportSize !== 0 && this._physicalSize < this._optPhysicalSize) {
+        // 0 <= `currentPage` <= `_maxPages`
+        var currentPage = Math.floor(this._physicalSize / this._viewportSize);
+
+        if (currentPage === 0) {
+          // fill the first page
+          this.async(this._increasePool.bind(this, Math.round(this._physicalCount * 0.5)));
+        } else if (this._lastPage !== currentPage) {
+          // once a page is filled up, paint it and defer the next increase
+          requestAnimationFrame(this._increasePool.bind(this, 1));
+        } else {
+          // fill the rest of the pages
+          this.async(this._increasePool.bind(this, 1));
+        }
+        this._lastPage = currentPage;
+        return true;
       }
       return false;
     },
 
     /**
      * Increases the pool size.
      */
     _increasePool: function(missingItems) {
       // limit the size
       var nextPhysicalCount = Math.min(
           this._physicalCount + missingItems,
           this._virtualCount,
           MAX_PHYSICAL_COUNT
         );
-
       var prevPhysicalCount = this._physicalCount;
       var delta = nextPhysicalCount - prevPhysicalCount;
 
-      if (delta <= 0) {
-        return false;
+      if (delta > 0) {
+        [].push.apply(this._physicalItems, this._createPool(delta));
+        [].push.apply(this._physicalSizes, new Array(delta));
+
+        this._physicalCount = prevPhysicalCount + delta;
+        // tail call
+        return this._update();
       }
-
-      [].push.apply(this._physicalItems, this._createPool(delta));
-      [].push.apply(this._physicalSizes, new Array(delta));
-
-      this._physicalCount = prevPhysicalCount + delta;
-
-      return true;
     },
 
     /**
      * Render a new list of items. This method does exactly the same as `update`,
      * but it also ensures that only one `update` cycle is created.
      */
     _render: function() {
       var requiresUpdate = this._virtualCount > 0 || this._physicalCount > 0;
 
-      if (this.isAttached && !this._itemsRendered && this._isVisible && requiresUpdate)  {
+      if (this.isAttached && !this._itemsRendered && this._isVisible && requiresUpdate) {
+        this._lastPage = 0;
         this._update();
         this._itemsRendered = true;
       }
     },
 
     /**
      * Templetizes the user template.
      */
     _ensureTemplatized: function() {
       if (!this.ctor) {
@@ skipping 343 matching lines @@
 
       // estimate new physical offset
       this._physicalTop = this._virtualStart * this._physicalAverage;
 
       var currentTopItem = this._physicalStart;
       var currentVirtualItem = this._virtualStart;
       var targetOffsetTop = 0;
       var hiddenContentSize = this._hiddenContentSize;
 
       // scroll to the item as much as we can
-      while (currentVirtualItem !== idx && targetOffsetTop < hiddenContentSize) {
+      while (currentVirtualItem < idx && targetOffsetTop < hiddenContentSize) {
         targetOffsetTop = targetOffsetTop + this._physicalSizes[currentTopItem];
         currentTopItem = (currentTopItem + 1) % this._physicalCount;
         currentVirtualItem++;
       }
 
       // update the scroller size
       this._updateScrollerSize(true);
 
       // update the position of the items
       this._positionItems();
 
       // set the new scroll position
       this._resetScrollPosition(this._physicalTop + targetOffsetTop + 1);
 
       // increase the pool of physical items if needed
-      if (this._increasePoolIfNeeded()) {
-        // yield set models to the new items
-        this.async(this._update);
-      }
+      this._increasePoolIfNeeded();
+
       // clear cached visible index
       this._firstVisibleIndexVal = null;
     },
 
     /**
      * Reset the physical average and the average count.
      */
     _resetAverage: function() {
       this._physicalAverage = 0;
       this._physicalAverageCount = 0;
@@ skipping 158 matching lines @@
       var pidx = this._physicalIndexForKey[key];
 
       if (pidx !== undefined) {
         this._updateMetrics([pidx]);
         this._positionItems();
       }
     }
   });
 
 })();