[whatwg] Offscreen canvas (or canvas for web workers).

[Drew Wilson]

On Mon, Feb 22, 2010 at 11:13 AM, David Levin <levin at google.com> wrote:

> I've talked with some other folks on WebKit (Maciej and Oliver) about
> having a canvas that is available to workers. They suggested some nice
> modifications to make it an offscreen canvas, which may be used in the
> Document or in a Worker.
>
> Proposal:
> Introduce an OffscreenCanvas which may be created from a Document or a
> Worker context.
>
> interface OffscreenCanvas {
>                  attribute unsigned long width;
>                  attribute unsigned long height;
>         DOMString toDataURL (in optional DOMString type, in any... args);
>         object getContext(in DOMString contextId);
> };
>
>
> When it is created in the Worker context, OffscreenCanvas.getContext("2d")
> returns a CanvasWorkerContext2D. In the Document context, it returns a
> CanvasRenderingContext2D.
>
> The base class for both CanvasWorkerContext2D and CanvasRenderingContext2D
> is CanvasContext2D. CanvasContext2D is just like a CanvasRenderingContext2D
> except for omitting the font methods and any method which uses HTML
> elements. It does have some replacement methods for createPattern/drawImage
> which take an OffscreenCanvas. The canvas object attribute is either a
> HTMLCanvasElement or an OffscreenCanvas depending on what the canvas context
> came from.
>
> interface CanvasContext2D {
>         readonly attribute object canvas;
>
>         void save();
>         void restore();
>
>         void scale(in float sx, in float sy);
>         void rotate(in float angle);
>         void translate(in float tx, in float ty);
>         void transform(in float m11, in float m12, in float m21, in float
> m22, in float dx, in float dy);
>         void setTransform(in float m11, in float m12, in float m21, in
> float m22, in float dx, in float dy);
>
>                  attribute float globalAlpha;
>                  attribute [ConvertNullToNullString] DOMString
> globalCompositeOperation;
>
>         CanvasGradient createLinearGradient(in float x0, in float y0, in
> float x1, in float y1)
>             raises (DOMException);
>         CanvasGradient createRadialGradient(in float x0, in float y0, in
> float r0, in float x1, in float y1, in float r1)
>             raises (DOMException);
>         CanvasPattern createPattern(in OffscreenCanvas image, in DOMString
> repetition);
>
>                  attribute float lineWidth;
>                  attribute [ConvertNullToNullString] DOMString lineCap;
>                  attribute [ConvertNullToNullString] DOMString lineJoin;
>                  attribute float miterLimit;
>
>                  attribute float shadowOffsetX;
>                  attribute float shadowOffsetY;
>                  attribute float shadowBlur;
>                  attribute [ConvertNullToNullString] DOMString shadowColor;
>
>         void clearRect(in float x, in float y, in float width, in float
> height);
>         void fillRect(in float x, in float y, in float width, in float
> height);
>         void strokeRect(in float x, in float y, in float w, in float h);
>
>         void beginPath();
>         void closePath();
>         void moveTo(in float x, in float y);
>         void lineTo(in float x, in float y);
>         void quadraticCurveTo(in float cpx, in float cpy, in float x, in
> float y);
>         void bezierCurveTo(in float cp1x, in float cp1y, in float cp2x, in
> float cp2y, in float x, in float y);
>         void arcTo(in float x1, in float y1, in float x2, in float y2, in
> float radius);
>         void rect(in float x, in float y, in float width, in float height);
>         void arc(in float x, in float y, in float radius, in float
> startAngle, in float endAngle, in boolean anticlockwise);
>         void fill();
>         void stroke();
>         void clip();
>         boolean isPointInPath(in float x, in float y);
>
>         void drawImage(in OffscreenCanvas image, in float dx, in float dy,
> in optional float dw, in optional float dh);
>         void drawImage(in OffscreenCanvas image, in float sx, in float sy,
> in float sw, in float sh, in float dx, in float dy, in float dw, in float
> dh);
>
>         // pixel manipulation
>         ImageData createImageData(in float sw, in float sh)
>             raises (DOMException);
>         ImageData getImageData(in float sx, in float sy, in float sw, in
> float sh)
>             raises(DOMException);
>         void putImageData(in ImageData imagedata, in float dx, in float dy,
> in optional float dirtyX, in optional float dirtyY, in optional float
> dirtyWidth, in optional float dirtyHeight]);
> };
>
> interface CanvasWorkerContext2D : CanvasContext2D {
> };
>
> interface CanvasRenderingContext2D : CanvasContext2D {
>           CanvasPattern createPattern(in HTMLImageElement image, in
> DOMString repetition);
>          CanvasPattern createPattern(in HTMLCanvasElement image, in
> DOMString repetition);
>          CanvasPattern createPattern(in HTMLVideoElement image, in
> DOMString repetition);
>
>          // focus management
>          boolean drawFocusRing(in Element element, in float xCaret, in
> float yCaret, in optional boolean canDrawCustom);
>
>         // text
>                  attribute DOMString font;
>                  attribute DOMString textAlign;
>                  attribute DOMString textBaseline;
>         void fillText(in DOMString text, in float x, in float y, in
> optional float maxWidth);
>         void strokeText(in DOMString text, in float x, in float y, in
> optional float maxWidth);
>         TextMetrics measureText(in DOMString text);
>
>         // drawing images
>         void drawImage(in HTMLImageElement image, in float dx, in float dy,
> in optional float dw, in float dh);
>         void drawImage(in HTMLImageElement image, in float sx, in float sy,
> in float sw, in float sh, in float dx, in float dy, in float dw, in float
> dh);
>         void drawImage(in HTMLVideoElement image, in float dx, in float dy,
> in optional float dw, in optional float dh);
>         void drawImage(in HTMLVideoElement image, in float sx, in float sy,
> in float sw, in float sh, in float dx, in float dy, in float dw, in float
> dh);
>
>         void drawImage(in HTMLCanvasElement image, in float dx, in float
> dy, in optional float dw, in float dh);
>         void drawImage(in HTMLCanvasElement image, in float sx, in float
> sy, in float sw, in float sh, in float dx, in float dy, in float dw, in
> float dh);
>
>  };
>
>  Questions and comments are welcome.
>
> Note that something similar did come up in December and this proposal
> avoids doing any text related items in the offscreen canvas which was a
> concern brought up by Robert O'Callahan at the time  (
> http://lists.whatwg.org/htdig.cgi/whatwg-whatwg.org/2009-December/024478.html
> ).
>

Do we feel that text APIs are, in general, difficult to implement in a
multi-thread safe manner? Or would we be limiting this API primarily because
of the specifics of a single current implementation? Because if it's the
latter, I would argue against omitting the text APIs, since they seem
fundamental to many use cases. It seems like there are a range of solutions
for retrofitting multi-thread support to non-multi-thread-safe operations,
ranging from the use of global mutexes to changing the code itself to be
safely re-entrant.


>
> Dave
>
>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.whatwg.org/pipermail/whatwg-whatwg.org/attachments/20100222/b90b6cd6/attachment-0002.htm>