ImageBitmap: improvements to createImageBitmap transforms

* No longer exits early if no cropping specified * Cropping happens before resizing * If the crop rectangle is outside the dimensions of the original image, it's clipped, which is consistent with drawImage
whatwg · Jul 18, 2016 · 5635444 · 5635444
1 parent b5e6458
commit 5635444
Showing 1 changed file with 36 additions and 31 deletions.
diff --git a/source b/source
@@ -92455,15 +92455,32 @@ dictionary <dfn>ImageBitmapOptions</dfn> {
   <ol>
 
    <li><p>Let <var>input</var> be the <span data-x="concept-ImageBitmap-bitmap-data">bitmap
-   data</span> being cropped.</p></li>
+   data</span> being transformed.</p></li>
 
-   <li><p>If the <var>sx</var>, <var>sy</var>, <var>sw</var>, and <var>sh</var> arguments are omitted, return <var>input</var>.</p></li>
+   <li><p>If not specified, the <var>sx</var> and <var>sy</var> arguments must default to 0, and 
+   the <var>sw</var> and <var>sh</var> arguments must default to the intrinsic width and height of 
+   <var>input</var></p></li>
 
    <li><p>If either or both of <code data-x="dom-ImageBitmapOptions-resizeWidth">resizeWidth</code>
    and <code data-x="dom-ImageBitmapOptions-resizeHeight">resizeHeight</code> members of
    <var>options</var> are less than or equal to 0, then return a promise rejected with
    <span>"<code>InvalidStateError</code>"</span> <code>DOMException</code> and abort these steps.</p></li>
 
+   <li>
+
+    <p>Let <var>sourceRectangle</var> be a rectangle whose corners are the four points 
+    (<var>sx</var>, <var>sy</var>), (<var>sx</var>+<var>sw</var>, <var>sy</var>),
+    (<var>sx</var>+<var>sw</var>, <var>sy</var>+<var>sh</var>), (<var>sx</var>,
+    <var>sy</var>+<var>sh</var>)</p>
+
+    <p class="note">If either <var>sw</var> or <var>sh</var> are negative, then
+    the top-left corner of this rectangle will be to the left or above the (<var>sx</var>,
+    <var>sy</var>) point.</p>
+
+   </li>
+
+   <li><p>Clip <var>sourceRectangle</var> to the intrinsic dimensions of <var>input</var></p></li>
+
    <li>
     <p>Let <var>outputWidth</var> be determined as follows:</p>
 
@@ -92476,13 +92493,13 @@ dictionary <dfn>ImageBitmapOptions</dfn> {
      <dt>If the <code data-x="dom-ImageBitmapOptions-resizeWidth">resizeWidth</code> member of
      <var>options</var> is not specified, but the <code
      data-x="dom-ImageBitmapOptions-resizeHeight">resizeHeight</code> member is specified</dt>
-     <dd>the intrinsic width of <var>input</var> times the value of the <code
-     data-x="dom-ImageBitmapOptions-resizeHeight">resizeHeight</code> member of <var>options</var>
-     divided by the intrinsic height of <var>input</var>, rounded up to the nearest integer</dd>
+     <dd>the width of <var>sourceRectangle</var>, times the value of the <code
+     data-x="dom-ImageBitmapOptions-resizeHeight">resizeHeight</code> member of <var>options</var>,
+     divided by the height of <var>sourceRectangle</var>, rounded up to the nearest integer</dd>
 
      <dt>If neither <code data-x="dom-ImageBitmapOptions-resizeWidth">resizeWidth</code> nor <code
      data-x="dom-ImageBitmapOptions-resizeHeight">resizeHeight</code> are specified</dt>
-     <dd>the intrinsic width of <var>input</var></dd>
+     <dd>the width of <var>sourceRectangle</var></dd>
     </dl>
    </li>
 
@@ -92498,40 +92515,28 @@ dictionary <dfn>ImageBitmapOptions</dfn> {
      <dt>If the <code data-x="dom-ImageBitmapOptions-resizeHeight">resizeHeight</code> member of
      <var>options</var> is not specified, but the <code
      data-x="dom-ImageBitmapOptions-resizeWidth">resizeWidth</code> member is specified</dt>
-     <dd>the intrinsic height of <var>input</var> times the value of the <code
-     data-x="dom-ImageBitmapOptions-resizeWidth">resizeWidth</code> member of <var>options</var>
-     divided by the intrinsic width of <var>input</var>, rounded up to the nearest integer</dd>
+     <dd>the height of <var>sourceRectangle</var>, times the value of the <code
+     data-x="dom-ImageBitmapOptions-resizeWidth">resizeWidth</code> member of <var>options</var>,
+     divided by the width of <var>sourceRectangle</var>, rounded up to the nearest integer</dd>
 
      <dt>If neither <code data-x="dom-ImageBitmapOptions-resizeWidth">resizeWidth</code> nor <code
      data-x="dom-ImageBitmapOptions-resizeHeight">resizeHeight</code> are specified</dt>
-     <dd>the intrinsic height of <var>input</var></dd>
+     <dd>the height of <var>sourceRectangle</var></dd>
     </dl>
    </li>
 
-   <li><p>Scale <var>input</var> to the size specified by the <var>outputWidth</var> and the
-   <var>outputHeight</var>. The user agent should use the value of the <dfn><code
-   data-x="dom-ImageBitmapOptions-resizeQuality">resizeQuality</code></dfn> option to guide the
-   choice of scaling algorithm.</p></li>
-
    <li><p>Place <var>input</var> on an infinite transparent black grid plane, positioned
-   so that it's top left corner is at the origin of the plane, with the <var>x</var>-coordinate
-   increasing to the right, and the <var>y</var>-coordinate increasing down, and with each pixel in
-   the <var>input</var> image data occupying a cell on the plane's grid.</p></li>
+    so that it's top left corner is at the origin of the plane, with the <var>x</var>-coordinate
+    increasing to the right, and the <var>y</var>-coordinate increasing down, and with each pixel
+    in the <var>input</var> image data occupying a cell on the plane's grid.</p></li>
 
-   <li>
+   <li><p>Let <var>output</var> be the rectangle on the plane denoted by 
+   <var>sourceRectangle</var></p></li>
 
-    <p>Let <var>output</var> be the rectangle on the plane denoted by the rectangle whose
-    corners are the four points (<var>sx</var>, <var>sy</var>), (<span
-    data-x=""><var>sx</var>+<var>sw</var></span>, <var>sy</var>), (<span
-    data-x=""><var>sx</var>+<var>sw</var></span>, <span data-x=""><var>sy</var>+<var>sh</var></span>), (<var>sx</var>, <span data-x=""><var>sy</var>+<var>sh</var></span>).</p>
-
-    <p class="note">If either <var>sw</var> or <var>sh</var> are negative, then
-    the top-left corner of this rectangle will be to the left or above the (<var>sx</var>,
-    <var>sy</var>) point. If any of the pixels on this rectangle are outside the area where
-    the <var>input</var> bitmap was placed, then they will be transparent black in
-    <var>output</var>.</p>
-
-   </li>
+   <li><p>Scale <var>output</var> to the size specified by the <var>outputWidth</var> and the 
+   <var>outputHeight</var>. The user agent should use the value of the <dfn><code 
+   data-x="dom-ImageBitmapOptions-resizeQuality">resizeQuality</code></dfn> option to guide the 
+   choice of scaling algorithm.</p></li>
 
    <li>