merged changes

Author: Rik Cabanier

css-masking-1/Overview.src.html

@@ -25,7 +25,9 @@ <h2 id='intro'>Introduction</h2>
 
 This specification defines two different graphical operations which both fully or partly hide portions of an object.
 
-The <b>first operation</b> is called clipping.
+<h3 id="clipping">Clipping</h3>
+
+The first operation is called clipping.
 
 <div class="example">
   <div class=figure>
@@ -40,7 +42,9 @@ <h2 id='intro'>Introduction</h2>
 
 The 'clip-path' property can reference SVG <a>graphics element</a> or use specified basic shapes as clipping path.
 
-The <b>second operation</b> is called masking.
+<h3 id="masking">Masking</h3>
+
+The second operation is called masking.
 
 <div class="example">
   <div class=figure>
@@ -51,11 +55,11 @@ <h2 id='intro'>Introduction</h2>
   </div>
 </div>
 
-The effect of applying a mask is as if the mask images or <i>mask sources</i> are rendered into an off-screen image which has been initialized to transparent black. The graphical object to which the mask is applied will be painted onto the background through the mask, thus completely or partially masking out parts of the graphical object.
+The effect of applying a mask to a graphical object is as if the graphical object to which the mask is applied will be painted onto the background through the mask, thus completely or partially masking out parts of the graphical object.
 
 Masks are applied using the 'mask-image' or 'mask-box-image-source' properties.
 
-The 'mask-image' property may reference a <a>'mask element'</a> as the mask source. Alternatively, for many simple uses, the 'mask-image' property may refer directly to images to be used as mask, forgoing the need for an explicit <a>'mask element'</a> element. The 'mask' property serves as a shorthand property for 'mask-box-image', 'mask-image' and other characterizing properties.
+The 'mask-image' property may reference a <a>'mask'</a> element. In this case the content of the <a>'mask'</a> element is rendered into an off-screen image which has been initialized to transparent black. This off-screen image is taken as mask image. Alternatively, for many simple uses, the 'mask-image' property may refer directly to images to be used as mask image, forgoing the need for an explicit <a>'mask'</a> element. The 'mask' property serves as a shorthand property for 'mask-box-image', 'mask-image' and other characterizing properties.
 
 The 'mask-box-image-source' property splits a mask image into 9 pieces. The pieces may be sliced, scaled and stretched in various ways to fit the size of the <i>mask box image area</i>. The 'mask-box-image' property serves as a shorthand property for 'mask-box-image-source' and other characterizing properties.
 
@@ -96,10 +100,6 @@ <h2 id="terminology">Terminology</h2>
     If the element does not have an associated CSS layout box and is in the <code>http://www.w3.org/2000/svg</code> namespace, the current user coordinate system has its origin at the top-left corner of the element's nearest viewport.
   </p>
 </dd>
-<dt><dfn>mask source</dfn></dt>
-<dd>
-  An off-screen image which has been initialized to transparent black. The graphical object to which the mask is applied will be painted onto the background through the mask, thus completely or partially masking out parts of the graphical object.
-</dd>
 </dl>
 
 Definitions of CSS properties and values in this specification are analogous to definitions in CSS Backgrounds and Borders [[!CSS3BG]]. To avoid redundancy, this specification relies on descriptions and definitions of CSS Backgrounds and Borders. The following terms in CSS Backgrounds and Borders have the following meaning in this specification:
@@ -373,7 +373,7 @@ <h3 id="the-mask-image">The 'mask-image' property</h3>
 Animatable: no
 </pre>
 
-This property sets the mask image or the <i>mask source</i> of an element. Where:
+This property sets the mask image of an element. Where:
 
 <pre class=prod><dfn>&lt;mask-reference></dfn> = none | <<image>> | <<mask-source>></pre>
 
@@ -396,7 +396,7 @@ <h3 id="the-mask-image">The 'mask-image' property</h3>
 
 A mask reference that is an empty image (zero width or zero height), that fails to download, is not a reference to an <a>'mask element'</a> element, is non-existent, or that cannot be displayed (e.g. because it is not in a supported image format) is ignored. It still counts as an image layer but does not mask the element.
 
-See the section <a href="#MaskValues">“Mask source values”</a> for how to process a <<mask-source>>.
+See the section <a href="#MaskValues">“Mask processing”</a> for how to process a mask image.
 
 <div class="example">
 <p>Examples for mask references:</p>
@@ -421,7 +421,7 @@ <h3 id="the-mask-source-type">The 'mask-source-type' property</h3>
 Animatable: no
 </pre>
 
