Gallery: resize image data to overlay canvas size.

ui/file_manager/gallery/js/image_editor/image_view.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.
 
 /**
  * The overlay displaying the image.
  *
  * @param {!HTMLElement} container The container element.
  * @param {!Viewport} viewport The viewport.
  * @param {!MetadataModel} metadataModel
@@ skipping 289 matching lines @@
 /**
  * Sets up the canvas as a buffer in the device resolution.
  *
  * @param {!HTMLCanvasElement} canvas The buffer canvas.
  * @return {boolean} True if the canvas needs to be rendered.
  */
 ImageView.prototype.setupDeviceBuffer = function(canvas) {
   // Set the canvas position and size in device pixels.
   var deviceRect = this.viewport_.getDeviceBounds();
   var needRepaint = false;
+

[yawano, 2015/09/25 11:07:59]

This blank line is added for readability.

[yawano, 2015/09/25 11:33:03]

This kind of thing should be done with separate CL. Removed this added blank
line.

   if (canvas.width !== deviceRect.width) {
     canvas.width = deviceRect.width;
     needRepaint = true;
   }
   if (canvas.height !== deviceRect.height) {
     canvas.height = deviceRect.height;
     needRepaint = true;
   }
   this.setTransform_(canvas, this.viewport_);
   return needRepaint;
 };
 
 /**
- * @return {!ImageData} A new ImageData object with a copy of the content.
+ * Gets screen image data with specified size.
+ * @param {number} width
+ * @param {number} height
+ * @return {!ImageData} A new ImageData object.
  */
-ImageView.prototype.copyScreenImageData = function() {
-  return this.screenImage_.getContext('2d').getImageData(
-      0, 0, this.screenImage_.width, this.screenImage_.height);
+ImageView.prototype.getScreenImageDataWith = function(width, height) {
+  // If specified size is same with current screen image size, just return it.
+  if (width === this.screenImage_.width &&
+      height === this.screenImage_.height) {
+    return this.screenImage_.getContext('2d').getImageData(
+        0, 0, this.screenImage_.width, this.screenImage_.height);
+  }
+
+  // Resize if these sizes are different.
+  var resizeCanvas = document.createElement('canvas');
+  resizeCanvas.width = width;
+  resizeCanvas.height = height;
+
+  var context = resizeCanvas.getContext('2d');
+  context.drawImage(this.screenImage_,
+      0, 0, this.screenImage_.width, this.screenImage_.height,
+      0, 0, resizeCanvas.width, resizeCanvas.height);
+  return context.getImageData(0, 0, resizeCanvas.width, resizeCanvas.height);
 };
 
 /**
  * @return {boolean} True if the image is currently being loaded.
  */
 ImageView.prototype.isLoading = function() {
   return this.imageLoader_.isBusy();
 };
 
 /**
@@ skipping 657 matching lines @@
 
 ImageView.Effect.Rotate.prototype = { __proto__: ImageView.Effect.prototype };
 
 /**
  * @override
  */
 ImageView.Effect.Rotate.prototype.transform = function(element, viewport) {
   return viewport.getRotatingTransformation(
       element.width, element.height, this.orientation_ ? -1 : 1);
 };