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

Unified Diff: sdk/lib/html/dartium/html_dartium.dart

Side-by-side diff isn't available for this file because of its large size.
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:
Download patch
« no previous file with comments | « sdk/lib/html/dart2js/html_dart2js.dart ('k') | tests/html/canvasrenderingcontext2d_test.dart » ('j') | no next file with comments »
Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
Index: sdk/lib/html/dartium/html_dartium.dart
diff --git a/sdk/lib/html/dartium/html_dartium.dart b/sdk/lib/html/dartium/html_dartium.dart
index 4813f54fa03f231306c5f605d5719741f1c09814..b868c8ae7e50c394965483b0038193aa2b81913d 100644
--- a/sdk/lib/html/dartium/html_dartium.dart
+++ b/sdk/lib/html/dartium/html_dartium.dart
@@ -1081,7 +1081,7 @@ class CDataSection extends Text {
@DomName('HTMLCanvasElement')
-class CanvasElement extends _Element_Merged {
+class CanvasElement extends _Element_Merged implements CanvasImageSource {
CanvasElement.internal() : super.internal();
@DomName('HTMLCanvasElement.HTMLCanvasElement')
@@ -1560,7 +1560,7 @@ class CanvasRenderingContext2D extends CanvasRenderingContext {
@DocsEditable
CanvasGradient createRadialGradient(num x0, num y0, num r0, num x1, num y1, num r1) native "CanvasRenderingContext2D_createRadialGradient_Callback";
- void drawImage(canvas_OR_image_OR_video, num sx_OR_x, num sy_OR_y, [num sw_OR_width, num height_OR_sh, num dx, num dy, num dw, num dh]) {
+ void $dom_drawImage(canvas_OR_image_OR_video, num sx_OR_x, num sy_OR_y, [num sw_OR_width, num height_OR_sh, num dx, num dy, num dw, num dh]) {
if ((canvas_OR_image_OR_video is ImageElement || canvas_OR_image_OR_video == null) && (sx_OR_x is num || sx_OR_x == null) && (sy_OR_y is num || sy_OR_y == null) && !?sw_OR_width && !?height_OR_sh && !?dx && !?dy && !?dw && !?dh) {
_drawImage_1(canvas_OR_image_OR_video, sx_OR_x, sy_OR_y);
return;
@@ -1881,6 +1881,100 @@ class CanvasRenderingContext2D extends CanvasRenderingContext {
$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);
+ }
+ }
}
// Copyright (c) 2012, the Dart project authors. Please see the AUTHORS file
@@ -14424,12 +14518,9 @@ class ImageData extends NativeFieldWrapperClass1 {
// 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.
-// WARNING: Do not edit - generated code.
-
-@DocsEditable
@DomName('HTMLImageElement')
-class ImageElement extends _Element_Merged {
+class ImageElement extends _Element_Merged implements CanvasImageSource {
ImageElement.internal() : super.internal();
@DomName('HTMLImageElement.HTMLImageElement')
@@ -26403,12 +26494,9 @@ class ValidityState extends NativeFieldWrapperClass1 {
// 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.
-// WARNING: Do not edit - generated code.
-
-@DocsEditable
@DomName('HTMLVideoElement')
-class VideoElement extends MediaElement {
+class VideoElement extends MediaElement implements CanvasImageSource {
VideoElement.internal() : super.internal();
@DomName('HTMLVideoElement.HTMLVideoElement')
@@ -32581,6 +32669,32 @@ class _DataAttributeMap implements Map<String, String> {
/**
+ * An object that can be drawn to a [CanvasRenderingContext2D] object with
+ * [CanvasRenderingContext2D.drawImage] or
+ * [CanvasRenderingContext2D.drawImageAtScale].
+ *
+ * If the CanvasImageSource is an [ImageElement] then the element's image is
+ * used. If the [ImageElement] is an animated image, then the poster frame is
+ * used. If there is no poster frame, then the first frame of animation is used.
+ *
+ * If the CanvasImageSource is a [VideoElement] then the frame at the current
+ * playback position is used as the image.
+ *
+ * If the CanvasImageSource is a [CanvasElement] then the element's bitmap is
+ * used.
+ *
+ * See also:
+ *
+ * * [CanvasImageSource](http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html#image-sources-for-2d-rendering-contexts)
+ * from the WHATWG.
+ */
+abstract class CanvasImageSource {}
+// 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.
+
+
+/**
* An object representing the top-level context object for web scripting.
*
* In a web browser, a [Window] object represents the actual browser window.
« no previous file with comments | « sdk/lib/html/dart2js/html_dart2js.dart ('k') | tests/html/canvasrenderingcontext2d_test.dart » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698