elemental.html.CanvasRenderingContext2D Maven / Gradle / Ivy

Go to download
/*
 * Copyright 2012 Google Inc.
 * 
 * Licensed under the Apache License, Version 2.0 (the "License"); you may not
 * use this file except in compliance with the License. You may obtain a copy of
 * the License at
 * 
 * http://www.apache.org/licenses/LICENSE-2.0
 * 
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
 * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
 * License for the specific language governing permissions and limitations under
 * the License.
 */
package elemental.html;
import elemental.util.Indexable;

import elemental.events.*;
import elemental.util.*;
import elemental.dom.*;
import elemental.html.*;
import elemental.css.*;
import elemental.stylesheets.*;

import java.util.Date;

/**
  * The bulk of the operations available at present with <canvas>
 are available through this interface, returned by a call to getContext() on the <canvas>
 element, with "2d" as its argument.
  */
public interface CanvasRenderingContext2D extends CanvasRenderingContext {


  /**
    * Color or style to use inside shapes. Default #000 (black).
    */
  Object getFillStyle();

  void setFillStyle(Object arg);


  /**
    * Default value 10px sans-serif.
    */
  String getFont();

  void setFont(String arg);


  /**
    * Alpha value that is applied to shapes and images before they are composited onto the canvas. Default 1.0 (opaque).
    */
  float getGlobalAlpha();

  void setGlobalAlpha(float arg);


  /**
    * With globalAplpha applied this sets how shapes and images are drawn onto the existing bitmap. Possible values:  source-atop
 source-in
 source-out
 source-over (default)
 destination-atop
 destination-in
 destination-out
 destination-over
 lighter
 xor
 
    */
  String getGlobalCompositeOperation();

  void setGlobalCompositeOperation(String arg);


  /**
    * Type of endings on the end of lines. Possible values: butt (default), round, square
    */
  String getLineCap();

  void setLineCap(String arg);


  /**
    * Defines the type of corners where two lines meet. Possible values: round, bevel, miter (default)
    */
  String getLineJoin();

  void setLineJoin(String arg);


  /**
    * Width of lines. Default 1.0
    */
  float getLineWidth();

  void setLineWidth(float arg);


  /**
    * Default 10.
    */
  float getMiterLimit();

  void setMiterLimit(float arg);


  /**
    * Specifies the blurring effect. Default 0
    */
  float getShadowBlur();

  void setShadowBlur(float arg);


  /**
    * Color of the shadow. Default fully-transparent black.
    */
  String getShadowColor();

  void setShadowColor(String arg);


  /**
    * Horizontal distance the shadow will be offset. Default 0.
    */
  float getShadowOffsetX();

  void setShadowOffsetX(float arg);


  /**
    * Vertical distance the shadow will be offset. Default 0.
    */
  float getShadowOffsetY();

  void setShadowOffsetY(float arg);


  /**
    * Color or style to use for the lines around shapes. Default #000 (black).
    */
  Object getStrokeStyle();

  void setStrokeStyle(Object arg);


  /**
    * Possible values: start (default), end, left, right or center.
    */
  String getTextAlign();

  void setTextAlign(String arg);

  String getTextBaseline();

  void setTextBaseline(String arg);

  float getWebkitBackingStorePixelRatio();


  /**
    * Image smoothing mode; if disabled, images will not be smoothed if scaled. 
Requires Gecko 1.9.2
    */
  boolean isWebkitImageSmoothingEnabled();

  void setWebkitImageSmoothingEnabled(boolean arg);


  /**
    * An array which specifies the lengths of alternating dashes and gaps.
    */
  Indexable getWebkitLineDash();

  void setWebkitLineDash(Indexable arg);


  /**
    * Specifies where to start a dasharray on a line.
    */
  float getWebkitLineDashOffset();

  void setWebkitLineDashOffset(float arg);


  /**
    * Adds an arc to the path which it center is at (x, y) position with radius r starting at startAngle and ending at endAngle going in the given direction by anticlockwise (defaulting to clockwise).

Parameters
 x
 The x axis of the coordinate for the arc's center
 y
 The y axis of the coordinate for the arc's center.
 radius
 The arc's radius
 startAngle
 The starting point, measured from the x axis , from which it will be drawed expressed as radians.
 endAngle
 The end arc's angle to which it will be drawed expressed as radians.
 anticlockwise 
Optional from Gecko 2.0
 When true draws the arc anticlockwise, otherwise in a clockwise direction.


    */
  void arc(float x, float y, float radius, float startAngle, float endAngle, boolean anticlockwise);


