- From: poot <cvsmail@w3.org>
- Date: Tue, 5 Jan 2010 08:38:27 +0900 (JST)
- To: public-html-diffs@w3.org
hixie: Remove the magic for <progress> and <meter>. (whatwg r4458) http://dev.w3.org/cvsweb/html5/spec/Overview.html?r1=1.3557&r2=1.3558&f=h http://html5.org/tools/web-apps-tracker?from=4457&to=4458 =================================================================== RCS file: /sources/public/html5/spec/Overview.html,v retrieving revision 1.3557 retrieving revision 1.3558 diff -u -d -r1.3557 -r1.3558 --- Overview.html 4 Jan 2010 11:27:14 -0000 1.3557 +++ Overview.html 4 Jan 2010 23:38:10 -0000 1.3558 @@ -411,10 +411,9 @@ <li><a href="#non-negative-integers"><span class="secno">2.4.4.1 </span>Non-negative integers</a></li> <li><a href="#signed-integers"><span class="secno">2.4.4.2 </span>Signed integers</a></li> <li><a href="#real-numbers"><span class="secno">2.4.4.3 </span>Real numbers</a></li> - <li><a href="#ratios"><span class="secno">2.4.4.4 </span>Ratios</a></li> - <li><a href="#percentages-and-dimensions"><span class="secno">2.4.4.5 </span>Percentages and lengths</a></li> - <li><a href="#lists-of-integers"><span class="secno">2.4.4.6 </span>Lists of integers</a></li> - <li><a href="#lists-of-dimensions"><span class="secno">2.4.4.7 </span>Lists of dimensions</a></ol></li> + <li><a href="#percentages-and-dimensions"><span class="secno">2.4.4.4 </span>Percentages and lengths</a></li> + <li><a href="#lists-of-integers"><span class="secno">2.4.4.5 </span>Lists of integers</a></li> + <li><a href="#lists-of-dimensions"><span class="secno">2.4.4.6 </span>Lists of dimensions</a></ol></li> <li><a href="#dates-and-times"><span class="secno">2.4.5 </span>Dates and times</a> <ol> <li><a href="#months"><span class="secno">2.4.5.1 </span>Months</a></li> @@ -2630,117 +2629,8 @@ <li><p>Return <var title="">rounded-value</var>.</li> - </ol></div><h5 id="ratios"><span class="secno">2.4.4.4 </span>Ratios</h5><p class="XXX annotation"><b>Status: </b><i>Last call for comments</i><p class="note">The algorithms described in this section are used by - the <code><a href="#the-progress-element">progress</a></code> and <code><a href="#the-meter-element">meter</a></code> elements.<p>A <dfn id="valid-denominator-punctuation-character">valid denominator punctuation character</dfn> is one of - the characters from the table below. There is <dfn id="values-associated-with-denominator-punctuation-characters" title="values - associated with denominator punctuation characters">a value - associated with each denominator punctuation character</dfn>, as - shown in the table below.<table><thead><tr><th colspan="2">Denominator Punctuation Character</th> - <th>Value</th> - <tbody><tr><td>U+0025 PERCENT SIGN</td> - <td>%</td> - <td>100</td> - <tr><td>U+066A ARABIC PERCENT SIGN</td> - <td>٪</td> - <td>100</td> - <tr><td>U+FE6A SMALL PERCENT SIGN</td> - <td>﹪</td> - <td>100</td> - <tr><td>U+FF05 FULLWIDTH PERCENT SIGN</td> - <td>%</td> - <td>100</td> - <tr><td>U+2030 PER MILLE SIGN</td> - <td>‰</td> - <td>1000</td> - <tr><td>U+2031 PER TEN THOUSAND SIGN</td> - <td>‱</td> - <td>10000</td> - </table><div class="impl"> - - <p>The <dfn id="steps-for-finding-one-or-two-numbers-of-a-ratio-in-a-string">steps for finding one or two numbers of a ratio in a - string</dfn> are as given in the following algorithm. This algorithm - will return either a number, or a number and a denominator - character, or two numbers, or nothing.</p> - - <ol><li><p>Let <var title="">input</var> be the string being - parsed.</li> - - <li><p>Let <var title="">position</var> be a pointer into <var title="">input</var>, initially pointing at the start of the - string.</li> - - <li><p>If <var title="">position</var> is past the end of <var title="">input</var>, then return nothing and abort these - steps.</li> - - <li><p><a href="#find-a-number">Find a number</a> in the string according to the - algorithm below. If this returns a number, let <var title="">number1</var> be that number. Otherwise, if it returned - nothing or returned an error condition, return nothing and abort - these steps.</li> - - <li><p><a href="#skip-white_space-characters">Skip White_Space characters</a>.</li> - - <li><p>If the character indicated by <var title="">position</var> - (if any) is a <a href="#valid-denominator-punctuation-character">valid denominator punctuation character</a>, - let <var title="">denominator</var> be that character. Otherwise, - <var title="">denominator</var> has no value.</li> - - <li><p>If there are any characters in the range U+0030 DIGIT ZERO - (0) to U+0039 DIGIT NINE (9) in <var title="">input</var> at or - after the character indicated by <var title="">position</var> (if - any), but <var title="">denominator</var> has a value, return - nothing and abort these steps.</li> - - <li><p>Otherwise, if <var title="">denominator</var> has a value, - return <var title="">number1</var> and <var title="">denominator</var> and abort these steps.</li> - - <li><p><a href="#find-a-number">Find a number</a> in the string again. If this - returns a number, let <var title="">number2</var> be that - number. Otherwise, if it returned nothing or an error condition, - return <var title="">number1</var> and abort these steps.</li> - - <li><p><a href="#skip-white_space-characters">Skip White_Space characters</a>.</li> - - <li><p>If the character indicated by <var title="">position</var> - (if any) is a <a href="#valid-denominator-punctuation-character">valid denominator punctuation character</a>, - return nothing and abort these steps.</li> - - <li><p>If there are any characters in the range U+0030 DIGIT ZERO - (0) to U+0039 DIGIT NINE (9) in <var title="">input</var> at or - after the character indicated by <var title="">position</var> (if - any), return nothing and abort these steps.</li> - - <li>Otherwise, return <var title="">number1</var> and - <var title="">number2</var>.</li> - - </ol><p>The algorithm to <dfn id="find-a-number">find a number</dfn> is as follows. It - returns either nothing, a number, or an error condition.</p> - - <ol><li><p>Let <var title="">input</var> and <var title="">position</var> be the same variables as those of the same - name in the algorithm that invoked these steps.</li> - - <li><p><a href="#collect-a-sequence-of-characters">Collect a sequence of characters</a> that are not - U+002E FULL STOP characters (.) and are not characters in the range - U+0030 DIGIT ZERO (0) to U+0039 DIGIT NINE (9).</li> - - <li><p>If <var title="">position</var> is past the end of <var title="">input</var>, then return nothing and abort these - steps.</li> - - <li><p><a href="#collect-a-sequence-of-characters">Collect a sequence of characters</a> that are - either U+002E FULL STOP characters (.) or characters in the range - U+0030 DIGIT ZERO (0) to U+0039 DIGIT NINE (9), and let that be - <var title="">s</var>.</li> - - <li><p>If the first character or the last character of <var title="">s</var> is a U+002E FULL STOP character (.), or if <var title="">s</var> contains more than one U+002E FULL STOP character - (.), then return an error condition and abort these steps.</li> - - <li><p>Parse <var title="">s</var> according to the <a href="#rules-for-parsing-floating-point-number-values">rules for - parsing floating point number values</a>, to obtain <var title="">number</var>. This step cannot fail (<var title="">s</var> - is guaranteed to be a <a href="#valid-floating-point-number">valid floating point - number</a>).</li> - - <li>Return <var title="">number</var>.</li> - </ol></div><div class="impl"> - <h5 id="percentages-and-dimensions"><span class="secno">2.4.4.5 </span>Percentages and lengths</h5><p class="XXX annotation"><b>Status: </b><i>Last call for comments</i></p> + <h5 id="percentages-and-dimensions"><span class="secno">2.4.4.4 </span>Percentages and lengths</h5><p class="XXX annotation"><b>Status: </b><i>Last call for comments</i></p> <!--(percentages are not used in valid html anymore) <p>A string is a <dfn>valid dimension value</dfn> if it consists of a character in the range U+0031 DIGIT ONE (1) to U+0039 DIGIT NINE @@ -2840,7 +2730,7 @@ <li><p>Return <var title="">value</var> as a length.</li> - </ol></div><h5 id="lists-of-integers"><span class="secno">2.4.4.6 </span>Lists of integers</h5><p class="XXX annotation"><b>Status: </b><i>Last call for comments</i><p>A <dfn id="valid-list-of-integers">valid list of integers</dfn> is a number of <a href="#valid-integer" title="valid integer">valid integers</a> separated by U+002C + </ol></div><h5 id="lists-of-integers"><span class="secno">2.4.4.5 </span>Lists of integers</h5><p class="XXX annotation"><b>Status: </b><i>Last call for comments</i><p>A <dfn id="valid-list-of-integers">valid list of integers</dfn> is a number of <a href="#valid-integer" title="valid integer">valid integers</a> separated by U+002C COMMA characters, with no other characters (e.g. no <a href="#space-character" title="space character">space characters</a>). In addition, there might be restrictions on the number of integers that can be given, or on the range of values allowed.<div class="impl"> @@ -3104,7 +2994,7 @@ </ol></div><div class="impl"> - <h5 id="lists-of-dimensions"><span class="secno">2.4.4.7 </span>Lists of dimensions</h5><p class="XXX annotation"><b>Status: </b><i>Last call for comments</i></p> + <h5 id="lists-of-dimensions"><span class="secno">2.4.4.6 </span>Lists of dimensions</h5><p class="XXX annotation"><b>Status: </b><i>Last call for comments</i></p> <!-- no definition of a type since no conforming feature uses this syntax (it's only used in cols="" and rows="" on <frameset> --> @@ -15091,169 +14981,66 @@ attribute specifies how much of the task has been completed, and the <dfn id="attr-progress-max" title="attr-progress-max"><code>max</code></dfn> attribute specifies how much work the task requires in total. The units are - arbitrary and not specified.<p>Instead of using the attributes, authors are recommended to - include the current value and the maximum value inline as text - inside the element.<div class="example"> + arbitrary and not specified.<p>Authors are encouraged to also include the current value and the + maximum value inline as text inside the element, so that the + progress is made available to users of legacy user agents.<div class="example"> <p>Here is a snippet of a Web application that shows the progress of some automated task:</p> <pre><section> <h2>Task Progress</h2> - <p>Progress: <progress><span id="p">0</span>%</progress></p> + <p>Progress: <progress id="p" max=100><span>0</span>%</progress></p> <script> var progressBar = document.getElementById('p'); function updateProgress(newValue) { - progressBar.textContent = newValue; + progressBar.value = newValue; + progressBar.getElementsByTagName('span').textContent = newValue; } </script> </section></pre> <p>(The <code>updateProgress()</code> method in this example would be called by some other code on the page to update the actual progress bar as the task progressed.)</p> - </div><p><span class="impl"><strong>Author requirements</strong>:</span> - The <code><a href="#the-progress-element">progress</a></code> element must match one of the following - conditions.<ul><li>Neither the <code title="attr-progress-value"><a href="#attr-progress-value">value</a></code> - attribute nor the <code title="attr-progress-max"><a href="#attr-progress-max">max</a></code> - attribute is specified, and the element's contents - contain no numbers.</li> - - <li>Neither the <code title="attr-progress-value"><a href="#attr-progress-value">value</a></code> - attribute nor the <code title="attr-progress-max"><a href="#attr-progress-max">max</a></code> - attribute is specified, and the element's contents contain one - number, optionally followed by a <a href="#valid-denominator-punctuation-character" title="valid denominator - punctuation character">denominator punctuation - character</a>.</li> - - <li>Neither the <code title="attr-progress-value"><a href="#attr-progress-value">value</a></code> - attribute nor the <code title="attr-progress-max"><a href="#attr-progress-max">max</a></code> - attribute is specified, and the element's contents contain two - numbers, neither followed by a <a href="#valid-denominator-punctuation-character" title="valid denominator - punctuation character">denominator punctuation - character</a>.</li> - - <li>The <code title="attr-progress-value"><a href="#attr-progress-value">value</a></code> attribute is - not specified but the <code title="attr-progress-max"><a href="#attr-progress-max">max</a></code> - attribute is specified, and the element's contents - contain one number that is not followed by a <a href="#valid-denominator-punctuation-character" title="valid - denominator punctuation character">denominator punctuation - character</a>.</li> - - <li>The <code title="attr-progress-value"><a href="#attr-progress-value">value</a></code> attribute is - specified but the <code title="attr-progress-max"><a href="#attr-progress-max">max</a></code> - attribute is not specified, and the element's contents contain no - numbers.</li> - - <li>The <code title="attr-progress-value"><a href="#attr-progress-value">value</a></code> attribute - and the <code title="attr-progress-max"><a href="#attr-progress-max">max</a></code> attribute are - both specified. (The contents of the element are ignored.)</li> - - </ul><!-- next three paragraphs are also in the <meter> section --><p>For the purposes of these requirements, a number is a sequence of - characters in the range U+0030 DIGIT ZERO (0) to U+0039 DIGIT NINE - (9), optionally including a single U+002E FULL STOP character (.) in - some position after the first digit and before the last digit, - interpreted as a base ten number. Numbers must be separated from - other numbers by at least one character that isn't any of the - aforementioned. In addition, if the element is required to contain - numbers, then the contents of the element must not contain any - U+002E FULL STOP characters (.) that aren't part of numbers.<p>A number if said to be followed by a <a href="#valid-denominator-punctuation-character" title="valid - denominator punctuation character">denominator punctuation - character</a> if it is followed by zero or more - <a href="#white_space">White_Space</a> characters and a <a href="#valid-denominator-punctuation-character">valid denominator - punctuation character</a>.<p>The contents of the element consist of the concatenation of - the <a href="#text-node" title="text node">text nodes</a> of all the descendants - of the element, in <a href="#tree-order">tree order</a>.</p><!-- previous three paragraphs are also in the <meter> section --><p>The <code title="attr-progress-value"><a href="#attr-progress-value">value</a></code> and <code title="attr-progress-max"><a href="#attr-progress-max">max</a></code> attributes, when present, must + </div><p>The <code title="attr-progress-value"><a href="#attr-progress-value">value</a></code> and <code title="attr-progress-max"><a href="#attr-progress-max">max</a></code> attributes, when present, must have values that are <a href="#valid-floating-point-number" title="valid floating point number">valid floating point numbers</a>. The <code title="attr-progress-value"><a href="#attr-progress-value">value</a></code> attribute, if present, must have a value equal to or greater than zero, and less than or equal to the value of the <code title="attr-progress-max"><a href="#attr-progress-max">max</a></code> - attribute, if present, or 1.0, otherwise. If the <code title="attr-progress-value"><a href="#attr-progress-value">value</a></code> attribute is not present, - but the element's contents contain a number, then the value of the - first number in the element's contents must be less than or equal to - the value of the second number in the element's contents, if any, or - the <a href="#values-associated-with-denominator-punctuation-characters" title="values associated with denominator punctuation - characters">value associated with the denominator punctuation - character</a> that follows the first number in the element's - contents, if any, or 1.0, otherwise. The <code title="attr-progress-max"><a href="#attr-progress-max">max</a></code> attribute, if present, must + attribute, if present, or 1.0, otherwise. The <code title="attr-progress-max"><a href="#attr-progress-max">max</a></code> attribute, if present, must have a value greater than zero.<p class="note">The <code><a href="#the-progress-element">progress</a></code> element is the wrong element to use for something that is just a gauge, as opposed to task progress. For instance, indicating disk space usage using <code><a href="#the-progress-element">progress</a></code> would be inappropriate. Instead, the <code><a href="#the-meter-element">meter</a></code> element is available for such use cases.<div class="impl"> - <p><strong>User agent requirements</strong>: User agents must parse - the <code title="attr-progress-max"><a href="#attr-progress-max">max</a></code> and <code title="attr-progress-value"><a href="#attr-progress-value">value</a></code> attributes' values - according to the <a href="#rules-for-parsing-floating-point-number-values">rules for parsing floating point number - values</a>.</p> - - <p>If the <code title="attr-progress-value"><a href="#attr-progress-value">value</a></code> attribute - is omitted, then user agents must also parse the - <code>textContent</code> of the <code><a href="#the-progress-element">progress</a></code> element in - question using the <a href="#steps-for-finding-one-or-two-numbers-of-a-ratio-in-a-string">steps for finding one or two numbers of a - ratio in a string</a>. These steps will return nothing, one - number, one number with a <a href="#valid-denominator-punctuation-character" title="valid denominator punctuation - character">denominator punctuation character</a>, or two - numbers.</p> - - <p>Using the results of this processing, user agents must determine - whether the progress bar is an indeterminate progress bar, or - whether it is a determinate progress bar, and in the latter case, - what its current and maximum values are, all as follows:</p> - - <ol><li>If the <code title="attr-progress-max"><a href="#attr-progress-max">max</a></code> attribute is - omitted, and the <code title="attr-progress-value"><a href="#attr-progress-value">value</a></code> is - omitted, and the result of parsing the <code>textContent</code> was - nothing, then the progress bar is an indeterminate progress - bar. Abort these steps.</li> - - <li>Otherwise, it is a determinate progress bar.</li> - - <li>If the <code title="attr-progress-max"><a href="#attr-progress-max">max</a></code> attribute is - included, then, if a value could be parsed out of it, then the - maximum value is that value.</li> - - <li>Otherwise, if the <code title="attr-progress-max"><a href="#attr-progress-max">max</a></code> - attribute is absent but the <code title="attr-progress-value"><a href="#attr-progress-value">value</a></code> attribute is present, or, - if the <code title="attr-progress-max"><a href="#attr-progress-max">max</a></code> attribute is - present but no value could be parsed from it, then the maximum is - 1.</li> - - <li>Otherwise, if neither attribute is included, then, if the - <code>textContent</code> contained one number with an associated - <a href="#valid-denominator-punctuation-character" title="valid denominator punctuation character">denominator - punctuation character</a>, then the maximum value is the <a href="#values-associated-with-denominator-punctuation-characters" title="values associated with denominator punctuation - characters">value associated with that denominator punctuation - character</a>; otherwise, if the <code>textContent</code> - contained two numbers, the maximum value is the higher of the two - values; otherwise, the maximum value is 1.</li> - - <li>If the <code title="attr-progress-value"><a href="#attr-progress-value">value</a></code> attribute - is present on the element and a value could be parsed out of it, - that value is the current value of the progress bar. Otherwise, if - the attribute is present but no value could be parsed from it, the - current value is zero.</li> - - <li>Otherwise if the <code title="attr-progress-value"><a href="#attr-progress-value">value</a></code> - attribute is absent and the <code title="attr-progress-max"><a href="#attr-progress-max">max</a></code> attribute is present, then, if - the <code>textContent</code> was parsed and found to contain just - one number, with no associated <a href="#valid-denominator-punctuation-character" title="valid denominator - punctuation character">denominator punctuation character</a>, - then the current value is that number. Otherwise, if the <code title="attr-progress-value"><a href="#attr-progress-value">value</a></code> attribute is absent and - the <code title="attr-progress-max"><a href="#attr-progress-max">max</a></code> attribute is present - then the current value is zero.</li> - - <li>Otherwise, if neither attribute is present, then the current - value is the lower of the one or two numbers that were found in the - <code>textContent</code> of the element.</li> - - <li>If the maximum value is less than or equal to zero, then it is - reset to 1.</li> + <p><strong>User agent requirements</strong>: If the <code title="attr-progress-value"><a href="#attr-progress-value">value</a></code> attribute is omitted, then + the progress bar is an indeterminate progress bar. Otherwise, it is + a determinate progress bar.</p> - <li>If the current value is less than zero, then it is reset to - zero.</li> + <p>If the progress bar is a determinate progress bar and the element + has a <code title="attr-progress-max"><a href="#attr-progress-max">max</a></code> attribute, the user + agent must parse the <code title="attr-progress-max"><a href="#attr-progress-max">max</a></code> + attribute's value according to the <a href="#rules-for-parsing-floating-point-number-values">rules for parsing floating + point number values</a>. If this does not result in an error, and + if the parsed value is greater than zero, then the maximum value of + the progress bar is that value. Otherwise, if the element has no + <code title="attr-progress-max"><a href="#attr-progress-max">max</a></code> attribute, or if it has + one but parsing it resulted in an error, or if the parsed value was + less than or equal to zero, then the maximum value of the progress + bar is 1.0.</p> - <li>Finally, if the current value is greater than the maximum - value, then the current value is reset to the maximum value.</li> + <p>If the progress bar is a determinate progress bar, user agents + must parse the <code title="attr-progress-value"><a href="#attr-progress-value">value</a></code> + attribute's value according to the <a href="#rules-for-parsing-floating-point-number-values">rules for parsing floating + point number values</a>. If this does not result in an error, and + if the parsed value is less than the maximum value and greater than + zero, then the current value of the progress bar is that parsed + value. Otherwise, if the parsed value was greater than or equal to + the maximum value, then the current value of the progress bar is the + maximum value of the progress bar. Otherwise, if parsing the <code title="attr-progress-value"><a href="#attr-progress-value">value</a></code> attribute's value resulted + in an error, or a number less than or equal to zero, then the + current value of the progress bar is zero.</p> - </ol><p><strong>UA requirements for showing the progress bar</strong>: + <p><strong>UA requirements for showing the progress bar</strong>: When representing a <code><a href="#the-progress-element">progress</a></code> element to the user, the UA should indicate whether it is a determinate or indeterminate progress bar, and in the former case, should indicate the relative @@ -15262,8 +15049,7 @@ <p>The <dfn id="dom-progress-max" title="dom-progress-max"><code>max</code></dfn> and <dfn id="dom-progress-value" title="dom-progress-value"><code>value</code></dfn> IDL attributes must <a href="#reflect">reflect</a> the respective content attributes of the same name. When the relevant content attributes are absent, the IDL - attributes must return zero. The value parsed from the - <code>textContent</code> never affects the DOM values.</p> + attributes must return zero.</p> </div><dl class="domintro"><dt><var title="">progress</var> . <code title="dom-progress-position"><a href="#dom-progress-position">position</a></code></dt> @@ -15330,134 +15116,38 @@ "high" value then this indicates that the higher the value, the better; if it's lower than the "low" mark then it indicates that lower values are better, and naturally if it is in between then it - indicates that neither high nor low values are good.<p><strong class="impl">Authoring requirements</strong>: The - recommended way of giving the value is to include it as contents of - the element, either as two numbers (the higher number represents the - maximum, the other number the current value, and the minimum is - assumed to be zero), or as a percentage or similar (using one of the - characters such as "%"), or as a fraction. However, it is also - possible to use the attributes to specify these values.<p>One of the following conditions, along with all the requirements - that are listed with that condition, must be met:<dl><dt>There are exactly two numbers in the contents of the element, - and the <code title="attr-meter-value"><a href="#attr-meter-value">value</a></code>, <code title="attr-meter-min"><a href="#attr-meter-min">min</a></code>, and <code title="attr-meter-max"><a href="#attr-meter-max">max</a></code> attributes are all omitted</dt> - - <dd> - - <p>If specified, the <code title="attr-meter-low"><a href="#attr-meter-low">low</a></code>, - <code title="attr-meter-high"><a href="#attr-meter-high">high</a></code>, and <code title="attr-meter-optimum"><a href="#attr-meter-optimum">optimum</a></code> attributes must have - values greater than or equal to zero and less than or equal to the - bigger of the two numbers in the contents of the element.</p> - - <p>If both the <code title="attr-meter-low"><a href="#attr-meter-low">low</a></code> and <code title="attr-meter-high"><a href="#attr-meter-high">high</a></code> attributes are specified, then - the <code title="attr-meter-low"><a href="#attr-meter-low">low</a></code> attribute's value must - be less than or equal to the value of the <code title="attr-meter-high"><a href="#attr-meter-high">high</a></code> attribute.</p> - - <p>The numbers in the contents of the element must not be followed - by a <a href="#valid-denominator-punctuation-character" title="valid denominator punctuation - character">denominator punctuation character</a>.</p> - - </dd> - - <dt>There is exactly one number followed by a <a href="#valid-denominator-punctuation-character" title="valid - denominator punctuation character">denominator punctuation - character</a> in the contents of the element, and the <code title="attr-meter-value"><a href="#attr-meter-value">value</a></code>, <code title="attr-meter-min"><a href="#attr-meter-min">min</a></code>, and <code title="attr-meter-max"><a href="#attr-meter-max">max</a></code> attributes are all omitted</dt> - - <dd> - - <p>If specified, the <code title="attr-meter-low"><a href="#attr-meter-low">low</a></code>, - <code title="attr-meter-high"><a href="#attr-meter-high">high</a></code>, and <code title="attr-meter-optimum"><a href="#attr-meter-optimum">optimum</a></code> attributes must have - values greater than or equal to zero and less than or equal to the - <a href="#values-associated-with-denominator-punctuation-characters" title="values associated with denominator punctuation - characters">value associated with the denominator punctuation - character</a>.</p> - - <p>If both the <code title="attr-meter-low"><a href="#attr-meter-low">low</a></code> and <code title="attr-meter-high"><a href="#attr-meter-high">high</a></code> attributes are specified, then - the <code title="attr-meter-low"><a href="#attr-meter-low">low</a></code> attribute's value must - be less than or equal to the value of the <code title="attr-meter-high"><a href="#attr-meter-high">high</a></code> attribute.</p> - - <p>There must not be more than one number in the contents of the - element.</p> - - </dd> - - <dt>There is exactly one number in the contents of the element, and - the <code title="attr-meter-value"><a href="#attr-meter-value">value</a></code> attribute is - omitted</dt> - - <dt>There are no numbers in the contents of the element, and the - <code title="attr-meter-value"><a href="#attr-meter-value">value</a></code> attribute is - specified</dt> - - <dd> - - <p>If the <code title="attr-meter-min"><a href="#attr-meter-min">min</a></code> attribute - attribute is specified, then the <var title="">minimum</var> is - that attribute's value; otherwise, it is 0.</p> - - <p>If the <code title="attr-meter-max"><a href="#attr-meter-max">max</a></code> attribute - attribute is specified, then the <var title="">maximum</var> is - that attribute's value; otherwise, it is 1.</p> - - <p>If the <code title="attr-meter-value"><a href="#attr-meter-value">value</a></code> attribute is - specified, then the <var title="">value</var> is that attribute's - number; otherwise, there is exactly one number in the contents of - the element, and the <var title="">value</var> is that number.</p> - - <p>The following inequalities must hold, as applicable:</p> - - <ul class="brief"><li><var title="">minimum</var> ≤ <var title="">value</var> ≤ <var title="">maximum</var></li> - <li><var title="">minimum</var> ≤ <code title="attr-meter-low"><a href="#attr-meter-low">low</a></code> ≤ <var title="">maximum</var> (if <code title="attr-meter-low"><a href="#attr-meter-low">low</a></code> is specified)</li> - <li><var title="">minimum</var> ≤ <code title="attr-meter-high"><a href="#attr-meter-high">high</a></code> ≤ <var title="">maximum</var> (if <code title="attr-meter-high"><a href="#attr-meter-high">high</a></code> is specified)</li> - <li><var title="">minimum</var> ≤ <code title="attr-meter-optimum"><a href="#attr-meter-optimum">optimum</a></code> ≤ <var title="">maximum</var> (if <code title="attr-meter-optimum"><a href="#attr-meter-optimum">optimum</a></code> is specified)</li> - </ul><p>If both the <code title="attr-meter-low"><a href="#attr-meter-low">low</a></code> and <code title="attr-meter-high"><a href="#attr-meter-high">high</a></code> attributes are specified, then - the <code title="attr-meter-low"><a href="#attr-meter-low">low</a></code> attribute's value must - be less than or equal to the value of the <code title="attr-meter-high"><a href="#attr-meter-high">high</a></code> attribute.</p> - - <p>If the <code title="attr-meter-value"><a href="#attr-meter-value">value</a></code> attribute is - not specified, the number in the contents of the element must not - be followed by a <a href="#valid-denominator-punctuation-character" title="valid denominator punctuation - character">denominator punctuation character</a>. (Otherwise, - there is no restriction on what numbers can be in the contents of - the element.)</p> - - </dd> - - </dl><!-- next three paragraphs are also in the <progress> section --><p>For the purposes of these requirements, a number is a sequence of - characters in the range U+0030 DIGIT ZERO (0) to U+0039 DIGIT NINE - (9), optionally including a single U+002E FULL STOP character (.) in - some position after the first digit and before the last digit, - interpreted as a base ten number. Numbers must be separated from - other numbers by at least one character that isn't any of the - aforementioned. In addition, if the element is required to contain - numbers, then the contents of the element must not contain any - U+002E FULL STOP characters (.) that aren't part of numbers.<p>A number if said to be followed by a <a href="#valid-denominator-punctuation-character" title="valid - denominator punctuation character">denominator punctuation - character</a> if it is followed by zero or more - <a href="#white_space">White_Space</a> characters and a <a href="#valid-denominator-punctuation-character">valid denominator - punctuation character</a>.<p>The contents of the element consist of the concatenation of - the <a href="#text-node" title="text node">text nodes</a> of all the descendants - of the element, in <a href="#tree-order">tree order</a>.</p><!-- previous three paragraphs are also in the <progress> section --><p>The <code title="attr-meter-value"><a href="#attr-meter-value">value</a></code>, <code title="attr-meter-min"><a href="#attr-meter-min">min</a></code>, <code title="attr-meter-low"><a href="#attr-meter-low">low</a></code>, <code title="attr-meter-high"><a href="#attr-meter-high">high</a></code>, <code title="attr-meter-max"><a href="#attr-meter-max">max</a></code>, and <code title="attr-meter-optimum"><a href="#attr-meter-optimum">optimum</a></code> attributes, when present, + indicates that neither high nor low values are good.<p><strong class="impl">Authoring requirements</strong>: The <code title="attr-meter-value"><a href="#attr-meter-value">value</a></code> attribute must be + specified. The <code title="attr-meter-value"><a href="#attr-meter-value">value</a></code>, <code title="attr-meter-min"><a href="#attr-meter-min">min</a></code>, <code title="attr-meter-low"><a href="#attr-meter-low">low</a></code>, <code title="attr-meter-high"><a href="#attr-meter-high">high</a></code>, <code title="attr-meter-max"><a href="#attr-meter-max">max</a></code>, and <code title="attr-meter-optimum"><a href="#attr-meter-optimum">optimum</a></code> attributes, when present, must have values that are <a href="#valid-floating-point-number" title="valid floating point - number">valid floating point numbers</a>.<p class="note">If no minimum or maximum is specified, then the + number">valid floating point numbers</a>.<p>In addition, the attributes' values are further constrained:<p>Let <var title="">value</var> be the <code title="attr-meter-value"><a href="#attr-meter-value">value</a></code> attribute's number.<p>If the <code title="attr-meter-min"><a href="#attr-meter-min">min</a></code> attribute + attribute is specified, then let <var title="">minimum</var> be that + attribute's value; otherwise, let it be zero.<p>If the <code title="attr-meter-max"><a href="#attr-meter-max">max</a></code> attribute + attribute is specified, then let <var title="">maximum</var> be that + attribute's value; otherwise, let it be 1.0.<p>The following inequalities must hold, as applicable:<ul class="brief"><li><var title="">minimum</var> ≤ <var title="">value</var> ≤ <var title="">maximum</var></li> + <li><var title="">minimum</var> ≤ <code title="attr-meter-low"><a href="#attr-meter-low">low</a></code> ≤ <var title="">maximum</var> (if <code title="attr-meter-low"><a href="#attr-meter-low">low</a></code> is specified)</li> + <li><var title="">minimum</var> ≤ <code title="attr-meter-high"><a href="#attr-meter-high">high</a></code> ≤ <var title="">maximum</var> (if <code title="attr-meter-high"><a href="#attr-meter-high">high</a></code> is specified)</li> + <li><var title="">minimum</var> ≤ <code title="attr-meter-optimum"><a href="#attr-meter-optimum">optimum</a></code> ≤ <var title="">maximum</var> (if <code title="attr-meter-optimum"><a href="#attr-meter-optimum">optimum</a></code> is specified)</li> + </ul><p>If both the <code title="attr-meter-low"><a href="#attr-meter-low">low</a></code> and <code title="attr-meter-high"><a href="#attr-meter-high">high</a></code> attributes are specified, then + the <code title="attr-meter-low"><a href="#attr-meter-low">low</a></code> attribute's value must + be less than or equal to the value of the <code title="attr-meter-high"><a href="#attr-meter-high">high</a></code> attribute.<p class="note">If no minimum or maximum is specified, then the range is assumed to be 0..1, and the value thus has to be within - that range.<div class="example"> + that range.<p>Authors are encouraged to include a textual representation of the + gauge's state in the element's contents, for users of user agents + that do not support the <code><a href="#the-meter-element">meter</a></code> element.<div class="example"> - <p>The following examples all represent a measurement of three - quarters (of the maximum of whatever is being measured):</p> + <p>The following examples show three gauges that would all be + three-quarters full:</p> - <pre><meter>75%</meter> -<meter>750‰</meter> -<meter>3/4</meter> -<meter>6 blocks used (out of 8 total)</meter> -<meter>max: 100; current: 75</meter> -<meter><object data="graph75.png">0.75</object></meter> <!-- using <span class="bad"><img alt="0.75" ...></span> wouldn't work; the alt would be ignored --> -<meter min="0" max="100" value="75"></meter></pre> + <pre>Storage space usage: <meter value=6 max=8>6 blocks used (out of 8 total)</meter> +Voter turnout: <meter value=0.75><img alt="75%" src="graph75.png"></meter> +Tickets sold: <meter min="0" max="100" value="75"></meter></pre> <p>The following example is incorrect use of the element, because it doesn't give a range (and since the default maximum is 1, both of the gauges would end up looking maxed out):</p> - <pre class="bad"><p>The grapefruit pie had a radius of <meter>12cm</meter> -and a height of <meter>2cm</meter>.</p> <!-- <strong>BAD!</strong> --></pre> + <pre class="bad"><p>The grapefruit pie had a radius of <meter value=12>12cm</meter> +and a height of <meter value=2>2cm</meter>.</p> <!-- <strong>BAD!</strong> --></pre> <p>Instead, one would either not include the meter element, or use the meter element with a defined range to give the dimensions in @@ -15487,13 +15177,6 @@ the <code title="attr-meter-min"><a href="#attr-meter-min">min</a></code>, <code title="attr-meter-max"><a href="#attr-meter-max">max</a></code>, <code title="attr-meter-value"><a href="#attr-meter-value">value</a></code>, <code title="attr-meter-low"><a href="#attr-meter-low">low</a></code>, <code title="attr-meter-high"><a href="#attr-meter-high">high</a></code>, and <code title="attr-meter-optimum"><a href="#attr-meter-optimum">optimum</a></code> attributes using the <a href="#rules-for-parsing-floating-point-number-values">rules for parsing floating point number values</a>.</p> - <p>If the <code title="attr-meter-value"><a href="#attr-meter-value">value</a></code> attribute has - been omitted, the user agent must also process the - <code>textContent</code> of the element according to the <a href="#steps-for-finding-one-or-two-numbers-of-a-ratio-in-a-string">steps - for finding one or two numbers of a ratio in a string</a>. These - steps will return nothing, one number, one number with a <a href="#valid-denominator-punctuation-character" title="valid denominator punctuation character">denominator - punctuation character</a>, or two numbers.</p> - <p>User agents must then use all these numbers to obtain values for six points on the gauge, as follows. (The order in which these are evaluated is important, as some of the values refer to earlier @@ -15512,32 +15195,11 @@ <dd> <p>If the <code title="attr-meter-max"><a href="#attr-meter-max">max</a></code> attribute is - specified and a value could be parsed out of it, the maximum - value is that value.</p> - - <p>Otherwise, if the <code title="attr-meter-max"><a href="#attr-meter-max">max</a></code> - attribute is specified but no value could be parsed out of it, or - if it was not specified, but either or both of the <code title="attr-meter-min"><a href="#attr-meter-min">min</a></code> or <code title="attr-meter-value"><a href="#attr-meter-value">value</a></code> attributes <em>were</em> - specified, then the maximum value is 1.</p> - - <p>Otherwise, none of the <code title="attr-meter-max"><a href="#attr-meter-max">max</a></code>, - <code title="attr-meter-min"><a href="#attr-meter-min">min</a></code>, and <code title="attr-meter-value"><a href="#attr-meter-value">value</a></code> attributes were - specified. If the result of processing the - <code>textContent</code> of the element was either nothing or just - one number with no <a href="#valid-denominator-punctuation-character" title="valid denominator punctuation - character">denominator punctuation character</a>, then the - maximum value is 1; if the result was one number but it had an - associated <a href="#valid-denominator-punctuation-character" title="valid denominator punctuation - character">denominator punctuation character</a>, then the - maximum value is the <a href="#values-associated-with-denominator-punctuation-characters" title="values associated with - denominator punctuation characters">value associated with that - denominator punctuation character</a>; and finally, if there - were two numbers parsed out of the <code>textContent</code>, then - the maximum is the higher of those two numbers.</p> + specified and a value could be parsed out of it, the maximum value + is that value. Otherwise, the maximum value is 1.0.</p> - <p>If the above machinations result in a maximum value less than - the minimum value, then the maximum value is actually the same as - the minimum value.</p> + <p>If the maximum value would be less than the minimum value, then + the maximum value is actually the same as the minimum value.</p> </dd> @@ -15547,36 +15209,13 @@ <p>If the <code title="attr-meter-value"><a href="#attr-meter-value">value</a></code> attribute is specified and a value could be parsed out of it, then that value - is the actual value.</p> - - <p>If the <code title="attr-meter-value"><a href="#attr-meter-value">value</a></code> attribute is - not specified but the <code title="attr-meter-max"><a href="#attr-meter-max">max</a></code> - attribute <em>is</em> specified and the result of processing the - <code>textContent</code> of the element was one number with no - associated <a href="#valid-denominator-punctuation-character" title="valid denominator punctuation - character">denominator punctuation character</a>, then that - number is the actual value.</p> - - <p>If neither of the <code title="attr-meter-value"><a href="#attr-meter-value">value</a></code> - and <code title="attr-meter-max"><a href="#attr-meter-max">max</a></code> attributes are - specified, then, if the result of processing the - <code>textContent</code> of the element was one number (with or - without an associated <a href="#valid-denominator-punctuation-character" title="valid denominator punctuation - character">denominator punctuation character</a>), then that is - the actual value, and if the result of processing the - <code>textContent</code> of the element was two numbers, then the - actual value is the lower of the two numbers found.</p> - - <p>Otherwise, if none of the above apply, the actual value is - zero.</p> + is the actual value. Otherwise, the actual value is zero.</p> - <p>If the above procedure results in an actual value less than - the minimum value, then the actual value is actually the same as - the minimum value.</p> + <p>If the actual value would be less than the minimum value, then + the actual value is actually the same as the minimum value.</p> - <p>If, on the other hand, the result is an actual value greater - than the maximum value, then the actual value is the maximum - value.</p> + <p>If, on the other hand, the actual value would be greater than + the maximum value, then the actual value is the maximum value.</p> </dd> @@ -15700,15 +15339,12 @@ <p>The <dfn id="dom-meter-min" title="dom-meter-min"><code>min</code></dfn>, <dfn id="dom-meter-max" title="dom-meter-max"><code>max</code></dfn>, <dfn id="dom-meter-value" title="dom-meter-value"><code>value</code></dfn>, <dfn id="dom-meter-low" title="dom-meter-low"><code>low</code></dfn>, <dfn id="dom-meter-high" title="dom-meter-high"><code>high</code></dfn>, and <dfn id="dom-meter-optimum" title="dom-meter-optimum"><code>optimum</code></dfn> IDL attributes must <a href="#reflect">reflect</a> the respective content attributes of the same name. When the relevant content attributes are absent, the IDL - attributes must return zero. The value parsed from the - <code>textContent</code> never affects the DOM values.</p> + attributes must return zero.</p> </div><div class="example"> <p>The following example shows how a gauge could fall back to - localized or pretty-printed text. The attributes have to be used in - this case, since the localized or pretty-printed numbers might not - match the simple expected syntax.</p> + localized or pretty-printed text.</p> <pre><p>Disk usage: <meter min=0 value=170261928 max=233257824>170 261 928 bytes used out of 233 257 824 bytes available</meter></p></pre> @@ -15996,11 +15632,11 @@ <tr><td><code><a href="#the-progress-element">progress</a></code> <td>Progress bar - <td><pre class="example">Copying: <strong><progress>75%</progress></strong></pre> + <td><pre class="example">Copying: <strong><progress value=0.75>75%</progress></strong></pre> <tr><td><code><a href="#the-meter-element">meter</a></code> <td>Gauge - <td><pre class="example">Disk space remaining: <strong><meter>75%<meter></strong></pre> + <td><pre class="example">Disk space remaining: <strong><meter value=0.75>75%<meter></strong></pre> <tr><td><code><a href="#the-ruby-element">ruby</a></code>, <code><a href="#the-rt-element">rt</a></code>, <code><a href="#the-rp-element">rp</a></code> <td>Ruby annotations
Received on Monday, 4 January 2010 23:38:59 UTC