[html5] r8620 - [giow] (2) Remove the 'stable state' logic from the 'pause' algorithm. Also, rem [...]
whatwg at whatwg.org
whatwg at whatwg.org
Thu May 8 11:12:33 PDT 2014
Author: ianh
Date: 2014-05-08 11:12:30 -0700 (Thu, 08 May 2014)
New Revision: 8620
Modified:
complete.html
index
source
Log:
[giow] (2) Remove the 'stable state' logic from the 'pause' algorithm. Also, remove some examples that may soon become irrelevant.
Affected topics: DOM APIs, HTML, HTML Syntax and Parsing
Modified: complete.html
===================================================================
--- complete.html 2014-05-08 17:50:12 UTC (rev 8619)
+++ complete.html 2014-05-08 18:12:30 UTC (rev 8620)
@@ -591,8 +591,7 @@
<li><a href=#an-image-not-intended-for-the-user><span class=secno>4.7.1.1.11 </span>An image not intended for the user</a></li>
<li><a href=#an-image-in-an-e-mail-or-private-document-intended-for-a-specific-person-who-is-known-to-be-able-to-view-images><span class=secno>4.7.1.1.12 </span>An image in an e-mail or private document intended for a specific person who is known to be able to view images</a></li>
<li><a href=#guidance-for-markup-generators><span class=secno>4.7.1.1.13 </span>Guidance for markup generators</a></li>
- <li><a href=#guidance-for-conformance-checkers><span class=secno>4.7.1.1.14 </span>Guidance for conformance checkers</a></ol></li>
- <li><a href=#adaptive-images><span class=secno>4.7.1.2 </span>Adaptive images</a></ol></li>
+ <li><a href=#guidance-for-conformance-checkers><span class=secno>4.7.1.1.14 </span>Guidance for conformance checkers</a></ol></ol></li>
<li><a href=#the-iframe-element><span class=secno>4.7.2 </span>The <code>iframe</code> element</a></li>
<li><a href=#the-embed-element><span class=secno>4.7.3 </span>The <code>embed</code> element</a></li>
<li><a href=#the-object-element><span class=secno>4.7.4 </span>The <code>object</code> element</a></li>
@@ -22700,97 +22699,8 @@
</ul></div>
- <h5 id=adaptive-images><span class=secno>4.7.1.2 </span>Adaptive images</h5>
- <p><i>This section is non-normative.</i></p>
- <p>CSS and media queries can be used to construct graphical page layouts that adapt dynamically to
- the user's environment, in particular to different viewport dimensions and pixel densities. For
- content, however, CSS does not help; instead, we have the <code><a href=#the-img-element>img</a></code> element's <code title=attr-img-srcset><a href=#attr-img-srcset>srcset</a></code> attribute. This section walks through a sample case showing
- how to use this attribute.</p>
-
- <p>Consider a situation where on wide screens (wider than 600 CSS pixels) a 300×150 image
- named <code title="">a-rectangle.png</code> is to be used, but on smaller screens (600 CSS pixels
- and less), a smaller 100×100 image called <code title="">a-square.png</code> is to be used.
- The markup for this would look like this:</p>
-
- <pre><figure>
- <img src="a-rectangle.png" srcset="a-square.png 600w"
- alt="Barney Frank wears a suit and glasses.">
- <figcaption>Barney Frank, 2011</figcaption>
-</figure></pre>
-
- <p class=note>For details on what to put in the <code title=attr-img-alt><a href=#attr-img-alt>alt</a></code> attribute,
- see the earlier sections.</p>
-
- <p>The problem with this is that the user agent does not necessarily know what dimensions to use
- for the image when the image is loading. To avoid the layout having to be reflowed multiple times
- as the page is loading, CSS and CSS media queries can be used to provide the dimensions:</p>
-
- <pre><figure>
- <style scoped>
- #a { width: 300px; height: 150px; }
- @media all and (max-width: 600px) { #a { width: 100px; height: 100px; } }
- </style>
- <img src="a-rectangle.png" srcset="a-square.png 600w" id="a"
- alt="Barney Frank wears a suit and glasses.">
- <figcaption>Barney Frank, 2011</figcaption>
-</figure></pre>
-
- <p>Alternatively, the <code title=attr-dim-width><a href=#attr-dim-width>width</a></code> and <code title=attr-dim-height><a href=#attr-dim-height>height</a></code> attributes can be used to provide the width for legacy user
- agents, using CSS just for the user agents that support <code title=attr-img-srcset><a href=#attr-img-srcset>srcset</a></code>:</p>
-
- <pre><figure>
- <style scoped media="all and (max-width: 600px)">
- #a { width: 100px; height: 100px; }
- </style>
- <img src="a-rectangle.png" width="300" height="100"
- srcset="a-square.png 600w" id=a
- alt="Barney Frank wears a suit and glasses.">
- <figcaption>Barney Frank, 2011</figcaption>
-</figure></pre>
-
- <hr><p>The <code title=attr-img-srcset><a href=#attr-img-srcset>srcset</a></code> attribute is used with the <code title=attr-img-src><a href=#attr-img-src>src</a></code> attribute, which gives the URL of the image to use for legacy user
- agents that do not support the <code title=attr-img-srcset><a href=#attr-img-srcset>srcset</a></code> attribute. This leads
- to a question of which image to provide in the <code title=attr-img-src><a href=#attr-img-src>src</a></code>
- attribute.</p>
-
- <p>The answer that results in the least duplication is to provide the image suitable for an
- infinite width and infinite height viewport with a pixel density of 1 CSS pixel per device
- pixel:</p>
-
- <pre><img src="pear-desktop.jpeg" srcset="pear-mobile.jpeg 720w, pear-tablet.jpeg 1280w"
- alt="The pear is juicy."></pre>
-
- <p>However, if legacy mobile user agents are more important, one can list all three images in the
- <code title=attr-img-srcset><a href=#attr-img-srcset>srcset</a></code> attribute, overriding the <code title=attr-img-src><a href=#attr-img-src>src</a></code> attribute entirely. To do this, the widest image has to have the
- pixel density descriptor instead of the width, since there is no way to specify an infinite width
- explicitly:</p>
-
- <pre><img src="pear-mobile.jpeg"
- srcset="pear-mobile.jpeg 720w, pear-tablet.jpeg 1280w, pear-desktop.jpeg 1x"
- alt="The pear is juicy."></pre>
-
- <p>Since at this point the <code title=attr-img-src><a href=#attr-img-src>src</a></code> attribute is actually being
- ignored entirely by <code title=attr-img-srcset><a href=#attr-img-srcset>srcset</a></code>-supporting user agents, the <code title=attr-img-src><a href=#attr-img-src>src</a></code> attribute can default to any image, including one that is neither
- the smallest nor biggest:</p>
-
- <pre><img src="pear-tablet.jpeg"
- srcset="pear-mobile.jpeg 720w, pear-tablet.jpeg 1280w, pear-desktop.jpeg 1x"
- alt="The pear is juicy."></pre>
-
- <hr><p>The dimensions in the <code title=attr-img-srcset><a href=#attr-img-srcset>srcset</a></code> attribute are the maximum
- (viewport) dimensions that an image is intended for. It is possible to think of the numbers as
- minimums, though... if the images are listed in order, then the minimum for an image is the
- dimension given for the previous image. This example attempts to demonstrate this by using the
- file names to show the minimum values for each image:</p>
-
- <pre><img src="pear-tablet.jpeg"
- srcset="pear-min0.jpeg 720w, pear-min721.jpeg 1280w, pear-min1281.jpeg 1x"
- alt="The pear is juicy."></pre>
-
-
-
<h4 id=the-iframe-element><span class=secno>4.7.2 </span>The <dfn><code>iframe</code></dfn> element</h4>
<dl class=element><dt><a href=#element-dfn-categories title=element-dfn-categories>Categories</a>:</dt>
@@ -72715,9 +72625,7 @@
</ol><hr><p>Some of the algorithms in this specification, for historical reasons, require the user agent to
<dfn id=pause>pause</dfn> while running a <a href=#concept-task title=concept-task>task</a> until a condition <var title="">goal</var> is met. This means running the following steps:</p>
- <ol><li><p><a href=#provide-a-stable-state>Provide a stable state</a>.</li>
-
- <li><p>If necessary, update the rendering or user interface of any <code><a href=#document>Document</a></code> or
+ <ol><li><p>If necessary, update the rendering or user interface of any <code><a href=#document>Document</a></code> or
<a href=#browsing-context>browsing context</a> to reflect the current state.</li>
<li><p>Wait until the condition <var title="">goal</var> is met. While a user agent has a paused
@@ -74445,8 +74353,11 @@
</dd>
- </dl><div class=impl>
+ </dl><p class=note>Logic that depends on <a href=#concept-task title=concept-task>tasks</a> or <a href=#microtask title=microtask>microtasks</a>, such as <a href=#media-element title="media element">media elements</a>
+ loading their <a href=#media-data>media data</a>, are stalled when these methods are invoked.</p>
+ <div class=impl>
+
<p>The <dfn id=dom-alert title=dom-alert><code>alert(<var title="">message</var>)</code></dfn> method, when
invoked, must run the following steps:</p>
Modified: index
===================================================================
--- index 2014-05-08 17:50:12 UTC (rev 8619)
+++ index 2014-05-08 18:12:30 UTC (rev 8620)
@@ -591,8 +591,7 @@
<li><a href=#an-image-not-intended-for-the-user><span class=secno>4.7.1.1.11 </span>An image not intended for the user</a></li>
<li><a href=#an-image-in-an-e-mail-or-private-document-intended-for-a-specific-person-who-is-known-to-be-able-to-view-images><span class=secno>4.7.1.1.12 </span>An image in an e-mail or private document intended for a specific person who is known to be able to view images</a></li>
<li><a href=#guidance-for-markup-generators><span class=secno>4.7.1.1.13 </span>Guidance for markup generators</a></li>
- <li><a href=#guidance-for-conformance-checkers><span class=secno>4.7.1.1.14 </span>Guidance for conformance checkers</a></ol></li>
- <li><a href=#adaptive-images><span class=secno>4.7.1.2 </span>Adaptive images</a></ol></li>
+ <li><a href=#guidance-for-conformance-checkers><span class=secno>4.7.1.1.14 </span>Guidance for conformance checkers</a></ol></ol></li>
<li><a href=#the-iframe-element><span class=secno>4.7.2 </span>The <code>iframe</code> element</a></li>
<li><a href=#the-embed-element><span class=secno>4.7.3 </span>The <code>embed</code> element</a></li>
<li><a href=#the-object-element><span class=secno>4.7.4 </span>The <code>object</code> element</a></li>
@@ -22700,97 +22699,8 @@
</ul></div>
- <h5 id=adaptive-images><span class=secno>4.7.1.2 </span>Adaptive images</h5>
- <p><i>This section is non-normative.</i></p>
- <p>CSS and media queries can be used to construct graphical page layouts that adapt dynamically to
- the user's environment, in particular to different viewport dimensions and pixel densities. For
- content, however, CSS does not help; instead, we have the <code><a href=#the-img-element>img</a></code> element's <code title=attr-img-srcset><a href=#attr-img-srcset>srcset</a></code> attribute. This section walks through a sample case showing
- how to use this attribute.</p>
-
- <p>Consider a situation where on wide screens (wider than 600 CSS pixels) a 300×150 image
- named <code title="">a-rectangle.png</code> is to be used, but on smaller screens (600 CSS pixels
- and less), a smaller 100×100 image called <code title="">a-square.png</code> is to be used.
- The markup for this would look like this:</p>
-
- <pre><figure>
- <img src="a-rectangle.png" srcset="a-square.png 600w"
- alt="Barney Frank wears a suit and glasses.">
- <figcaption>Barney Frank, 2011</figcaption>
-</figure></pre>
-
- <p class=note>For details on what to put in the <code title=attr-img-alt><a href=#attr-img-alt>alt</a></code> attribute,
- see the earlier sections.</p>
-
- <p>The problem with this is that the user agent does not necessarily know what dimensions to use
- for the image when the image is loading. To avoid the layout having to be reflowed multiple times
- as the page is loading, CSS and CSS media queries can be used to provide the dimensions:</p>
-
- <pre><figure>
- <style scoped>
- #a { width: 300px; height: 150px; }
- @media all and (max-width: 600px) { #a { width: 100px; height: 100px; } }
- </style>
- <img src="a-rectangle.png" srcset="a-square.png 600w" id="a"
- alt="Barney Frank wears a suit and glasses.">
- <figcaption>Barney Frank, 2011</figcaption>
-</figure></pre>
-
- <p>Alternatively, the <code title=attr-dim-width><a href=#attr-dim-width>width</a></code> and <code title=attr-dim-height><a href=#attr-dim-height>height</a></code> attributes can be used to provide the width for legacy user
- agents, using CSS just for the user agents that support <code title=attr-img-srcset><a href=#attr-img-srcset>srcset</a></code>:</p>
-
- <pre><figure>
- <style scoped media="all and (max-width: 600px)">
- #a { width: 100px; height: 100px; }
- </style>
- <img src="a-rectangle.png" width="300" height="100"
- srcset="a-square.png 600w" id=a
- alt="Barney Frank wears a suit and glasses.">
- <figcaption>Barney Frank, 2011</figcaption>
-</figure></pre>
-
- <hr><p>The <code title=attr-img-srcset><a href=#attr-img-srcset>srcset</a></code> attribute is used with the <code title=attr-img-src><a href=#attr-img-src>src</a></code> attribute, which gives the URL of the image to use for legacy user
- agents that do not support the <code title=attr-img-srcset><a href=#attr-img-srcset>srcset</a></code> attribute. This leads
- to a question of which image to provide in the <code title=attr-img-src><a href=#attr-img-src>src</a></code>
- attribute.</p>
-
- <p>The answer that results in the least duplication is to provide the image suitable for an
- infinite width and infinite height viewport with a pixel density of 1 CSS pixel per device
- pixel:</p>
-
- <pre><img src="pear-desktop.jpeg" srcset="pear-mobile.jpeg 720w, pear-tablet.jpeg 1280w"
- alt="The pear is juicy."></pre>
-
- <p>However, if legacy mobile user agents are more important, one can list all three images in the
- <code title=attr-img-srcset><a href=#attr-img-srcset>srcset</a></code> attribute, overriding the <code title=attr-img-src><a href=#attr-img-src>src</a></code> attribute entirely. To do this, the widest image has to have the
- pixel density descriptor instead of the width, since there is no way to specify an infinite width
- explicitly:</p>
-
- <pre><img src="pear-mobile.jpeg"
- srcset="pear-mobile.jpeg 720w, pear-tablet.jpeg 1280w, pear-desktop.jpeg 1x"
- alt="The pear is juicy."></pre>
-
- <p>Since at this point the <code title=attr-img-src><a href=#attr-img-src>src</a></code> attribute is actually being
- ignored entirely by <code title=attr-img-srcset><a href=#attr-img-srcset>srcset</a></code>-supporting user agents, the <code title=attr-img-src><a href=#attr-img-src>src</a></code> attribute can default to any image, including one that is neither
- the smallest nor biggest:</p>
-
- <pre><img src="pear-tablet.jpeg"
- srcset="pear-mobile.jpeg 720w, pear-tablet.jpeg 1280w, pear-desktop.jpeg 1x"
- alt="The pear is juicy."></pre>
-
- <hr><p>The dimensions in the <code title=attr-img-srcset><a href=#attr-img-srcset>srcset</a></code> attribute are the maximum
- (viewport) dimensions that an image is intended for. It is possible to think of the numbers as
- minimums, though... if the images are listed in order, then the minimum for an image is the
- dimension given for the previous image. This example attempts to demonstrate this by using the
- file names to show the minimum values for each image:</p>
-
- <pre><img src="pear-tablet.jpeg"
- srcset="pear-min0.jpeg 720w, pear-min721.jpeg 1280w, pear-min1281.jpeg 1x"
- alt="The pear is juicy."></pre>
-
-
-
<h4 id=the-iframe-element><span class=secno>4.7.2 </span>The <dfn><code>iframe</code></dfn> element</h4>
<dl class=element><dt><a href=#element-dfn-categories title=element-dfn-categories>Categories</a>:</dt>
@@ -72715,9 +72625,7 @@
</ol><hr><p>Some of the algorithms in this specification, for historical reasons, require the user agent to
<dfn id=pause>pause</dfn> while running a <a href=#concept-task title=concept-task>task</a> until a condition <var title="">goal</var> is met. This means running the following steps:</p>
- <ol><li><p><a href=#provide-a-stable-state>Provide a stable state</a>.</li>
-
- <li><p>If necessary, update the rendering or user interface of any <code><a href=#document>Document</a></code> or
+ <ol><li><p>If necessary, update the rendering or user interface of any <code><a href=#document>Document</a></code> or
<a href=#browsing-context>browsing context</a> to reflect the current state.</li>
<li><p>Wait until the condition <var title="">goal</var> is met. While a user agent has a paused
@@ -74445,8 +74353,11 @@
</dd>
- </dl><div class=impl>
+ </dl><p class=note>Logic that depends on <a href=#concept-task title=concept-task>tasks</a> or <a href=#microtask title=microtask>microtasks</a>, such as <a href=#media-element title="media element">media elements</a>
+ loading their <a href=#media-data>media data</a>, are stalled when these methods are invoked.</p>
+ <div class=impl>
+
<p>The <dfn id=dom-alert title=dom-alert><code>alert(<var title="">message</var>)</code></dfn> method, when
invoked, must run the following steps:</p>
Modified: source
===================================================================
--- source 2014-05-08 17:50:12 UTC (rev 8619)
+++ source 2014-05-08 18:12:30 UTC (rev 8620)
@@ -22578,6 +22578,8 @@
</div>
+<!--END complete-->
+<!-- the examples in this section should be rewritten to use <picture> once we have that done -->
<h5>Adaptive images</h5>
<!--END dev-html--><p><i>This section is non-normative.</i></p><!--START dev-html-->
@@ -22676,9 +22678,9 @@
<pre><img src="pear-tablet.jpeg"
srcset="pear-min0.jpeg 720w, pear-min721.jpeg 1280w, pear-min1281.jpeg 1x"
alt="The pear is juicy."></pre>
+<!--START complete-->
-
<h4>The <dfn><code>iframe</code></dfn> element</h4>
<dl class="element">
@@ -80020,8 +80022,6 @@
<ol>
- <li><p><span>Provide a stable state</span>.</p></li>
-
<li><p>If necessary, update the rendering or user interface of any <code>Document</code> or
<span>browsing context</span> to reflect the current state.</p></li>
@@ -82005,6 +82005,10 @@
</dl>
+ <p class="note">Logic that depends on <span data-x="concept-task">tasks</span> or <span
+ data-x="microtask">microtasks</span>, such as <span data-x="media element">media elements</span>
+ loading their <span>media data</span>, are stalled when these methods are invoked.</p>
+
<div class="impl">
<p>The <dfn data-x="dom-alert"><code>alert(<var data-x="">message</var>)</code></dfn> method, when
More information about the Commit-Watchers
mailing list