  /**
    * Adds an arc with the given control points and radius, connected to the previous point by a straight line.

Parameters
 x1
 
 y1
 
 x2
 
 y2
 
 radius
 The arc's radius.


    */
  void arcTo(float x1, float y1, float x2, float y2, float radius);

  void beginPath();

  void bezierCurveTo(float cp1x, float cp1y, float cp2x, float cp2y, float x, float y);


  /**
    * Clears the rectangle defined by it starting point at (x, y) and has a w width and a h height.

Parameters
 x
 The x axis of the coordinate for the rectangle starting point.
 y
 The y axis of the coordinate for the rectangle starting point.
 width
 The rectangle's width.
 height
 The rectangle's height.


    */
  void clearRect(float x, float y, float width, float height);

  void clearShadow();

  void clip();

  void closePath();

  ImageData createImageData(ImageData imagedata);

  ImageData createImageData(float sw, float sh);

  CanvasGradient createLinearGradient(float x0, float y0, float x1, float y1);


  /**
    * Parameters
 image
 A DOM element
 to use as the source image for the pattern. This can be any element, although typically you'll use an Image
 or <canvas>
.
 repetition
 ?

Return value
A new DOM canvas pattern object for use in pattern-based operations.
Exceptions thrown
 NS_ERROR_DOM_INVALID_STATE_ERR 
Requires Gecko 10.0
 The specified <canvas>
 element for the image parameter is zero-sized (that is, one or both of its dimensions are 0 pixels).


    */
  CanvasPattern createPattern(CanvasElement canvas, String repetitionType);


  /**
    * Parameters
 image
 A DOM element
 to use as the source image for the pattern. This can be any element, although typically you'll use an Image
 or <canvas>
.
 repetition
 ?

Return value
A new DOM canvas pattern object for use in pattern-based operations.
Exceptions thrown
 NS_ERROR_DOM_INVALID_STATE_ERR 
Requires Gecko 10.0
 The specified <canvas>
 element for the image parameter is zero-sized (that is, one or both of its dimensions are 0 pixels).


    */
  CanvasPattern createPattern(ImageElement image, String repetitionType);

  CanvasGradient createRadialGradient(float x0, float y0, float r0, float x1, float y1, float r1);


  /**
    * Draws the specified image. This method is available in multiple formats, providing a great deal of flexibility in its use.

Parameters
 image
 An element to draw into the context; the specification permits any image element (that is, <img>
, <canvas>
, and <video>
). Some browsers, including Firefox, let you use any arbitrary element.
 dx
 The X coordinate in the destination canvas at which to place the top-left corner of the source image.
 dy
 The Y coordinate in the destination canvas at which to place the top-left corner of the source image.
 dw
 The width to draw the image in the destination canvas. This allows scaling of the drawn image. If not specified, the image is not scaled in width when drawn.
 dh
 The height to draw the image in the destination canvas. This allows scaling of the drawn image. If not specified, the image is not scaled in height when drawn.
 sx
 The X coordinate of the top left corner of the sub-rectangle of the source image to draw into the destination context.
 sy
 The Y coordinate of the top left corner of the sub-rectangle of the source image to draw into the destination context.
 sw
 The width of the sub-rectangle of the source image to draw into the destination context. If not specified, the entire rectangle from the coordinates specified by sx and sy to the bottom-right corner of the image is used. If you specify a negative value, the image is flipped horizontally when drawn.
 sh
 The height of the sub-rectangle of the source image to draw into the destination context. If you specify a negative value, the image is flipped vertically when drawn.

The diagram below illustrates the meanings of the various parameters.

Exceptions thrown
 INDEX_SIZE_ERR
 If the canvas or source rectangle width or height is zero.
 INVALID_STATE_ERR
 The image has no image data.
 TYPE_MISMATCH_ERR
 The specified source element isn't supported. This is not thrown by Firefox, since any element may be used as a source image.

Compatibility notes
 Prior to Gecko 7.0 (Firefox 7.0 / Thunderbird 7.0 / SeaMonkey 2.4)
, Firefox threw an exception if any of the coordinate values was non-finite or zero. As per the specification, this no longer happens.
 Support for flipping the image by using negative values for sw and sh was added in Gecko 5.0 (Firefox 5.0 / Thunderbird 5.0 / SeaMonkey 2.2)
.
 Gecko 9.0 (Firefox 9.0 / Thunderbird 9.0 / SeaMonkey 2.6)
 now correctly supports CORS for drawing images across domains without tainting the canvas.


    */
  void drawImage(ImageElement image, float x, float y);


