Editorial: clean up color conversion presentation in canvas

Author: ccameron-chromium

source

@@ -66579,8 +66579,6 @@ typedef (<span>HTMLOrSVGImageElement</span> or
          <span>OffscreenCanvas</span> or
          <span>VideoFrame</span>) <dfn typedef>CanvasImageSource</dfn>;
 
-enum <dfn enum>PredefinedColorSpace</dfn> { "<span data-x="dom-PredefinedColorSpace-srgb">srgb</span>", "<span data-x="dom-PredefinedColorSpace-display-p3">display-p3</span>" };
-
 enum <dfn enum>CanvasColorType</dfn> { "<span data-x="dom-CanvasColorType-unorm8">unorm8</span>", "<span data-x="dom-CanvasColorType-float16">float16</span>" };
 
 enum <dfn enum>CanvasFillRule</dfn> { "<span data-x="dom-context-2d-fillRule-nonzero">nonzero</span>", "<span data-x="dom-context-2d-fillRule-evenodd">evenodd</span>" };
@@ -67015,22 +67013,6 @@ context.fillRect(100,0,50,50); // only this square remains</code></pre>
 
   <hr>
 
-  <p>The <code>PredefinedColorSpace</code> enumeration is used to specify the <span
-  data-x="concept-canvas-color-space">color space</span> of the canvas's backing store.</p>
-
-  <p>The "<dfn enum-value for="PredefinedColorSpace"><code
-  data-x="dom-PredefinedColorSpace-srgb">srgb</code></dfn>" value indicates the <span>'srgb'</span>
-  color space.</p>
-
-  <p>The "<dfn enum-value for="PredefinedColorSpace"><code
-  data-x="dom-PredefinedColorSpace-display-p3">display-p3</code></dfn>" value indicates the
-  <span>'display-p3'</span> color space.</p>
-
-  <p class="note">The algorithm for converting between color spaces can be found in the
-  <span>Converting Colors</span> section of <cite>CSS Color</cite>. <ref>CSSCOLOR</ref></p>
-
-  <hr>
-
   <p>The <code>CanvasColorType</code> enumeration is used to specify the <span
   data-x="concept-canvas-color-type">color type</span> of the canvas's backing store.</p>
 
@@ -70004,8 +69986,11 @@ try {
 
   <p id="interpolation">Once a gradient has been created (see below), stops are placed along it to
   define how the colors are distributed along the gradient. <span w-nodev>The color of the
-  gradient at each stop is the color specified for that stop. Between each such stop, the colors and
-  the alpha component must be linearly interpolated over the RGBA space without premultiplying the
+  gradient at each stop is the color specified for that stop, <span
+  data-x="Converting Colors">converted</span> to the <span
+  data-x="concept-canvas-color-space">context's color space</span>. Between each such stop, the
+  colors and the alpha component must be linearly interpolated in the <span
+  data-x="concept-canvas-color-space">context's color space</span> without premultiplying the
   alpha value to find the color to use at that offset. Before the first stop, the color must be the
   color of the first stop. After the last stop, the color must be the color of the last stop. When
   there are no stops, the gradient is <span>transparent black</span>.</span></p>
@@ -71900,6 +71885,17 @@ console.log(pixels.data[2]);
    and line styles must be honored, and the stroke must itself also be subjected to the current
    transformation matrix.</p></li>
 
+   <li>
+    <p>Convert the image <var>A</var> to the <span data-x="concept-canvas-color-space">context's
+    color space</span>.</p>
+
+    <p class="note">There do not exist any inputs to a 2D context for which the color space is
+    undefined. The color space for CSS colors is defined in <cite>CSS Color</cite>. The color space
+    for images that specify no color profile information is <span>'srgb'</span>, as
+    specified in the <a href="https://drafts.csswg.org/css-color/#untagged">Color Spaces of Untagged
+    Colors</a> section of <cite>CSS Color</cite>. <ref>CSSCOLOR</ref></p>
+   </li>
+
    <li><p>Multiply the alpha component of every pixel in <var>A</var> by <code
    data-x="concept-canvas-global-alpha">global alpha</code>.</p></li>
 
@@ -72940,28 +72936,27 @@ interface <dfn interface>OffscreenCanvasRenderingContext2D</dfn> {
   <!--en-GB--><h5 id="colour-spaces-and-colour-correction">Color spaces and color space
   conversion</h5>
 
-  <p>The <code>canvas</code> APIs provide mechanisms for specifying the color space of the canvas's
-  backing store. The default backing store color space for all canvas APIs is
-  <span>'srgb'</span>.</p>
+  <pre><code class="idl">enum <dfn enum>PredefinedColorSpace</dfn> { "<span data-x="dom-PredefinedColorSpace-srgb">srgb</span>", "<span data-x="dom-PredefinedColorSpace-display-p3">display-p3</span>" };</code></pre>
+
+  <p>The <code>PredefinedColorSpace</code> enumeration is used to specify the <span
+  data-x="concept-canvas-color-space">color space</span> of the canvas's backing store.</p>
+
+  <p>The "<dfn enum-value for="PredefinedColorSpace"><code
+  data-x="dom-PredefinedColorSpace-srgb">srgb</code></dfn>" value indicates the <span>'srgb'</span>
+  color space.</p>
+
+  <p>The "<dfn enum-value for="PredefinedColorSpace"><code
+  data-x="dom-PredefinedColorSpace-display-p3">display-p3</code></dfn>" value indicates the
+  <span>'display-p3'</span> color space.</p>
 
   <p><span data-x="Converting Colors">Color space conversion</span> must be applied to the canvas's
-  backing store when rendering the canvas to the output device. This color space conversion must be
+  backing store when rendering the canvas to the output device.</p>
+
+  <p class="note">The algorithm for converting between color spaces can be found in the
+  <span>Converting Colors</span> section of <cite>CSS Color</cite>. This color space conversion is
   identical to the color space conversion that would be applied to an <code>img</code> element with
   a color profile that specifies the same <span data-x="concept-canvas-color-space">color
-  space</span> as the canvas's backing store.</p>
-
-  <p>When drawing content to a 2D context, all inputs must be <span data-x="Converting
-  Colors">converted</span> to the <span data-x="concept-canvas-color-space">context's color
-  space</span> before drawing. Interpolation of gradient color stops must be performed on color
-  values after conversion to the <span data-x="concept-canvas-color-space">context's color
-  space</span>. Alpha blending must be performed on values after conversion to the <span
-  data-x="concept-canvas-color-space">context's color space</span>.</p>
-
-  <p class="note">There do not exist any inputs to a 2D context for which the color space is
-  undefined. The color space for CSS colors is defined in <cite>CSS Color</cite>. The color space
-  for images that specify no color profile information is assumed to be <span>'srgb'</span>, as
-  specified in the <a href="https://drafts.csswg.org/css-color/#untagged">Color Spaces of Untagged
-  Colors</a> section of <cite>CSS Color</cite>. <ref>CSSCOLOR</ref></p>
+  space</span> as the canvas's backing store. <ref>CSSCOLOR</ref></p>
 
   </div>