WebUI TaskManager: Use the specified height of row on refleshing.

chrome/browser/resources/shared/js/cr/ui/list.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.
 
 // require: array_data_model.js
 // require: list_selection_model.js
 // require: list_selection_controller.js
 // require: list_item.js
 
 /**
@@ skipping 115 matching lines @@
               this.boundHandleDataModelPermuted_);
           this.dataModel_.removeEventListener('change',
                                               this.boundHandleDataModelChange_);
           this.dataModel_.removeEventListener('splice',
                                               this.boundHandleDataModelChange_);
         }
 
         this.dataModel_ = dataModel;
 
         this.cachedItems_ = {};
-        this.cachedItemSizes_ = {};
+        this.cachedItemHeights_ = {};
         this.selectionModel.clear();
         if (dataModel)
           this.selectionModel.adjustLength(dataModel.length);
 
         if (this.dataModel_) {
           this.dataModel_.addEventListener(
               'permuted',
               this.boundHandleDataModelPermuted_);
           this.dataModel_.addEventListener('change',
                                            this.boundHandleDataModelChange_);
@@ skipping 177 matching lines @@
       this.addEventListener('blur', this.handleElementBlur_, true);
       this.addEventListener('scroll', this.handleScroll.bind(this));
       this.setAttribute('role', 'listbox');
 
       // Make list focusable
       if (!this.hasAttribute('tabindex'))
         this.tabIndex = 0;
     },
 
     /**
+     * @param {ListItem=} item The list item to measure.
+     * @return {number} The height of the given item. If the fixed height on CSS
+     * is set by 'px', uses that value as height. Otherwise, measures the size.
+     * @private
+     */
+    measureItemHeight_: function(item) {
+      var height = item.style.height;
+      // Use the fixed height if set it on CSS, to save a time of layout
+      // calculation.
+      if (height && height.substr(-2) == 'px')
+        return parseInt(height.substr(0, height.length - 2));
+
+      return this.measureItem(item).height;
+    },
+
+    /**
      * @return {number} The height of default item, measuring it if necessary.
      * @private
      */
     getDefaultItemHeight_: function() {
       return this.getDefaultItemSize_().height;
     },
 
     /**
      * @param {number} index The index of the item.
-     * @return {number} The height of the item.
+     * @return {number} The height of the item, measuring it if necessary.
      */
     getItemHeightByIndex_: function(index) {
       // If |this.fixedHeight_| is true, all the rows have same default height.
       if (this.fixedHeight_)
         return this.getDefaultItemHeight_();
 
-      if (this.cachedItemSizes_[index])
-        return this.cachedItemSizes_[index].height;
+      if (this.cachedItemHeights_[index])
+        return this.cachedItemHeights_[index];
 
       var item = this.getListItemByIndex(index);
       if (item)
-        return this.getItemSize_(item).height;
+        return this.measureItemHeight_(item);
 
       return this.getDefaultItemHeight_();
     },
 
     /**
-     * @return {number} The width of default item, measuring it if necessary.
-     * @private
-     */
-    getDefaultItemWidth_: function() {
-      return this.getDefaultItemSize_().width;
-    },
-
-    /**
      * @return {{height: number, width: number}} The height and width
      *     of default item, measuring it if necessary.
      * @private
      */
     getDefaultItemSize_: function() {
       if (!this.measured_ || !this.measured_.height) {
         this.measured_ = this.measureItem();
       }
       return this.measured_;
     },
 
     /**
-     * @return {{height: number, width: number}} The height and width
-     *     of an item, measuring it if necessary.
-     * @private
-     */
-    getItemSize_: function(item) {
-      if (this.cachedItemSizes_[item.listIndex])
-        return this.cachedItemSizes_[item.listIndex];
-
-      var size = this.measureItem(item);
-      if (!isNaN(size.height) && !isNaN(size.weight))
-        this.cachedItemSizes_[item.listIndex] = size;
-
-      return size;
-    },
-
-    /**
      * Creates an item (dataModel.item(0)) and measures its height. The item is
      * cached instead of creating a new one every time..
      * @param {ListItem=} opt_item The list item to use to do the measuring. If
      *     this is not provided an item will be created based on the first value
      *     in the model.
      * @return {{height: number, marginTop: number, marginBottom:number,
      *     width: number, marginLeft: number, marginRight:number}}
      *     The height and width of the item, taking
      *     margins into account, and the top, bottom, left and right margins
      *     themselves.
@@ skipping 221 matching lines @@
       var newCachedItems = {};
       for (var index in this.cachedItems_) {
         if (e.permutation[index] != -1) {
           var newIndex = e.permutation[index];
           newCachedItems[newIndex] = this.cachedItems_[index];
           newCachedItems[newIndex].listIndex = newIndex;
         }
       }
       this.cachedItems_ = newCachedItems;
 
-      var newCachedItemSizes = {};
-      for (var index in this.cachedItemSizes_) {
+      var newCachedItemHeights = {};
+      for (var index in this.cachedItemHeights_) {
         if (e.permutation[index] != -1) {
-          newCachedItemSizes[e.permutation[index]] =
-              this.cachedItemSizes_[index];
+          newCachedItemHeights[e.permutation[index]] =
+              this.cachedItemHeights_[index];
         }
       }
-      this.cachedItemSizes_ = newCachedItemSizes;
+      this.cachedItemHeights_ = newCachedItemHeights;
 
       this.startBatchUpdates();
 
       var sm = this.selectionModel;
       sm.adjustLength(e.newLength);
       sm.adjustToReordering(e.permutation);
 
       this.endBatchUpdates();
     },
 
     handleDataModelChange_: function(e) {
       delete this.cachedItems_[e.index];
-      delete this.cachedItemSizes_[e.index];
+      delete this.cachedItemHeights_[e.index];
       this.cachedMeasuredItem_ = null;
 
       if (e.index >= this.firstIndex_ &&
           (e.index < this.lastIndex_ || this.remainingSpace_)) {
         this.redraw();
       }
     },
 
     /**
      * @param {number} index The index of the item.
@@ skipping 315 matching lines @@
       while (currentIndex < lastIndex)
         insert(this);
     },
 
     /**
      * Ensures that all the item sizes in the list have been already cached.
      */
     ensureAllItemSizesInCache: function() {
       var measuringIndexes = [];
       for (var y = 0; y < this.dataModel.length; y++) {
-        if (!this.cachedItemSizes_[y])
+        if (!this.cachedItemHeights_[y])
           measuringIndexes.push(y);
       }
 
       var measuringItems = [];
       // Adds temporary elements.
       for (var y = 0; y < measuringIndexes.length; y++) {
         var index = measuringIndexes[y];
         var dataItem = this.dataModel.item(index);
         var listItem = this.cachedItems_[index] || this.createItem(dataItem);
         listItem.listIndex = index;
         this.appendChild(listItem);
         this.cachedItems_[index] = listItem;
         measuringItems.push(listItem);
       }
 
       // All mesurings must be placed after adding all the elements, to prevent
       // performance reducing.
       for (var y = 0; y < measuringIndexes.length; y++) {
         var index = measuringIndexes[y];
-        this.cachedItemSizes_[index] = this.measureItem(measuringItems[y]);
+        this.cachedItemHeights_[index] =
+            this.measureItemHeight_(measuringItems[y]);
       }
 
       // Removes all the temprary elements.
       for (var y = 0; y < measuringIndexes.length; y++) {
         this.removeChild(measuringItems[y]);
       }
     },
 
     /**
      * Returns the height of after filler in the list.
@@ skipping 37 matching lines @@
 
       // We cache the list items since creating the DOM nodes is the most
       // expensive part of redrawing.
       var cachedItems = this.cachedItems_ || {};
       var newCachedItems = {};
 
       var autoExpands = this.autoExpands_;
       var scrollTop = this.scrollTop;
       var clientHeight = this.clientHeight;
 
-      var lastItemHeights = this.getHeightsForIndex_(dataModel.length - 1);
-      var desiredScrollHeight = lastItemHeights.top + lastItemHeights.height;
-
       var itemsInViewPort = this.getItemsInViewPort(scrollTop, clientHeight);
       // Draws the hidden rows just above/below the viewport to prevent
       // flashing in scroll.
       var firstIndex = Math.max(0, itemsInViewPort.first - 1);
       var lastIndex = Math.min(itemsInViewPort.last + 1, dataModel.length);
 
       var beforeFillerHeight =
           this.autoExpands ? 0 : this.getItemTop(firstIndex);
       var afterFillerHeight =
           this.autoExpands ? 0 : this.getAfterFillerHeight(lastIndex);
@@ skipping 35 matching lines @@
       this.firstIndex_ = firstIndex;
       this.lastIndex_ = lastIndex;
 
       this.remainingSpace_ = itemsInViewPort.last > dataModel.length;
       this.cachedItems_ = newCachedItems;
 
       // Mesurings must be placed after adding all the elements, to prevent
       // performance reducing.
       if (!this.fixedHeight_) {
         for (var y = firstIndex; y < lastIndex; y++)
-          this.cachedItemSizes_[y] = this.measureItem(newCachedItems[y]);
+          this.cachedItemHeights_[y] =
+              this.measureItemHeight_(newCachedItems[y]);
       }
 
       // Measure again in case the item height has changed due to a page zoom.
       //
       // The measure above is only done the first time but this measure is done
       // after every redraw. It is done in a timeout so it will not trigger
       // a reflow (which made the redraw speed 3 times slower on my system).
       // By using a timeout the measuring will happen later when there is no
       // need for a reflow.
       if (listItem && this.fixedHeight_) {
@@ skipping 42 matching lines @@
    * because list items can contain controls that can be focused, and for some
    * purposes (e.g., styling), the list can still be conceptually focused at
    * that point even though it doesn't actually have the page focus.
    */
   cr.defineProperty(List, 'hasElementFocus', cr.PropertyKind.BOOL_ATTR);
 
   return {
     List: List
   }
 });