Decrease the lag when switching between different categories in the Cros wallpaper selector.

chrome/browser/resources/chromeos/wallpaper_manager/js/wallpaper_manager.js

 // Copyright (c) 2013 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.
 
 /**
  * WallpaperManager constructor.
  *
  * WallpaperManager objects encapsulate the functionality of the wallpaper
  * manager extension.
  *
  * @constructor
  * @param {HTMLElement} dialogDom The DOM node containing the prototypical
  *     extension UI.
  */
 
 function WallpaperManager(dialogDom) {
   this.dialogDom_ = dialogDom;
   this.document_ = dialogDom.ownerDocument;
   this.enableOnlineWallpaper_ = loadTimeData.valueExists('manifestBaseURL');
-  this.selectedCategory = null;
   this.selectedItem_ = null;
   this.progressManager_ = new ProgressManager();
   this.customWallpaperData_ = null;
   this.currentWallpaper_ = null;
   this.wallpaperRequest_ = null;
   this.wallpaperDirs_ = WallpaperDirectories.getInstance();
   this.preManifestDomInit_();
   this.fetchManifest_();
 }
 
@@ skipping 417 matching lines @@
       });
     }
   };
 
   /**
    * Constructs the thumbnails grid.
    */
   WallpaperManager.prototype.initThumbnailsGrid_ = function() {
     this.wallpaperGrid_ = $('wallpaper-grid');
     wallpapers.WallpaperThumbnailsGrid.decorate(this.wallpaperGrid_);
-    this.wallpaperGrid_.autoExpands = true;
 
     this.wallpaperGrid_.addEventListener('change', this.onChange_.bind(this));
     this.wallpaperGrid_.addEventListener('dblclick', this.onClose_.bind(this));
   };
 
   /**
    * Handles change event dispatched by wallpaper grid.
    */
   WallpaperManager.prototype.onChange_ = function() {
     // splice may dispatch a change event because the position of selected
@@ skipping 527 matching lines @@
     var wallpapersDataModel = new cr.ui.ArrayDataModel([]);
     var selectedItem = null;
     if (selectedListItem.custom) {
       this.document_.body.setAttribute('custom', '');
       var errorHandler = this.onFileSystemError_.bind(this);
       var toArray = function(list) {
         return Array.prototype.slice.call(list || [], 0);
       };
 
       var self = this;
+      var numOnlineWallpaper = this.manifest_ ?
+          this.manifest_.wallpaper_list.length : 0;
       var processResults = function(entries) {
         for (var i = 0; i < entries.length; i++) {
           var entry = entries[i];
           var wallpaperInfo = {
+                wallpaperId: numOnlineWallpaper + i,
                 baseURL: entry.name,
                 // The layout will be replaced by the actual value saved in
                 // local storage when requested later. Layout is not important
                 // for constructing thumbnails grid, we use CENTER_CROPPED here
                 // to speed up the process of constructing. So we do not need to
                 // wait for fetching correct layout.
                 layout: 'CENTER_CROPPED',
                 source: Constants.WallpaperSourceEnum.Custom,
                 availableOffline: true
           };
           wallpapersDataModel.push(wallpaperInfo);
         }
         if (loadTimeData.getBoolean('isOEMDefaultWallpaper')) {
           var oemDefaultWallpaperElement = {
+              wallpaperId: numOnlineWallpaper + entries.length,
               baseURL: 'OemDefaultWallpaper',
               layout: 'CENTER_CROPPED',
               source: Constants.WallpaperSourceEnum.OEM,
               availableOffline: true
           };
           wallpapersDataModel.push(oemDefaultWallpaperElement);
         }
         for (var i = 0; i < wallpapersDataModel.length; i++) {
           if (self.currentWallpaper_ == wallpapersDataModel.item(i).baseURL)
             selectedItem = wallpapersDataModel.item(i);
@@ skipping 26 matching lines @@
               readEntries();
             }
           }, errorHandler);
         };
         readEntries(); // Start reading dirs.
       };
       this.wallpaperDirs_.getDirectory(Constants.WallpaperDirNameEnum.ORIGINAL,
                                        success, errorHandler);
     } else {
       this.document_.body.removeAttribute('custom');
-      for (var key in this.manifest_.wallpaper_list) {
+      var numOnlineWallpaper = this.manifest_ ?
+          this.manifest_.wallpaper_list.length : 0;
+      for (var i = 0; i < numOnlineWallpaper; i++) {
         if (selectedIndex == AllCategoryIndex ||
-            this.manifest_.wallpaper_list[key].categories.indexOf(
+            this.manifest_.wallpaper_list[i].categories.indexOf(
                 selectedIndex - OnlineCategoriesOffset) != -1) {
           var wallpaperInfo = {
-            baseURL: this.manifest_.wallpaper_list[key].base_url,
-            layout: this.manifest_.wallpaper_list[key].default_layout,
+            wallpaperId: i,
+            baseURL: this.manifest_.wallpaper_list[i].base_url,
+            layout: this.manifest_.wallpaper_list[i].default_layout,
             source: Constants.WallpaperSourceEnum.Online,
             availableOffline: false,
-            author: this.manifest_.wallpaper_list[key].author,
-            authorWebsite: this.manifest_.wallpaper_list[key].author_website,
-            dynamicURL: this.manifest_.wallpaper_list[key].dynamic_url
+            author: this.manifest_.wallpaper_list[i].author,
+            authorWebsite: this.manifest_.wallpaper_list[i].author_website,
+            dynamicURL: this.manifest_.wallpaper_list[i].dynamic_url
           };
           var startIndex = wallpaperInfo.baseURL.lastIndexOf('/') + 1;
           var fileName = wallpaperInfo.baseURL.substring(startIndex) +
               Constants.HighResolutionSuffix;
           if (this.downloadedListMap_ &&
               this.downloadedListMap_.hasOwnProperty(encodeURI(fileName))) {
             wallpaperInfo.availableOffline = true;
           }
           wallpapersDataModel.push(wallpaperInfo);
-          var url = this.manifest_.wallpaper_list[key].base_url +
+          var url = this.manifest_.wallpaper_list[i].base_url +
               Constants.HighResolutionSuffix;
           if (url == this.currentWallpaper_) {
             selectedItem = wallpaperInfo;
           }
         }
       }
       this.wallpaperGrid_.dataModel = wallpapersDataModel;
       if (selectedItem) {
         this.wallpaperGrid_.selectedItem = selectedItem;
         this.wallpaperGrid_.activeItem = selectedItem;
       }
     }
   };
 
 })();