  /**
    * Draws the specified image. This method is available in multiple formats, providing a great deal of flexibility in its use.

Parameters
 image
 An element to draw into the context; the specification permits any image element (that is, <img>
, <canvas>
, and <video>
). Some browsers, including Firefox, let you use any arbitrary element.
 dx
 The X coordinate in the destination canvas at which to place the top-left corner of the source image.
 dy
 The Y coordinate in the destination canvas at which to place the top-left corner of the source image.
 dw
 The width to draw the image in the destination canvas. This allows scaling of the drawn image. If not specified, the image is not scaled in width when drawn.
 dh
 The height to draw the image in the destination canvas. This allows scaling of the drawn image. If not specified, the image is not scaled in height when drawn.
 sx
 The X coordinate of the top left corner of the sub-rectangle of the source image to draw into the destination context.
 sy
 The Y coordinate of the top left corner of the sub-rectangle of the source image to draw into the destination context.
 sw
 The width of the sub-rectangle of the source image to draw into the destination context. If not specified, the entire rectangle from the coordinates specified by sx and sy to the bottom-right corner of the image is used. If you specify a negative value, the image is flipped horizontally when drawn.
 sh
 The height of the sub-rectangle of the source image to draw into the destination context. If you specify a negative value, the image is flipped vertically when drawn.

The diagram below illustrates the meanings of the various parameters.

Exceptions thrown
 INDEX_SIZE_ERR
 If the canvas or source rectangle width or height is zero.
 INVALID_STATE_ERR
 The image has no image data.
 TYPE_MISMATCH_ERR
 The specified source element isn't supported. This is not thrown by Firefox, since any element may be used as a source image.

Compatibility notes
 Prior to Gecko 7.0 (Firefox 7.0 / Thunderbird 7.0 / SeaMonkey 2.4)
, Firefox threw an exception if any of the coordinate values was non-finite or zero. As per the specification, this no longer happens.
 Support for flipping the image by using negative values for sw and sh was added in Gecko 5.0 (Firefox 5.0 / Thunderbird 5.0 / SeaMonkey 2.2)
.
 Gecko 9.0 (Firefox 9.0 / Thunderbird 9.0 / SeaMonkey 2.6)
 now correctly supports CORS for drawing images across domains without tainting the canvas.


    */
  void drawImage(ImageElement image, float x, float y, float width, float height);


  /**
    * Draws the specified image. This method is available in multiple formats, providing a great deal of flexibility in its use.

Parameters
 image
 An element to draw into the context; the specification permits any image element (that is, <img>
, <canvas>
, and <video>
). Some browsers, including Firefox, let you use any arbitrary element.
 dx
 The X coordinate in the destination canvas at which to place the top-left corner of the source image.
 dy
 The Y coordinate in the destination canvas at which to place the top-left corner of the source image.
 dw
 The width to draw the image in the destination canvas. This allows scaling of the drawn image. If not specified, the image is not scaled in width when drawn.
 dh
 The height to draw the image in the destination canvas. This allows scaling of the drawn image. If not specified, the image is not scaled in height when drawn.
 sx
 The X coordinate of the top left corner of the sub-rectangle of the source image to draw into the destination context.
 sy
 The Y coordinate of the top left corner of the sub-rectangle of the source image to draw into the destination context.
 sw
 The width of the sub-rectangle of the source image to draw into the destination context. If not specified, the entire rectangle from the coordinates specified by sx and sy to the bottom-right corner of the image is used. If you specify a negative value, the image is flipped horizontally when drawn.
 sh
 The height of the sub-rectangle of the source image to draw into the destination context. If you specify a negative value, the image is flipped vertically when drawn.

The diagram below illustrates the meanings of the various parameters.

Exceptions thrown
 INDEX_SIZE_ERR
 If the canvas or source rectangle width or height is zero.
 INVALID_STATE_ERR
 The image has no image data.
 TYPE_MISMATCH_ERR
 The specified source element isn't supported. This is not thrown by Firefox, since any element may be used as a source image.

Compatibility notes
 Prior to Gecko 7.0 (Firefox 7.0 / Thunderbird 7.0 / SeaMonkey 2.4)
, Firefox threw an exception if any of the coordinate values was non-finite or zero. As per the specification, this no longer happens.
 Support for flipping the image by using negative values for sw and sh was added in Gecko 5.0 (Firefox 5.0 / Thunderbird 5.0 / SeaMonkey 2.2)
.
 Gecko 9.0 (Firefox 9.0 / Thunderbird 9.0 / SeaMonkey 2.6)
 now correctly supports CORS for drawing images across domains without tainting the canvas.


    */
  void drawImage(ImageElement image, float sx, float sy, float sw, float sh, float dx, float dy, float dw, float dh);


