Skip to content

Commit

Permalink
[e] (0) Extract the transformation matrix API from canvas so we can r…
Browse files Browse the repository at this point in the history
…euse it with Path and Pattern objects.

Affected topics: Canvas

git-svn-id: http://svn.whatwg.org/webapps@7015 340c8d12-0b0e-0410-8428-c7bf67bfef74
  • Loading branch information
Hixie committed Mar 5, 2012
1 parent 4cdad80 commit ea35ca4
Show file tree
Hide file tree
Showing 3 changed files with 93 additions and 66 deletions.
53 changes: 31 additions & 22 deletions complete.html
Expand Up @@ -34872,17 +34872,7 @@ <h5 id=2dcontext><span class=secno>4.8.11.1 </span>The 2D context</h5>
// when enabled, it would prevent the UA from falling back on lower-quality but faster rendering routines
// useful e.g. for when an image manipulation app uses <canvas> both for UI previews and the actual work
-->
// transformations (default transform is the identity matrix)
void <a href=#dom-context-2d-scale title=dom-context-2d-scale>scale</a>(double x, double y);
void <a href=#dom-context-2d-rotate title=dom-context-2d-rotate>rotate</a>(double angle);
void <a href=#dom-context-2d-translate title=dom-context-2d-translate>translate</a>(double x, double y);
void <a href=#dom-context-2d-transform title=dom-context-2d-transform>transform</a>(double a, double b, double c, double d, double e, double f);
void <a href=#dom-context-2d-settransform title=dom-context-2d-setTransform>setTransform</a>(double a, double b, double c, double d, double e, double f);
<!--
// v7 we've also received requests (though not many so far) for:
void skew(...); // is this common enough that one can't just use setTransform()?
void reflect(...); and void mirror(...); // aren't negative values in scale() sufficient for these?
-->

// compositing
attribute double <a href=#dom-context-2d-globalalpha title=dom-context-2d-globalAlpha>globalAlpha</a>; // (default 1.0)
attribute DOMString <a href=#dom-context-2d-globalcompositeoperation title=dom-context-2d-globalCompositeOperation>globalCompositeOperation</a>; // (default source-over)
Expand Down Expand Up @@ -34959,6 +34949,22 @@ <h5 id=2dcontext><span class=secno>4.8.11.1 </span>The 2D context</h5>
void <a href=#dom-context-2d-putimagedata title=dom-context-2d-putImageData>putImageData</a>(<a href=#imagedata>ImageData</a> imagedata, double dx, double dy);
void <a href=#dom-context-2d-putimagedata title=dom-context-2d-putImageData>putImageData</a>(<a href=#imagedata>ImageData</a> imagedata, double dx, double dy, double dirtyX, double dirtyY, double dirtyWidth, double dirtyHeight);
};
<a href=#canvasrenderingcontext2d>CanvasRenderingContext2D</a> implements <a href=#canvastransformation>CanvasTransformation</a>;

[NoInterfaceObject]
interface <dfn id=canvastransformation>CanvasTransformation</dfn> {
// transformations (default transform is the identity matrix)
void <a href=#dom-context-2d-scale title=dom-context-2d-scale>scale</a>(double x, double y);
void <a href=#dom-context-2d-rotate title=dom-context-2d-rotate>rotate</a>(double angle);
void <a href=#dom-context-2d-translate title=dom-context-2d-translate>translate</a>(double x, double y);
void <a href=#dom-context-2d-transform title=dom-context-2d-transform>transform</a>(double a, double b, double c, double d, double e, double f);
void <a href=#dom-context-2d-settransform title=dom-context-2d-setTransform>setTransform</a>(double a, double b, double c, double d, double e, double f);
<!--
// v7 we've also received requests (though not many so far) for:
void skew(...); // is this common enough that one can't just use setTransform()?
void reflect(...); and void mirror(...); // aren't negative values in scale() sufficient for these?
-->
};

