Gallery: Store image caches in Gallery items.

ui/file_manager/gallery/js/gallery.js

Index: ui/file_manager/gallery/js/gallery.js
diff --git a/ui/file_manager/gallery/js/gallery.js b/ui/file_manager/gallery/js/gallery.js
index 305def2b307b82b506aefd25ac6e265da851bb06..5042af5aae906320609c9cbebcf15cfd9f5980b2 100644
--- a/ui/file_manager/gallery/js/gallery.js
+++ b/ui/file_manager/gallery/js/gallery.js
@@ -28,6 +28,22 @@ function GalleryDataModel() {
   this.metadataCache_ = null;
 }
 
+/**
+ * Maximum number of full size image cache.
+ * @type {number}
+ * @const
+ * @private
+ */
+GalleryDataModel.MAX_FULL_IMAGE_CACHE_ = 3;
+
+/**
+ * Maximum number of screen size image cache.
+ * @type {number}
+ * @const
+ * @private
+ */
+GalleryDataModel.MAX_SCREEN_IMAGE_CACHE_ = 5;
+
 GalleryDataModel.prototype = {
   __proto__: cr.ui.ArrayDataModel.prototype
 };
@@ -134,6 +150,51 @@ GalleryDataModel.prototype.saveItem = function(item, canvas, overwrite) {
 };
 
 /**
+ * Evicts image caches in the items.
+ * @param {Gallery.Item} currentSelectedItem Current selected item.
+ */
+GalleryDataModel.prototype.evictCache = function(currentSelectedItem) {
+  // Updates the last accessed date.
+  if (currentSelectedItem)
+    currentSelectedItem.lastAccessed = Date.now();

[mtomasz, 2014/07/28 07:51:21]

I think updating lastAccessed time shouldn't be responsibility of evictCache(),
which should just evict cache.

How about adding a getter and setter for contentImage and screenImage, and
updating accessedTime there + calling evictCache in the setter? WDYT?

[hirono, 2014/07/28 09:10:33]

How about adding touch method and calling it when the selection is changed?
Getters should work. But It may change the priority of cache unintentionally. I
would rather make it controllable a bit more.

[mtomasz, 2014/07/28 09:14:00]

SGTM!

[hirono, 2014/07/28 09:27:21]

Thanks! Done.

+
+  // Sort the item by the last accessed date.
+  var sorted = this.slice().sort(function(a, b) {
+    return b.lastAccessed - a.lastAccessed;
+  });
+
+  // Evict caches.
+  var contentCacheCount = 0;
+  var screenCacheCount = 0;
+  for (var i = 0; i < sorted.length; i++) {
+    if (sorted[i].contentImage) {
+      if (++contentCacheCount > GalleryDataModel.MAX_FULL_IMAGE_CACHE_) {
+        if (sorted[i].contentImage.parentNode) {
+          console.error('The content image has a parent node.');
+        } else {
+          // Force to free the buffer of the canvas by assinng zero size.
+          sorted[i].contentImage.width = 0;
+          sorted[i].contentImage.height = 0;
+          sorted[i].contentImage = null;
+        }
+      }
+    }
+    if (sorted[i].screenImage) {
+      if (++screenCacheCount > GalleryDataModel.MAX_SCREEN_IMAGE_CACHE_) {
+        if (sorted[i].screenImage.parentNode) {
+          console.error('The screen image has a parent node.');
+        } else {
+          // Force to free the buffer of the canvas by assinng zero size.
+          sorted[i].screenImage.width = 0;
+          sorted[i].screenImage.height = 0;
+          sorted[i].screenImage = null;
+        }
+      }
+    }
+  }
+};
+
+/**
  * Gallery for viewing and editing image files.
  *
  * @param {!VolumeManager} volumeManager The VolumeManager instance of the
@@ -646,6 +707,7 @@ Gallery.prototype.getSingleSelectedItem = function() {
 Gallery.prototype.onSelection_ = function() {
   this.updateSelectionAndState_();
   this.updateShareMenu_();
+  this.dataModel_.evictCache(this.getSelectedItems()[0]);
 };
 
 /**