  /**
    * Draws the specified image. This method is available in multiple formats, providing a great deal of flexibility in its use.

Parameters
 image
 An element to draw into the context; the specification permits any image element (that is, <img>
, <canvas>
, and <video>
). Some browsers, including Firefox, let you use any arbitrary element.
 dx
 The X coordinate in the destination canvas at which to place the top-left corner of the source image.
 dy
 The Y coordinate in the destination canvas at which to place the top-left corner of the source image.
 dw
 The width to draw the image in the destination canvas. This allows scaling of the drawn image. If not specified, the image is not scaled in width when drawn.
 dh
 The height to draw the image in the destination canvas. This allows scaling of the drawn image. If not specified, the image is not scaled in height when drawn.
 sx
 The X coordinate of the top left corner of the sub-rectangle of the source image to draw into the destination context.
 sy
 The Y coordinate of the top left corner of the sub-rectangle of the source image to draw into the destination context.
 sw
 The width of the sub-rectangle of the source image to draw into the destination context. If not specified, the entire rectangle from the coordinates specified by sx and sy to the bottom-right corner of the image is used. If you specify a negative value, the image is flipped horizontally when drawn.
 sh
 The height of the sub-rectangle of the source image to draw into the destination context. If you specify a negative value, the image is flipped vertically when drawn.

The diagram below illustrates the meanings of the various parameters.

Exceptions thrown
 INDEX_SIZE_ERR
 If the canvas or source rectangle width or height is zero.
 INVALID_STATE_ERR
 The image has no image data.
 TYPE_MISMATCH_ERR
 The specified source element isn't supported. This is not thrown by Firefox, since any element may be used as a source image.

Compatibility notes
 Prior to Gecko 7.0 (Firefox 7.0 / Thunderbird 7.0 / SeaMonkey 2.4)
, Firefox threw an exception if any of the coordinate values was non-finite or zero. As per the specification, this no longer happens.
 Support for flipping the image by using negative values for sw and sh was added in Gecko 5.0 (Firefox 5.0 / Thunderbird 5.0 / SeaMonkey 2.2)
.
 Gecko 9.0 (Firefox 9.0 / Thunderbird 9.0 / SeaMonkey 2.6)
 now correctly supports CORS for drawing images across domains without tainting the canvas.


    */
  void drawImage(CanvasElement canvas, float x, float y);


  /**
    * Draws the specified image. This method is available in multiple formats, providing a great deal of flexibility in its use.

Parameters
 image
 An element to draw into the context; the specification permits any image element (that is, <img>
, <canvas>
, and <video>
). Some browsers, including Firefox, let you use any arbitrary element.
 dx
 The X coordinate in the destination canvas at which to place the top-left corner of the source image.
 dy
 The Y coordinate in the destination canvas at which to place the top-left corner of the source image.
 dw
 The width to draw the image in the destination canvas. This allows scaling of the drawn image. If not specified, the image is not scaled in width when drawn.
 dh
 The height to draw the image in the destination canvas. This allows scaling of the drawn image. If not specified, the image is not scaled in height when drawn.
 sx
 The X coordinate of the top left corner of the sub-rectangle of the source image to draw into the destination context.
 sy
 The Y coordinate of the top left corner of the sub-rectangle of the source image to draw into the destination context.
 sw
 The width of the sub-rectangle of the source image to draw into the destination context. If not specified, the entire rectangle from the coordinates specified by sx and sy to the bottom-right corner of the image is used. If you specify a negative value, the image is flipped horizontally when drawn.
 sh
 The height of the sub-rectangle of the source image to draw into the destination context. If you specify a negative value, the image is flipped vertically when drawn.

The diagram below illustrates the meanings of the various parameters.

Exceptions thrown
 INDEX_SIZE_ERR
 If the canvas or source rectangle width or height is zero.
 INVALID_STATE_ERR
 The image has no image data.
 TYPE_MISMATCH_ERR
 The specified source element isn't supported. This is not thrown by Firefox, since any element may be used as a source image.

Compatibility notes
 Prior to Gecko 7.0 (Firefox 7.0 / Thunderbird 7.0 / SeaMonkey 2.4)
, Firefox threw an exception if any of the coordinate values was non-finite or zero. As per the specification, this no longer happens.
 Support for flipping the image by using negative values for sw and sh was added in Gecko 5.0 (Firefox 5.0 / Thunderbird 5.0 / SeaMonkey 2.2)
.
 Gecko 9.0 (Firefox 9.0 / Thunderbird 9.0 / SeaMonkey 2.6)
 now correctly supports CORS for drawing images across domains without tainting the canvas.


    */
  void drawImage(CanvasElement canvas, float x, float y, float width, float height);