interface <dfn id=canvasgradient>CanvasGradient</dfn> {
// opaque object
Expand Down Expand Up @@ -34999,8 +35005,8 @@ <h5 id=2dcontext><span class=secno>4.8.11.1 </span>The 2D context</h5>
context paints on.</p>

<p>Except where otherwise specified, for the 2D context interface,
any method call with a numeric argument whose value is infinite or a
NaN value must be ignored.</p>
<strong>any method call with a numeric argument whose value is
infinite or a NaN value must be ignored</strong>.</p>

<!--
Philip Taylor wrote:
Expand Down Expand Up @@ -35112,16 +35118,19 @@ <h6 id=transformations><span class=secno>4.8.11.1.2 </span><dfn title=dom-contex

<div class=impl>

<p>When the context is created, the transformation matrix must
initially be the identity transform. It may then be adjusted using
the transformation methods.</p>
<p>Any object that implements the <code><a href=#canvastransformation>CanvasTransformation</a></code>
interface has a <i>current transformation matrix</i>. When such an
object is created, its transformation matrix must be initialized to
the identity transform. It may then be adjusted using the
transformation methods described in this section.</p>

<p>The transformations must be performed in reverse order.</p>

<p>The transformations must be performed in reverse order. For
instance, if a scale transformation that doubles the width is
applied, followed by a rotation transformation that rotates drawing
operations by a quarter turn, and a rectangle twice as wide as it is
tall is then drawn on the canvas, the actual result will be a
square.</p>
<p class=note>For instance, if a scale transformation that doubles
the width is applied to the canvas, followed by a rotation
transformation that rotates drawing operations by a quarter turn,
and a rectangle twice as wide as it is tall is then drawn on the
canvas, the actual result will be a square.</p>
<!-- q.v. http://goo.gl/5RLrN -->

</div>
Expand Down
53 changes: 31 additions & 22 deletions index
Expand Up @@ -34872,17 +34872,7 @@ dictionary <dfn id=trackeventinit>TrackEventInit</dfn> : <a href=#eventinit>Even
// when enabled, it would prevent the UA from falling back on lower-quality but faster rendering routines
// useful e.g. for when an image manipulation app uses <canvas> both for UI previews and the actual work
-->
// transformations (default transform is the identity matrix)
void <a href=#dom-context-2d-scale title=dom-context-2d-scale>scale</a>(double x, double y);
void <a href=#dom-context-2d-rotate title=dom-context-2d-rotate>rotate</a>(double angle);
void <a href=#dom-context-2d-translate title=dom-context-2d-translate>translate</a>(double x, double y);
void <a href=#dom-context-2d-transform title=dom-context-2d-transform>transform</a>(double a, double b, double c, double d, double e, double f);
void <a href=#dom-context-2d-settransform title=dom-context-2d-setTransform>setTransform</a>(double a, double b, double c, double d, double e, double f);
<!--
// v7 we've also received requests (though not many so far) for:
void skew(...); // is this common enough that one can't just use setTransform()?
void reflect(...); and void mirror(...); // aren't negative values in scale() sufficient for these?
-->

// compositing
attribute double <a href=#dom-context-2d-globalalpha title=dom-context-2d-globalAlpha>globalAlpha</a>; // (default 1.0)
attribute DOMString <a href=#dom-context-2d-globalcompositeoperation title=dom-context-2d-globalCompositeOperation>globalCompositeOperation</a>; // (default source-over)
Expand Down Expand Up @@ -34959,6 +34949,22 @@ dictionary <dfn id=trackeventinit>TrackEventInit</dfn> : <a href=#eventinit>Even
void <a href=#dom-context-2d-putimagedata title=dom-context-2d-putImageData>putImageData</a>(<a href=#imagedata>ImageData</a> imagedata, double dx, double dy);
void <a href=#dom-context-2d-putimagedata title=dom-context-2d-putImageData>putImageData</a>(<a href=#imagedata>ImageData</a> imagedata, double dx, double dy, double dirtyX, double dirtyY, double dirtyWidth, double dirtyHeight);
};
<a href=#canvasrenderingcontext2d>CanvasRenderingContext2D</a> implements <a href=#canvastransformation>CanvasTransformation</a>;

[NoInterfaceObject]
interface <dfn id=canvastransformation>CanvasTransformation</dfn> {
// transformations (default transform is the identity matrix)
void <a href=#dom-context-2d-scale title=dom-context-2d-scale>scale</a>(double x, double y);
void <a href=#dom-context-2d-rotate title=dom-context-2d-rotate>rotate</a>(double angle);
void <a href=#dom-context-2d-translate title=dom-context-2d-translate>translate</a>(double x, double y);
void <a href=#dom-context-2d-transform title=dom-context-2d-transform>transform</a>(double a, double b, double c, double d, double e, double f);
void <a href=#dom-context-2d-settransform title=dom-context-2d-setTransform>setTransform</a>(double a, double b, double c, double d, double e, double f);
<!--
// v7 we've also received requests (though not many so far) for:
void skew(...); // is this common enough that one can't just use setTransform()?
void reflect(...); and void mirror(...); // aren't negative values in scale() sufficient for these?
-->
};

