Added the CanvasImageSource interface, which all types that a canvas can draw

tools/dom/templates/html/impl/impl_CanvasRenderingContext2D.darttemplate

 // Copyright (c) 2012, the Dart project authors.  Please see the AUTHORS file
 // for details. All rights reserved. Use of this source code is governed by a
 // BSD-style license that can be found in the LICENSE file.
 
 part of $LIBRARYNAME;
 
 $(ANNOTATIONS)class $CLASSNAME$EXTENDS$IMPLEMENTS$NATIVESPEC {
 $!MEMBERS
 
   /**
@@ skipping 31 matching lines @@
   void setStrokeColorHsl(int h, num s, num l, [num a = 1]) {
     this.strokeStyle = 'hsla($h, $s%, $l%, $a)';
   }
 
   @DomName('CanvasRenderingContext2D.arc')
   void arc(num x,  num y,  num radius,  num startAngle, num endAngle,
       [bool anticlockwise = false]) {
     $dom_arc(x, y, radius, startAngle, endAngle, anticlockwise);
   }
 
+  /**
+   * Draws an image from a [CanvasImageSource] to this canvas.
+   *
+   * The entire image from [source] will be drawn to this context with its top
+   * left corner at the point ([destinationX], [destinationY]). If the image is
+   * larger than canvas will allow, the image will be cropped to fit the
+   * available space.
+   *
+   *     CanvasElement canvas = new CanvasElement(width: 600, height: 600);
+   *     CanvasRenderingContext2D ctx = canvas.context2d;
+   *     ImageElement img = document.query('img');
+   *
+   *     ctx.drawImage(img, 100, 100);
+   *
+   *     VideoElement video = document.query('video');
+   *     ctx.drawImage(video, 0, 0);
+   *
+   *     CanvasElement otherCanvas = document.query('canvas');
+   *     otherCanvas.width = 100;
+   *     otherCanvas.height = 100;
+   *     ctx.drawImage(otherCanvas, 590, 590); // will get cropped
+   *
+   * See also:
+   *
+   *   * [CanvasImageSource] for more information on what data is retrieved
+   * from [source].
+   *   * [drawImage](http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html#dom-context-2d-drawimage)
+   * from the WHATWG.
+   */
+  @DomName('CanvasRenderingContext2D.drawImage')
+  void drawImage(CanvasImageSource source, num destinationX, num destinationY) {
+    $dom_drawImage(source, destinationX, destinationY);
+  }
+
+  /**
+   * Draws an image from a [CanvasImageSource] to an area of this canvas.
+   *
+   * The image will be drawn to an area of this canvas defined by
+   * [destinationRectangle]. If [sourceRectangle] is not provided, then
+   * the entire rectangular image from [source] will be drawn to this context.
+   * If the dimensions of [source] or [sourceRectangle]
+   * differ from [destinationRectangle], then the image will be scaled to fit.
+   * If the image is larger than canvas
+   * will allow, the image will be cropped to fit the available space.
+   *
+   *     CanvasElement canvas = new CanvasElement(width: 600, height: 600);
+   *     CanvasRenderingContext2D ctx = canvas.context2d;
+   *     ImageElement img = document.query('img');
+   *     img.width = 100;
+   *     img.height = 100;
+   *
+   *     // Scale the image to 20x20
+   *     ctx.drawImageAtScale(img, new Rect(50, 50, 20, 20));
+   *
+   *     VideoElement video = document.query('video');
+   *     video.width = 100;
+   *     video.height = 100;
+   *     // Take the middle 20x20 pixels from the video and stretch them.
+   *     ctx.drawImageAtScale(video, new Rect(50, 50, 100, 100),
+   *         sourceRectangle: new Rect(40, 40, 20, 20));
+   *
+   *     // Draw the top 100x20 pixels from the otherCanvas.
+   *     CanvasElement otherCanvas = document.query('canvas');
+   *     ctx.drawImageAtScale(otherCanvas, new Rect(0, 0, 100, 20),
+   *         sourceRectangle: new Rect(0, 0, 100, 20));
+   *
+   * See also:
+   *
+   *   * [CanvasImageSource] for more information on what data is retrieved
+   * from [source].
+   *   * [drawImage](http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html#dom-context-2d-drawimage)
+   * from the WHATWG.
+   */
+  @DomName('CanvasRenderingContext2D.drawImage')
+  void drawImageAtScale(CanvasImageSource source, Rect destinationRectangle,
+      {Rect sourceRectangle}) {

[blois, 2013/03/15 18:05:30]

I'd call it sourceRect- rectangle is just too verbose.

[Andrei Mouravski, 2013/03/15 20:06:12]

Done.

+    if (sourceRectangle == null) {
+      $dom_drawImage(source,
+          destinationRectangle.left,
+          destinationRectangle.top,
+          destinationRectangle.width,
+          destinationRectangle.height);
+    } else {
+      $dom_drawImage(source,
+          sourceRectangle.left,
+          sourceRectangle.top,
+          sourceRectangle.width,
+          sourceRectangle.height,
+          destinationRectangle.left,
+          destinationRectangle.top,
+          destinationRectangle.width,
+          destinationRectangle.height);
+    }
+  }
 
 $if DART2JS
   @DomName('CanvasRenderingContext2D.lineDashOffset')
   num get lineDashOffset => JS('num',
       '#.lineDashOffset || #.webkitLineDashOffset', this, this);
 
   @DomName('CanvasRenderingContext2D.lineDashOffset')
   void set lineDashOffset(num value) => JS('void', 
       'typeof #.lineDashOffset != "undefined" ? #.lineDashOffset = # : '
       '#.webkitLineDashOffset = #', this, this, value, this, value);
 $endif
 }