  /**
    * Draws the specified image. This method is available in multiple formats, providing a great deal of flexibility in its use.

Parameters
 image
 An element to draw into the context; the specification permits any image element (that is, <img>
, <canvas>
, and <video>
). Some browsers, including Firefox, let you use any arbitrary element.
 dx
 The X coordinate in the destination canvas at which to place the top-left corner of the source image.
 dy
 The Y coordinate in the destination canvas at which to place the top-left corner of the source image.
 dw
 The width to draw the image in the destination canvas. This allows scaling of the drawn image. If not specified, the image is not scaled in width when drawn.
 dh
 The height to draw the image in the destination canvas. This allows scaling of the drawn image. If not specified, the image is not scaled in height when drawn.
 sx
 The X coordinate of the top left corner of the sub-rectangle of the source image to draw into the destination context.
 sy
 The Y coordinate of the top left corner of the sub-rectangle of the source image to draw into the destination context.
 sw
 The width of the sub-rectangle of the source image to draw into the destination context. If not specified, the entire rectangle from the coordinates specified by sx and sy to the bottom-right corner of the image is used. If you specify a negative value, the image is flipped horizontally when drawn.
 sh
 The height of the sub-rectangle of the source image to draw into the destination context. If you specify a negative value, the image is flipped vertically when drawn.

The diagram below illustrates the meanings of the various parameters.

Exceptions thrown
 INDEX_SIZE_ERR
 If the canvas or source rectangle width or height is zero.
 INVALID_STATE_ERR
 The image has no image data.
 TYPE_MISMATCH_ERR
 The specified source element isn't supported. This is not thrown by Firefox, since any element may be used as a source image.

Compatibility notes
 Prior to Gecko 7.0 (Firefox 7.0 / Thunderbird 7.0 / SeaMonkey 2.4)
, Firefox threw an exception if any of the coordinate values was non-finite or zero. As per the specification, this no longer happens.
 Support for flipping the image by using negative values for sw and sh was added in Gecko 5.0 (Firefox 5.0 / Thunderbird 5.0 / SeaMonkey 2.2)
.
 Gecko 9.0 (Firefox 9.0 / Thunderbird 9.0 / SeaMonkey 2.6)
 now correctly supports CORS for drawing images across domains without tainting the canvas.


    */
  void drawImage(CanvasElement canvas, float sx, float sy, float sw, float sh, float dx, float dy, float dw, float dh);


