[Photo Editor] Save edited images immediately.

chrome/browser/resources/file_manager/js/image_editor/commands.js

 // Copyright (c) 2011 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.
 
 /**
  * Command queue is the only way to modify images.
  * Supports undo/redo.
  * Command execution is asynchronous (callback-based).
+ *
+ * @param {Document} document Document to create canvases in.
+ * @param {HTMLCanvasElement} canvas The canvas with the original image.
+ * @param {function(callback)} saveFunction Function to save the image.
  */
-function CommandQueue(document, canvas) {
+function CommandQueue(document, canvas, saveFunction) {
   this.document_ = document;
   this.undo_ = [];
   this.redo_ = [];
   this.subscribers_ = [];
 
   this.baselineImage_ = canvas;
   this.currentImage_ = canvas;
   this.previousImage_ = null;
 
+  this.saveFunction_ = saveFunction;
+
   this.busy_ = false;
 
   this.UIContext_ = {};
 }
 
 /**
  * Attach the UI elements to the command queue.
  * Once the UI is attached the results of image manipulations are displayed.
  *
  * @param {ImageView} imageView The ImageView object to display the results
  * @param {ImageEditor.Prompt} prompt
  * @param {function(boolean)} lock Function to enable/disable buttons etc.
  */
 CommandQueue.prototype.attachUI = function(imageView, prompt, lock) {
   this.UIContext_ = {
     imageView: imageView,
     prompt: prompt,
     lock: lock
   };
 };
 
 /**
- * Detach the UI. Further image modifications will not be displayed.
+ * Execute the action when the queue is not busy.
+ * @param {function} callback Callback.
  */
-CommandQueue.prototype.detachUI = function() {
-  // The current this.UIContext_ object might be used by the command currently
-  // being executed. Null out its fields so that the command continues silently.
-  this.UIContext_.imageView = null;
-  this.UIContext_.prompt = null;
-  this.UIContext_.lock = null;
-
-  // Now replace the object to guarantee that we do not interfere with the
-  // current command.
-  this.UIContext_ = {};
-};
-
-/**
- * Asynchronous getter. Does not return the image while the queue is busy.
- */
-CommandQueue.prototype.requestCurrentImage = function(callback) {
-  if (this.isBusy()) {
+CommandQueue.prototype.executeWhenReady = function(callback) {
+  if (this.isBusy())
     this.subscribers_.push(callback);
-  } else {
-    var self = this;
-    setTimeout(function() { callback(self.currentImage_) }, 0);
-  }
+  else
+    setTimeout(callback, 0);
 };
 
 CommandQueue.prototype.isBusy = function() { return this.busy_ };
 
 CommandQueue.prototype.setBusy_ = function(on) {
   if (this.busy_ == on)
     throw new Error('Inconsistent CommandQueue lock state');
 
   this.busy_ = on;
 
   if (!on) {
-    // Notify the subscribers that requested the image while the queue was busy.
-    while (this.subscribers_.length) {
-      this.subscribers_.pop()(this.currentImage_);
-    }
+    // Execute the actions requested while the queue was busy.
+    while (this.subscribers_.length)
+      this.subscribers_.shift()();
   }
 
   if (this.UIContext_.lock)
     this.UIContext_.lock(on);
 
-  if (on) {
+  if (on)
     ImageUtil.trace.resetTimer('command-busy');
-  } else {
+  else
     ImageUtil.trace.reportTimer('command-busy');
-  }
+};
+
+CommandQueue.prototype.save_ = function() {

[dgozman, 2012/05/16 16:05:40]

It's hard to understand the difference between |this.save_| and
|this.saveFunction_|. Maybe rename to something like externalSaveFunction and
saveAndBecomeAvailable?

[Vladislav Kaznacheev, 2012/05/17 09:04:40]

renamed to commit_ and added a JSDoc

On 2012/05/16 16:05:40, dgozman wrote:

+  setTimeout(
+      this.saveFunction_,
+      ImageView.ANIMATION_WAIT_INTERVAL,
+      this.setBusy_.bind(this, false));

[dgozman, 2012/05/16 16:05:40]

Is this setBusy a parameter to saveFunction? Add a comment please.
Also, does this method assume that |isBusy==true| at the call time?

[Vladislav Kaznacheev, 2012/05/17 09:04:40]

Rewrote for clarity.
And yes, this assumes isBusy==true, there is a check in setBusy
On 2012/05/16 16:05:40, dgozman wrote:

 };
 
 CommandQueue.prototype.doExecute_ = function(command, uiContext, callback) {
   if (!this.currentImage_)
     throw new Error('Cannot operate on null image');
 
   // Remember one previous image so that the first undo is as fast as possible.
   this.previousImage_ = this.currentImage_;
   var self = this;
   command.execute(
@@ skipping 13 matching lines @@
  * @param {boolean} opt_keep_redo true if redo stack should not be cleared.
  */
 CommandQueue.prototype.execute = function(command, opt_keep_redo) {
   this.setBusy_(true);
 
   if (!opt_keep_redo)
     this.redo_ = [];
 
   this.undo_.push(command);
 
-  this.doExecute_(command, this.UIContext_, this.setBusy_.bind(this, false));
+  this.doExecute_(command, this.UIContext_, this.save_.bind(this));
 };
 
 CommandQueue.prototype.canUndo = function() {
   return this.undo_.length != 0;
 };
 
 CommandQueue.prototype.undo = function() {
   if (!this.canUndo())
     throw new Error('Cannot undo');
 
   this.setBusy_(true);
 
   var command = this.undo_.pop();
   this.redo_.push(command);
 
   var self = this;
 
   function complete() {
     if (self.UIContext_.imageView) {
       command.revertView(self.currentImage_, self.UIContext_.imageView);
     }
-    self.setBusy_(false);
+    self.save_();
   }
 
   if (this.previousImage_) {
     // First undo after an execute call.
     this.currentImage_ = this.previousImage_;
     this.previousImage_ = null;
     complete();
     // TODO(kaznacheev) Consider recalculating previousImage_ right here
     // by replaying the commands in the background.
   } else {
@@ skipping 176 matching lines @@
 
   function onProgressInvisible(updatedRow, rowCount) {
     if (updatedRow == rowCount) {
       callback(result);
     }
   }
 
   filter.applyByStrips(result, srcCanvas, this.filter_,
       uiContext.imageView ? onProgressVisible : onProgressInvisible);
 };