interface <dfn id=canvasgradient>CanvasGradient</dfn> {
// opaque object
Expand Down Expand Up @@ -34999,8 +35005,8 @@ interface <dfn id=imagedata>ImageData</dfn> {
context paints on.</p>

<p>Except where otherwise specified, for the 2D context interface,
any method call with a numeric argument whose value is infinite or a
NaN value must be ignored.</p>
<strong>any method call with a numeric argument whose value is
infinite or a NaN value must be ignored</strong>.</p>

<!--
Philip Taylor wrote:
Expand Down Expand Up @@ -35112,16 +35118,19 @@ idea from Mihai:

<div class=impl>

<p>When the context is created, the transformation matrix must
initially be the identity transform. It may then be adjusted using
the transformation methods.</p>
<p>Any object that implements the <code><a href=#canvastransformation>CanvasTransformation</a></code>
interface has a <i>current transformation matrix</i>. When such an
object is created, its transformation matrix must be initialized to
the identity transform. It may then be adjusted using the
transformation methods described in this section.</p>

<p>The transformations must be performed in reverse order.</p>

<p>The transformations must be performed in reverse order. For
instance, if a scale transformation that doubles the width is
applied, followed by a rotation transformation that rotates drawing
operations by a quarter turn, and a rectangle twice as wide as it is
tall is then drawn on the canvas, the actual result will be a
square.</p>
<p class=note>For instance, if a scale transformation that doubles
the width is applied to the canvas, followed by a rotation
transformation that rotates drawing operations by a quarter turn,
and a rectangle twice as wide as it is tall is then drawn on the
canvas, the actual result will be a square.</p>
<!-- q.v. http://goo.gl/5RLrN -->

</div>
Expand Down
53 changes: 31 additions & 22 deletions source
Expand Up @@ -40554,17 +40554,7 @@ dictionary <dfn>TrackEventInit</dfn> : <span>EventInit</span> {
// when enabled, it would prevent the UA from falling back on lower-quality but faster rendering routines
// useful e.g. for when an image manipulation app uses <canvas> both for UI previews and the actual work
-->
// transformations (default transform is the identity matrix)
void <span title="dom-context-2d-scale">scale</span>(double x, double y);
void <span title="dom-context-2d-rotate">rotate</span>(double angle);
void <span title="dom-context-2d-translate">translate</span>(double x, double y);
void <span title="dom-context-2d-transform">transform</span>(double a, double b, double c, double d, double e, double f);
void <span title="dom-context-2d-setTransform">setTransform</span>(double a, double b, double c, double d, double e, double f);
<!--
// v7 we've also received requests (though not many so far) for:
void skew(...); // is this common enough that one can't just use setTransform()?
void reflect(...); and void mirror(...); // aren't negative values in scale() sufficient for these?
-->

// compositing
attribute double <span title="dom-context-2d-globalAlpha">globalAlpha</span>; // (default 1.0)
attribute DOMString <span title="dom-context-2d-globalCompositeOperation">globalCompositeOperation</span>; // (default source-over)
Expand Down Expand Up @@ -40641,6 +40631,22 @@ dictionary <dfn>TrackEventInit</dfn> : <span>EventInit</span> {
void <span title="dom-context-2d-putImageData">putImageData</span>(<span>ImageData</span> imagedata, double dx, double dy);
void <span title="dom-context-2d-putImageData">putImageData</span>(<span>ImageData</span> imagedata, double dx, double dy, double dirtyX, double dirtyY, double dirtyWidth, double dirtyHeight);
};
<span>CanvasRenderingContext2D</span> implements <span>CanvasTransformation</span>;

[NoInterfaceObject]
interface <dfn>CanvasTransformation</dfn> {
// transformations (default transform is the identity matrix)
void <span title="dom-context-2d-scale">scale</span>(double x, double y);
void <span title="dom-context-2d-rotate">rotate</span>(double angle);
void <span title="dom-context-2d-translate">translate</span>(double x, double y);
void <span title="dom-context-2d-transform">transform</span>(double a, double b, double c, double d, double e, double f);
void <span title="dom-context-2d-setTransform">setTransform</span>(double a, double b, double c, double d, double e, double f);
<!--
// v7 we've also received requests (though not many so far) for:
void skew(...); // is this common enough that one can't just use setTransform()?
void reflect(...); and void mirror(...); // aren't negative values in scale() sufficient for these?
-->
};

interface <dfn>CanvasGradient</dfn> {
// opaque object
Expand Down Expand Up @@ -40685,8 +40691,8 @@ interface <dfn>ImageData</dfn> {
context paints on.</p>

<p>Except where otherwise specified, for the 2D context interface,
any method call with a numeric argument whose value is infinite or a
NaN value must be ignored.</p>
<strong>any method call with a numeric argument whose value is
infinite or a NaN value must be ignored</strong>.</p>

<!--
Philip Taylor wrote:
Expand Down Expand Up @@ -40826,16 +40832,19 @@ idea from Mihai:

<div class="impl">

<p>When the context is created, the transformation matrix must
initially be the identity transform. It may then be adjusted using
the transformation methods.</p>
<p>Any object that implements the <code>CanvasTransformation</code>
interface has a <i>current transformation matrix</i>. When such an
object is created, its transformation matrix must be initialized to
the identity transform. It may then be adjusted using the
transformation methods described in this section.</p>

<p>The transformations must be performed in reverse order.</p>

<p>The transformations must be performed in reverse order. For
instance, if a scale transformation that doubles the width is
applied, followed by a rotation transformation that rotates drawing
operations by a quarter turn, and a rectangle twice as wide as it is
tall is then drawn on the canvas, the actual result will be a
square.</p>
<p class="note">For instance, if a scale transformation that doubles
the width is applied to the canvas, followed by a rotation
transformation that rotates drawing operations by a quarter turn,
and a rectangle twice as wide as it is tall is then drawn on the
canvas, the actual result will be a square.</p>
<!-- q.v. http://goo.gl/5RLrN -->

</div>
Expand Down

0 comments on commit ea35ca4

Please sign in to comment.