  /**
    * Draws the specified image. This method is available in multiple formats, providing a great deal of flexibility in its use.

Parameters
 image
 An element to draw into the context; the specification permits any image element (that is, <img>
, <canvas>
, and <video>
). Some browsers, including Firefox, let you use any arbitrary element.
 dx
 The X coordinate in the destination canvas at which to place the top-left corner of the source image.
 dy
 The Y coordinate in the destination canvas at which to place the top-left corner of the source image.
 dw
 The width to draw the image in the destination canvas. This allows scaling of the drawn image. If not specified, the image is not scaled in width when drawn.
 dh
 The height to draw the image in the destination canvas. This allows scaling of the drawn image. If not specified, the image is not scaled in height when drawn.
 sx
 The X coordinate of the top left corner of the sub-rectangle of the source image to draw into the destination context.
 sy
 The Y coordinate of the top left corner of the sub-rectangle of the source image to draw into the destination context.
 sw
 The width of the sub-rectangle of the source image to draw into the destination context. If not specified, the entire rectangle from the coordinates specified by sx and sy to the bottom-right corner of the image is used. If you specify a negative value, the image is flipped horizontally when drawn.
 sh
 The height of the sub-rectangle of the source image to draw into the destination context. If you specify a negative value, the image is flipped vertically when drawn.

The diagram below illustrates the meanings of the various parameters.

Exceptions thrown
 INDEX_SIZE_ERR
 If the canvas or source rectangle width or height is zero.
 INVALID_STATE_ERR
 The image has no image data.
 TYPE_MISMATCH_ERR
 The specified source element isn't supported. This is not thrown by Firefox, since any element may be used as a source image.

Compatibility notes
 Prior to Gecko 7.0 (Firefox 7.0 / Thunderbird 7.0 / SeaMonkey 2.4)
, Firefox threw an exception if any of the coordinate values was non-finite or zero. As per the specification, this no longer happens.
 Support for flipping the image by using negative values for sw and sh was added in Gecko 5.0 (Firefox 5.0 / Thunderbird 5.0 / SeaMonkey 2.2)
.
 Gecko 9.0 (Firefox 9.0 / Thunderbird 9.0 / SeaMonkey 2.6)
 now correctly supports CORS for drawing images across domains without tainting the canvas.


    */
  void drawImage(VideoElement video, float x, float y);


  /**
    * Draws the specified image. This method is available in multiple formats, providing a great deal of flexibility in its use.

Parameters
 image
 An element to draw into the context; the specification permits any image element (that is, <img>
, <canvas>
, and <video>
). Some browsers, including Firefox, let you use any arbitrary element.
 dx
 The X coordinate in the destination canvas at which to place the top-left corner of the source image.
 dy
 The Y coordinate in the destination canvas at which to place the top-left corner of the source image.
 dw
 The width to draw the image in the destination canvas. This allows scaling of the drawn image. If not specified, the image is not scaled in width when drawn.
 dh
 The height to draw the image in the destination canvas. This allows scaling of the drawn image. If not specified, the image is not scaled in height when drawn.
 sx
 The X coordinate of the top left corner of the sub-rectangle of the source image to draw into the destination context.
 sy
 The Y coordinate of the top left corner of the sub-rectangle of the source image to draw into the destination context.
 sw
 The width of the sub-rectangle of the source image to draw into the destination context. If not specified, the entire rectangle from the coordinates specified by sx and sy to the bottom-right corner of the image is used. If you specify a negative value, the image is flipped horizontally when drawn.
 sh
 The height of the sub-rectangle of the source image to draw into the destination context. If you specify a negative value, the image is flipped vertically when drawn.

The diagram below illustrates the meanings of the various parameters.

Exceptions thrown
 INDEX_SIZE_ERR
 If the canvas or source rectangle width or height is zero.
 INVALID_STATE_ERR
 The image has no image data.
 TYPE_MISMATCH_ERR
 The specified source element isn't supported. This is not thrown by Firefox, since any element may be used as a source image.

Compatibility notes
 Prior to Gecko 7.0 (Firefox 7.0 / Thunderbird 7.0 / SeaMonkey 2.4)
, Firefox threw an exception if any of the coordinate values was non-finite or zero. As per the specification, this no longer happens.
 Support for flipping the image by using negative values for sw and sh was added in Gecko 5.0 (Firefox 5.0 / Thunderbird 5.0 / SeaMonkey 2.2)
.
 Gecko 9.0 (Firefox 9.0 / Thunderbird 9.0 / SeaMonkey 2.6)
 now correctly supports CORS for drawing images across domains without tainting the canvas.


    */
  void drawImage(VideoElement video, float x, float y, float width, float height);


