support animated GIF

ui/file_manager/gallery/js/image_editor/filter.js

 // Copyright 2014 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.
 
 /**
  * A namespace for image filter utilities.
  */
 var filter = {};
 
 /**
  * Create a filter from name and options.
  *
  * @param {string} name Maps to a filter method name.
  * @param {!Object} options A map of filter-specific options.
  * @return {function(!ImageData,!ImageData,number,number)} created function.
  */
 filter.create = function(name, options) {
   var filterFunc = filter[name](options);
   return function() {
     var time = Date.now();
     filterFunc.apply(null, arguments);
     var dst = arguments[0];
     var mPixPerSec = dst.width * dst.height / 1000 / (Date.now() - time);
     ImageUtil.trace.report(name, Math.round(mPixPerSec * 10) / 10 + 'Mps');
   }
 };
 
 /**
+ * Ensures argument is canvas. If it's not, creates new canvas and copy.
+ *
+ * @param {!HTMLCanvasElement|!HTMLImageElement} imgOrCanvas
+ *    imageOrCanvas
+ * @return {!HTMLCanvasElement} canvas.

[yawano, 2016/01/20 06:23:09]

nit: @private

[ryoh, 2016/01/21 03:19:55]

Done.

+ */
+filter.ensureCanvas_ = function(imgOrCanvas) {
+  if(imgOrCanvas.tagName === 'canvas') {
+    return assertInstanceof(imgOrCanvas, HTMLCanvasElement);
+  }
+  var canvas = assertInstanceof(document.createElement('canvas'),
+      HTMLCanvasElement);
+  canvas.width = imgOrCanvas.width;
+  canvas.height = imgOrCanvas.height;
+  var context = canvas.getContext('2d');
+  context.drawImage(imgOrCanvas, 0, 0);
+  return canvas;
+};
+
+/**
  * Apply a filter to a image by splitting it into strips.
  *
  * To be used with large images to avoid freezing up the UI.
  *
  * @param {!HTMLCanvasElement} dstCanvas Destination canvas.
- * @param {!HTMLCanvasElement} srcCanvas Source canvas.
+ * @param {!HTMLCanvasElement|!HTMLImageElement} srcImage Source image.
  * @param {function(!ImageData,!ImageData,number,number)} filterFunc Filter.
  * @param {function(number, number)} progressCallback Progress callback.
  * @param {number=} opt_maxPixelsPerStrip Pixel number to process at once.
  */
 filter.applyByStrips = function(
-    dstCanvas, srcCanvas, filterFunc, progressCallback, opt_maxPixelsPerStrip) {
+    dstCanvas, srcImage, filterFunc, progressCallback, opt_maxPixelsPerStrip) {
   // 1 Mpix is a reasonable default.
   var maxPixelsPerStrip = opt_maxPixelsPerStrip || 1000000;
 
   var dstContext = dstCanvas.getContext('2d');
-  var srcContext = srcCanvas.getContext('2d');
-  var source = srcContext.getImageData(0, 0, srcCanvas.width, srcCanvas.height);
+  var srcContext = filter.ensureCanvas_(srcImage).getContext('2d');
+  var source = srcContext.getImageData(0, 0, srcImage.width, srcImage.height);
 
-  var stripCount = Math.ceil(srcCanvas.width * srcCanvas.height /
+  var stripCount = Math.ceil(srcImage.width * srcImage.height /
       maxPixelsPerStrip);
 
   var strip = srcContext.getImageData(0, 0,
-      srcCanvas.width, Math.ceil(srcCanvas.height / stripCount));
+      srcImage.width, Math.ceil(srcImage.height / stripCount));
 
   var offset = 0;
 
   function filterStrip() {
     // If the strip overlaps the bottom of the source image we cannot shrink it
     // and we cannot fill it partially (since canvas.putImageData always draws
     // the entire buffer).
     // Instead we move the strip up several lines (converting those lines
     // twice is a small price to pay).
     if (offset > source.height - strip.height) {
@@ skipping 547 matching lines @@
 /**
  * @param {{r: !Array<number>, g: !Array<number>, b: !Array<number>}}
  *     histogram
  * @return {boolean} True if the autofix would make a visible difference.
  */
 filter.autofix.isApplicable = function(histogram) {
   return filter.autofix.needsStretching(histogram.r) ||
          filter.autofix.needsStretching(histogram.g) ||
          filter.autofix.needsStretching(histogram.b);
 };