Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(606)

Unified Diff: tools/dom/templates/html/impl/impl_CanvasRenderingContext2D.darttemplate

Issue 12775010: Added the CanvasImageSource interface, which all types that a canvas can draw (Closed) Base URL: https://dart.googlecode.com/svn/branches/bleeding_edge/dart
Patch Set: Fixed nits. Created 7 years, 9 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
Index: tools/dom/templates/html/impl/impl_CanvasRenderingContext2D.darttemplate
diff --git a/tools/dom/templates/html/impl/impl_CanvasRenderingContext2D.darttemplate b/tools/dom/templates/html/impl/impl_CanvasRenderingContext2D.darttemplate
index 3ce955f5082b2f33b4688c7c4f61fdfff1eb5614..93fc2fa222821e765124cb40166bc1c60a9940c6 100644
--- a/tools/dom/templates/html/impl/impl_CanvasRenderingContext2D.darttemplate
+++ b/tools/dom/templates/html/impl/impl_CanvasRenderingContext2D.darttemplate
@@ -49,6 +49,100 @@ $!MEMBERS
$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
+ * [destinationRect]. If [sourceRect] is not provided, then
+ * the entire rectangular image from [source] will be drawn to this context.
+ * If the dimensions of [source] or [sourceRect]
+ * differ from [destinationRect], 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),
+ * sourceRect: 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),
+ * sourceRect: 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 destinationRect,
+ {Rect sourceRect}) {
+ if (sourceRect == null) {
+ $dom_drawImage(source,
+ destinationRect.left,
+ destinationRect.top,
+ destinationRect.width,
+ destinationRect.height);
+ } else {
+ $dom_drawImage(source,
+ sourceRect.left,
+ sourceRect.top,
+ sourceRect.width,
+ sourceRect.height,
+ destinationRect.left,
+ destinationRect.top,
+ destinationRect.width,
+ destinationRect.height);
+ }
+ }
$if DART2JS
@DomName('CanvasRenderingContext2D.lineDashOffset')

Powered by Google App Engine
This is Rietveld 408576698