  /**
    * Draws the specified image. This method is available in multiple formats, providing a great deal of flexibility in its use.

Parameters
 image
 An element to draw into the context; the specification permits any image element (that is, <img>
, <canvas>
, and <video>
). Some browsers, including Firefox, let you use any arbitrary element.
 dx
 The X coordinate in the destination canvas at which to place the top-left corner of the source image.
 dy
 The Y coordinate in the destination canvas at which to place the top-left corner of the source image.
 dw
 The width to draw the image in the destination canvas. This allows scaling of the drawn image. If not specified, the image is not scaled in width when drawn.
 dh
 The height to draw the image in the destination canvas. This allows scaling of the drawn image. If not specified, the image is not scaled in height when drawn.
 sx
 The X coordinate of the top left corner of the sub-rectangle of the source image to draw into the destination context.
 sy
 The Y coordinate of the top left corner of the sub-rectangle of the source image to draw into the destination context.
 sw
 The width of the sub-rectangle of the source image to draw into the destination context. If not specified, the entire rectangle from the coordinates specified by sx and sy to the bottom-right corner of the image is used. If you specify a negative value, the image is flipped horizontally when drawn.
 sh
 The height of the sub-rectangle of the source image to draw into the destination context. If you specify a negative value, the image is flipped vertically when drawn.

The diagram below illustrates the meanings of the various parameters.

Exceptions thrown
 INDEX_SIZE_ERR
 If the canvas or source rectangle width or height is zero.
 INVALID_STATE_ERR
 The image has no image data.
 TYPE_MISMATCH_ERR
 The specified source element isn't supported. This is not thrown by Firefox, since any element may be used as a source image.

Compatibility notes
 Prior to Gecko 7.0 (Firefox 7.0 / Thunderbird 7.0 / SeaMonkey 2.4)
, Firefox threw an exception if any of the coordinate values was non-finite or zero. As per the specification, this no longer happens.
 Support for flipping the image by using negative values for sw and sh was added in Gecko 5.0 (Firefox 5.0 / Thunderbird 5.0 / SeaMonkey 2.2)
.
 Gecko 9.0 (Firefox 9.0 / Thunderbird 9.0 / SeaMonkey 2.6)
 now correctly supports CORS for drawing images across domains without tainting the canvas.


    */
  void drawImage(VideoElement video, float sx, float sy, float sw, float sh, float dx, float dy, float dw, float dh);

  void drawImageFromRect(ImageElement image);

  void drawImageFromRect(ImageElement image, float sx);

  void drawImageFromRect(ImageElement image, float sx, float sy);

  void drawImageFromRect(ImageElement image, float sx, float sy, float sw);

  void drawImageFromRect(ImageElement image, float sx, float sy, float sw, float sh);

  void drawImageFromRect(ImageElement image, float sx, float sy, float sw, float sh, float dx);

  void drawImageFromRect(ImageElement image, float sx, float sy, float sw, float sh, float dx, float dy);

  void drawImageFromRect(ImageElement image, float sx, float sy, float sw, float sh, float dx, float dy, float dw);

  void drawImageFromRect(ImageElement image, float sx, float sy, float sw, float sh, float dx, float dy, float dw, float dh);

  void drawImageFromRect(ImageElement image, float sx, float sy, float sw, float sh, float dx, float dy, float dw, float dh, String compositeOperation);


  /**
    * Fills the subpaths with the current fill style.
    */
  void fill();


  /**
    * Draws a filled rectangle at (x, y) position whose size is determined by width and height.

Parameters
 x
 The x axis of the coordinate for the rectangle starting point.
 y
 The y axis of the coordinate for the rectangle starting point.
 width
 The rectangle's width.
 height
 The rectangle's height.


    */
  void fillRect(float x, float y, float width, float height);

  void fillText(String text, float x, float y);

  void fillText(String text, float x, float y, float maxWidth);


  /**
    * Returns an ImageData object representing the underlying pixel data for the area of the canvas denoted by the rectangle which starts at (sx, sy) and has a sw width and sh height.

Parameters
 sx
 The x axis of the coordinate for the rectangle startpoint from which the ImageData will be extracted.
 sy
 The x axis of the coordinate for the rectangle endpoint from which the ImageData will be extracted.
 sw
 The width of the rectangle from which the ImageData will be extracted.
 sh
 The height of the rectangle from which the ImageData will be extracted.

Return value
Returns an ImageData object containing the image data for the given rectangle of the canvas.

    */
  ImageData getImageData(float sx, float sy, float sw, float sh);


  /**
    * Reports whether or not the specified point is contained in the current path.

Parameters
 x
 The X coordinate of the point to check.
 y
 The Y coordinate of the point to check.

Return value
true if the specified point is contained in the current path; otherwise false.
Compatibility notes
 Prior to Gecko 7.0 (Firefox 7.0 / Thunderbird 7.0 / SeaMonkey 2.4)
, this method incorrectly failed to multiply the specified point's coordinates by the current transformation matrix before comparing it to the path. Now this method works correctly even if the context is rotated, scaled, or otherwise transformed.


    */
  boolean isPointInPath(float x, float y);


