Gallery: Add items to GalleryDataModel before loading their metadata.

ui/file_manager/gallery/js/ribbon.js

Index: ui/file_manager/gallery/js/ribbon.js
diff --git a/ui/file_manager/gallery/js/ribbon.js b/ui/file_manager/gallery/js/ribbon.js
index e84dc0de7e970ea1f8fbf84fab11db08d49d8eac..706f11897a8dd35a707c0a822e1977696473cd33 100644
--- a/ui/file_manager/gallery/js/ribbon.js
+++ b/ui/file_manager/gallery/js/ribbon.js
@@ -176,7 +176,9 @@ Ribbon.prototype.onSplice_ = function(event) {
       lastNode.nextSibling.removeAttribute('vanishing');
     } else {
       // Push a new item at the right end.
-      this.appendChild(this.renderThumbnail_(this.lastVisibleIndex_));
+      var element = this.renderThumbnail_(this.lastVisibleIndex_);
+      element.style.marginLeft = '0';

[yoshiki, 2015/04/06 07:40:38]

nit: Should we apply a class, instead of assigning the style value directly? 

[hirono, 2015/04/06 07:48:08]

Yes! Done

+      this.appendChild(element);
     }
   } else {
     // No items to the right, move the window to the left.
@@ -189,12 +191,14 @@ Ribbon.prototype.onSplice_ = function(event) {
         firstNode.previousSibling.removeAttribute('vanishing');
       } else {
         // Push a new item at the left end.
-        var newThumbnail = this.renderThumbnail_(this.firstVisibleIndex_);
-        newThumbnail.style.marginLeft = -(this.clientHeight - 2) + 'px';
-        this.insertBefore(newThumbnail, this.firstChild);
-        setTimeout(function() {
-          newThumbnail.style.marginLeft = '0';
-        }, 0);
+        if (this.firstVisibleIndex_ < this.dataModel_.length) {
+          var newThumbnail = this.renderThumbnail_(this.firstVisibleIndex_);
+          newThumbnail.style.marginLeft = -(this.clientHeight - 2) + 'px';
+          this.insertBefore(newThumbnail, this.firstChild);
+          setTimeout(function() {
+            newThumbnail.style.marginLeft = '0';
+          }, 0);
+        }
       }
     }
   }
@@ -396,6 +400,8 @@ Ribbon.prototype.renderThumbnail_ = function(index) {
  * @private
  */
 Ribbon.prototype.setThumbnailImage_ = function(thumbnail, item) {
+  if (!item.getThumbnailMetadataItem())
+    return;
   this.thumbnailModel_.get([item.getEntry()]).then(function(metadataList) {
     var loader = new ThumbnailLoader(
         item.getEntry(),