-The 'mask-source-type' property indicates whether the <<mask-reference>> is treated as luminance mask or alpha mask. (See <a href="#MaskValues">Mask Source values</a>.)
+The 'mask-source-type' property indicates whether the <<mask-reference>> is treated as luminance mask or alpha mask. (See <a href="#MaskValues">Mask processing</a>.)
 
 <pre class=prod><dfn>&lt;source-type></dfn> = alpha | luminance | auto</pre>
 
@@ -642,7 +642,7 @@ <h3 id="the-mask">The 'mask' property</h3>
 
 If one <<box>> value is present then it sets both 'mask-origin' and 'mask-clip' to that value. If two <<box>> values are present, then the first sets 'mask-origin' and the second 'mask-clip'.
 
-The <i>used value</i> of the properties 'mask-image', 'mask-repeat', 'mask-position', 'mask-clip', 'mask-origin' and 'mask-size' must have no effect if <<mask-reference>> references a <a>'mask element'</a> element. In this case the element defines position, sizing and clipping of the <i>mask source</i>.
+The <i>used value</i> of the properties 'mask-image', 'mask-repeat', 'mask-position', 'mask-clip', 'mask-origin' and 'mask-size' must have no effect if <<mask-reference>> references a <a>'mask element'</a> element. In this case the element defines position, sizing and clipping of the mask image.
 
 The 'mask' shorthand also resets 'mask-box-image' to its initial value. It is therefore recommended that authors use the 'mask' shorthand, rather than other shorthands or the individual properties, to override any mask settings earlier in the cascade. This will ensure that 'mask-box-image' has also been reset to allow the new styles to take effect.
 
@@ -654,13 +654,13 @@ <h3 id="the-mask-image-rendering-model">The Mask Image Rendering Model</h3>
 
 The 'mask-image' property has no effect on the geometry or hit-testing of any element's CSS boxes.
 
-<h4 id="MaskValues">Mask Source values</h4>
+<h4 id="MaskValues">Mask processing</h4>
 
-A mask may be interpreted using one of two different methods with regards to calculating the mask values that will be multiplied with the target alpha values.
+A mask image may be interpreted using one of two different methods with regards to calculating the mask values that will be multiplied with the target alpha values.
 
-The first and simplest method of calculating the mask values is to use the alpha channel of the mask source. In this case the mask value at a given point is simply the value of the alpha channel at that point. The color channels do not contribute to the mask value.
+The first and simplest method of calculating the mask values is to use the alpha channel of the mask image. In this case the mask value at a given point is simply the value of the alpha channel at that point. The color channels do not contribute to the mask value.
 
-The second method of calculating the mask values is to use the luminance of the mask source. In this case the mask value at a given point is computed from the color channel values and alpha channel value using the following procedure.
+The second method of calculating the mask values is to use the luminance of the mask image. In this case the mask value at a given point is computed from the color channel values and alpha channel value using the following procedure.
 
 <ol>
   <li>Compute a luminance value from the color channel values.
@@ -837,7 +837,7 @@ <h2 id="the-mask-type">The 'mask-type' property</h2>
 &lt;/p>
 </code></pre>
 
-<p>In the next example the computed value of 'mask-source-type' is <a value for=mask-source-type>alpha</a> and overrides the preference on the <a>'mask element'</a> element that is computed to <a value for=mask-type>luminance</a>. The mask source is used as an alpha mask.
+<p>In the next example the computed value of 'mask-source-type' is <a value for=mask-source-type>alpha</a> and overrides the preference on the <a>'mask element'</a> element that is computed to <a value for=mask-type>luminance</a>. The mask image is used as an alpha mask.
 
 <pre><code>
 &lt;svg>
@@ -903,7 +903,7 @@ <h3 id="the-mask-box-image-source">The 'mask-box-image-source' property</h3>
 Animatable: no
 </pre>
 
-Specifies an image to be used as mask.
+Specifies an image to be used as mask image.
 
 An image that is an empty image (zero width or zero height), that fails to download, is non-existent, or that cannot be displayed (e.g. because it is not in a supported image format) is ignored. It still counts as an mask image but does not mask the element.
 
@@ -1158,7 +1158,7 @@ <h2 class="no-num" id="changes">Changes since last publication</h2>
 <ul>
 <li>'mask' resets 'mask-box-image' properties.</li>
 <li>Initial values for 'mask-repeat', 'mask-position' and 'mask-origin' changed to ''no-repeat'', ''center'' and <a value for=mask-origin>border-box</a>.</li>
-<li>Multiple layers of <i>mask sources</i> were deferred to a future level of this specification.</li>
+<li>Multiple layers of mask images were deferred to a future level of this specification.</li>
 <li>Added security model for pixel operations and fetching of masking and clipping resources.</li>
 <li>Deferred ''child'' and select() function to next level.</li>
 </ul>