  /**
    * Connects the last point in the subpath to the x, y coordinates with a straight line.

Parameters
 x
 The x axis of the coordinate for the end of the line.
 y
 The y axis of the coordinate for the end of the line.


    */
  void lineTo(float x, float y);

  TextMetrics measureText(String text);


  /**
    * Moves the starting point of a new subpath to the (x, y) coordinates.

Parameters
 x
 The x axis of the point.
 y
 The y axis of the point.


    */
  void moveTo(float x, float y);


  /**
    * Compatibility notes
 Starting in Gecko 10.0 (Firefox 10.0 / Thunderbird 10.0)
, non-finite values to any of these parameters causes the call to putImageData() to be silently ignored, rather than throwing an exception.

    */
  void putImageData(ImageData imagedata, float dx, float dy);


  /**
    * Compatibility notes
 Starting in Gecko 10.0 (Firefox 10.0 / Thunderbird 10.0)
, non-finite values to any of these parameters causes the call to putImageData() to be silently ignored, rather than throwing an exception.

    */
  void putImageData(ImageData imagedata, float dx, float dy, float dirtyX, float dirtyY, float dirtyWidth, float dirtyHeight);

  void quadraticCurveTo(float cpx, float cpy, float x, float y);

  void rect(float x, float y, float width, float height);


  /**
    * Restores the drawing style state to the last element on the 'state stack' saved by save()
    */
  void restore();

  void rotate(float angle);


  /**
    * Saves the current drawing style state using a stack so you can revert any change you make to it using restore().
    */
  void save();

  void scale(float sx, float sy);

  void setAlpha(float alpha);

  void setCompositeOperation(String compositeOperation);

  void setFillColor(String color);

  void setFillColor(String color, float alpha);

  void setFillColor(float grayLevel);

  void setFillColor(float grayLevel, float alpha);

  void setFillColor(float r, float g, float b, float a);

  void setFillColor(float c, float m, float y, float k, float a);

  void setShadow(float width, float height, float blur);

  void setShadow(float width, float height, float blur, String color);

  void setShadow(float width, float height, float blur, String color, float alpha);

  void setShadow(float width, float height, float blur, float grayLevel);

  void setShadow(float width, float height, float blur, float grayLevel, float alpha);

  void setShadow(float width, float height, float blur, float r, float g, float b, float a);

  void setShadow(float width, float height, float blur, float c, float m, float y, float k, float a);

  void setStrokeColor(String color);

  void setStrokeColor(String color, float alpha);

  void setStrokeColor(float grayLevel);

  void setStrokeColor(float grayLevel, float alpha);

  void setStrokeColor(float r, float g, float b, float a);

  void setStrokeColor(float c, float m, float y, float k, float a);

  void setTransform(float m11, float m12, float m21, float m22, float dx, float dy);


  /**
    * Strokes the subpaths with the current stroke style.
    */
  void stroke();


  /**
    * Paints a rectangle which it starting point is at (x, y) and has a w width and a h height onto the canvas, using the current stroke style.

Parameters
 x
 The x axis for the starting point of the rectangle.
 y
 The y axis for the starting point of the rectangle.
 w
 The rectangle's width.
 h
 The rectangle's height.


    */
  void strokeRect(float x, float y, float width, float height);


  /**
    * Paints a rectangle which it starting point is at (x, y) and has a w width and a h height onto the canvas, using the current stroke style.

Parameters
 x
 The x axis for the starting point of the rectangle.
 y
 The y axis for the starting point of the rectangle.
 w
 The rectangle's width.
 h
 The rectangle's height.


    */
  void strokeRect(float x, float y, float width, float height, float lineWidth);

  void strokeText(String text, float x, float y);

  void strokeText(String text, float x, float y, float maxWidth);

  void transform(float m11, float m12, float m21, float m22, float dx, float dy);


  /**
    * Moves the origin point of the context to (x, y).

Parameters
 x
 The x axis for the point to be considered as the origin.
 y
 The x axis for the point to be considered as the origin.


    */
  void translate(float tx, float ty);

  ImageData webkitGetImageDataHD(float sx, float sy, float sw, float sh);

  void webkitPutImageDataHD(ImageData imagedata, float dx, float dy);

  void webkitPutImageDataHD(ImageData imagedata, float dx, float dy, float dirtyX, float dirtyY, float dirtyWidth, float dirtyHeight);
}