Skip to content

Commit

Permalink
[giow] (1) Make MediaController.play() work as people expect, and mak…
Browse files Browse the repository at this point in the history 
…e .unpause() just unpause the MediaController (what play() used to do). Also, fix error from yesterday that I keep screwing up.

Affected topics: HTML, Video and Audio

git-svn-id: http://svn.whatwg.org/webapps@7367 340c8d12-0b0e-0410-8428-c7bf67bfef74
  • Loading branch information
@Hixie
Hixie committed Sep 17, 2012
1 parent 0fc7e15 commit a26d4f3
Show file tree
Hide file tree
Showing 3 changed files with 249 additions and 117 deletions.
157 changes: 108 additions & 49 deletions complete.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31790,19 +31790,19 @@ <h5 id=playing-the-media-resource><span class=secno>4.8.10.8 </span>Playing the
unpaused, or it could be unpaused but stalled waiting for content to
buffer.</p>

<hr><p>Each <a href=#media-element>media element</a> has a <span>list of newly
introduced cues</span>, which must be initially empty. Whenever a
<hr><p>Each <a href=#media-element>media element</a> has a <dfn id=list-of-newly-introduced-cues>list of newly
introduced cues</dfn>, which must be initially empty. Whenever a
<a href=#text-track-cue>text track cue</a> is added to the <a href=#text-track-list-of-cues title="text track
list of cues">list of cues</a> of a <a href=#text-track>text track</a> that
is in the <a href=#list-of-text-tracks>list of text tracks</a> for a <a href=#media-element>media
element</a>, that <a href=#text-track-cue title="text track cue">cue</a> must be
added to the <a href=#media-element>media element</a>'s <span>list of newly
introduced cues</span>. Whenever a <a href=#text-track>text track</a> is added
added to the <a href=#media-element>media element</a>'s <a href=#list-of-newly-introduced-cues>list of newly
introduced cues</a>. Whenever a <a href=#text-track>text track</a> is added
to the <a href=#list-of-text-tracks>list of text tracks</a> for a <a href=#media-element>media
element</a>, all of the <a href=#text-track-cue title="text track cue">cues</a>
in that <a href=#text-track>text track</a>'s <a href=#text-track-list-of-cues title="text track list of
cues">list of cues</a> must be added to the <a href=#media-element>media
element</a>'s <span>list of newly introduced cues</span>.</p>
element</a>'s <a href=#list-of-newly-introduced-cues>list of newly introduced cues</a>.</p>

<p>When the <a href=#current-playback-position>current playback position</a> of a <a href=#media-element>media
element</a> changes (e.g. due to playback or seeking), the user
Expand Down Expand Up @@ -31846,9 +31846,9 @@ <h5 id=playing-the-media-resource><span class=secno>4.8.10.8 </span>Playing the

<li><p>Remove all the <a href=#text-track-cue title="text track cue">cues</a> in
<var title="">missed cues</var> that are also in the <a href=#media-element>media
element</a>'s <span>list of newly introduced cues</span>, and
then empty the element's <span>list of newly introduced
cues</span>.</li>
element</a>'s <a href=#list-of-newly-introduced-cues>list of newly introduced cues</a>, and
then empty the element's <a href=#list-of-newly-introduced-cues>list of newly introduced
cues</a>.</li>

<li><p>If the time was reached through the usual monotonic increase
of the <a href=#current-playback-position>current playback position</a> during normal
Expand Down Expand Up @@ -32737,7 +32737,7 @@ <h6 id=media-controllers><span class=secno>4.8.10.11.2 </span>Media controllers<

<pre class=idl>enum <dfn id=mediacontrollerplaybackstate>MediaControllerPlaybackState</dfn> { "<a href=#dom-mediacontroller-waiting title=dom-MediaController-waiting>waiting</a>", "<a href=#dom-mediacontroller-playing title=dom-MediaController-playing>playing</a>", "<a href=#dom-mediacontroller-ended title=dom-MediaController-ended>ended</a>" };
[<a href=#dom-mediacontroller title=dom-MediaController>Constructor</a>]
interface <dfn id=mediacontroller>MediaController</dfn> {
interface <dfn id=mediacontroller>MediaController</dfn> : <a href=#eventtarget>EventTarget</a> {
readonly attribute unsigned short <a href=#dom-mediacontroller-readystate title=dom-MediaController-readyState>readyState</a>; // uses <a href=#htmlmediaelement>HTMLMediaElement</a>.<a href=#dom-media-readystate title=dom-media-readyState>readyState</a>'s values

readonly attribute <a href=#timeranges>TimeRanges</a> <a href=#dom-mediacontroller-buffered title=dom-MediaController-buffered>buffered</a>;
Expand All @@ -32748,8 +32748,9 @@ <h6 id=media-controllers><span class=secno>4.8.10.11.2 </span>Media controllers<
readonly attribute boolean <a href=#dom-mediacontroller-paused title=dom-MediaController-paused>paused</a>;
readonly attribute <a href=#mediacontrollerplaybackstate>MediaControllerPlaybackState</a> <a href=#dom-mediacontroller-playbackstate title=dom-MediaController-playbackState>playbackState</a>;
readonly attribute <a href=#timeranges>TimeRanges</a> <a href=#dom-mediacontroller-played title=dom-MediaController-played>played</a>;
void <a href=#dom-mediacontroller-play title=dom-MediaController-play>play</a>();
void <a href=#dom-mediacontroller-pause title=dom-MediaController-pause>pause</a>();
void <a href=#dom-mediacontroller-unpause title=dom-MediaController-unpause>unpause</a>();
void <a href=#dom-mediacontroller-play title=dom-MediaController-play>play</a>(); // calls play() on all media elements as well

attribute double <a href=#dom-mediacontroller-defaultplaybackrate title=dom-MediaController-defaultPlaybackRate>defaultPlaybackRate</a>;
attribute double <a href=#dom-mediacontroller-playbackrate title=dom-MediaController-playbackRate>playbackRate</a>;
Expand Down Expand Up @@ -32876,7 +32877,16 @@ <h6 id=media-controllers><span class=secno>4.8.10.11.2 </span>Media controllers<

</dd>

<dt><var title="">controller</var> . <code title=dom-MediaController-play><a href=#dom-mediacontroller-play>play</a></code>()</dt>
<dt><var title="">controller</var> . <code title=dom-MediaController-pause><a href=#dom-mediacontroller-pause>pause</a></code>()</dt>

<dd>

<p>Sets the <code title=dom-MediaController-paused><a href=#dom-mediacontroller-paused>paused</a></code>
attribute to true.</p>

</dd>

<dt><var title="">controller</var> . <code title=dom-MediaController-unpause><a href=#dom-mediacontroller-unpause>unpause</a></code>()</dt>

<dd>

Expand All @@ -32885,12 +32895,13 @@ <h6 id=media-controllers><span class=secno>4.8.10.11.2 </span>Media controllers<

</dd>

<dt><var title="">controller</var> . <code title=dom-MediaController-pause><a href=#dom-mediacontroller-pause>pause</a></code>()</dt>
<dt><var title="">controller</var> . <code title=dom-MediaController-play><a href=#dom-mediacontroller-play>play</a></code>()</dt>

<dd>

<p>Sets the <code title=dom-MediaController-paused><a href=#dom-mediacontroller-paused>paused</a></code>
attribute to true.</p>
attribute to false and invokes the <code title=dom-media-play><a href=#dom-media-play>play()</a></code> method of each <span>slaved
media element</span>.</p>

</dd>

Expand Down Expand Up @@ -32972,7 +32983,10 @@ <h6 id=media-controllers><span class=secno>4.8.10.11.2 </span>Media controllers<
controller</a> is that <code><a href=#mediacontroller>MediaController</a></code>. All the
<a href=#slaved-media-elements>slaved media elements</a> of a <code><a href=#mediacontroller>MediaController</a></code>
must use the same clock for their definition of their <a href=#media-timeline>media
timeline</a>'s unit time.</p>
timeline</a>'s unit time. When the user agent is required to act
on each <span>slaved media element</span> in turn, they must be
processed in the order that they were last associated with the
<code><a href=#mediacontroller>MediaController</a></code>.</p>

<hr><p>The <dfn id=dom-media-controller title=dom-media-controller><code>controller</code></dfn> attribute
on a <a href=#media-element>media element</a>, on getting, must return the
Expand Down Expand Up @@ -33097,15 +33111,20 @@ <h6 id=media-controllers><span class=secno>4.8.10.11.2 </span>Media controllers<
<code><a href=#mediacontroller>MediaController</a></code>, and then <a href=#report-the-controller-state>report the controller
state</a> of the <code><a href=#mediacontroller>MediaController</a></code>.</p>

<p>When the <dfn id=dom-mediacontroller-play title=dom-MediaController-play><code>play()</code></dfn> method is
invoked, if the <code><a href=#mediacontroller>MediaController</a></code> is a <a href=#paused-media-controller>paused media
controller</a>, the user agent must change the
<p>When the <dfn id=dom-mediacontroller-unpause title=dom-MediaController-unpause><code>unpause()</code></dfn>
method is invoked, if the <code><a href=#mediacontroller>MediaController</a></code> is a
<a href=#paused-media-controller>paused media controller</a>, the user agent must change the
<code><a href=#mediacontroller>MediaController</a></code> into a <a href=#playing-media-controller>playing media
controller</a>, <a href=#queue-a-task>queue a task</a> to <a href=#fire-a-simple-event>fire a simple
event</a> named <code title=event-MediaController-play><a href=#event-mediacontroller-play>play</a></code> at the
<code><a href=#mediacontroller>MediaController</a></code>, and then <a href=#report-the-controller-state>report the controller
state</a> of the <code><a href=#mediacontroller>MediaController</a></code>.</p>

<p>When the <dfn id=dom-mediacontroller-play title=dom-MediaController-play><code>play()</code></dfn> method is
invoked, the user agent must invoke the <code title=dom-media-play><a href=#dom-media-play>play</a></code> method of each <span>slaved media
element</span> in turn, and then invoke the <code title=dom-MediaController-unpause><a href=#dom-mediacontroller-unpause>unpause</a></code> method of the
<code><a href=#mediacontroller>MediaController</a></code>.</p>

<p>The <dfn id=dom-mediacontroller-playbackstate title=dom-MediaController-playbackState><code>playbackState</code></dfn>
attribute must return the value to which it was most recently set.
When the <code><a href=#mediacontroller>MediaController</a></code> object is created, the
Expand Down Expand Up @@ -51730,33 +51749,40 @@ <h6 id=the-readonly-attribute><span class=secno>4.10.7.3.3 </span>The <code titl

</div>

<p class=note>The difference between <code title=attr-fe-disabled><a href=#attr-fe-disabled>disabled</a></code> and <code title=attr-input-readonly><a href=#attr-input-readonly>readonly</a></code> is that read-only
controls are still focusable, so the user can still select the text
and interact with it, whereas disabled controls are entirely
non-interactive. (For this reason, only text controls can be made
read-only: it wouldn't make sense for checkboxes or buttons, for
instances.)</p>

<div class=example>

<p>In the following example, the existing product identifiers
cannot be modified, but they are still displayed as part of the
form, for consistency with the row representing a new product
(where the identifier is not yet filled in).</p>

<pre>&lt;form action="products.cgi" method=post enctype="multipart/form-data"&gt;
<pre>&lt;form action="products.cgi" method="post" enctype="multipart/form-data"&gt;
&lt;table&gt;
&lt;tr&gt; &lt;th&gt; Product ID &lt;th&gt; Product name &lt;th&gt; Price &lt;th&gt; Action
&lt;tr&gt;
&lt;td&gt; &lt;input readonly name="1.pid" value="H412"&gt;
&lt;td&gt; &lt;input required name="1.pname" value="Floor lamp Ulke"&gt;
&lt;td&gt; $&lt;input required type=number min=0 step=0.01 name="1.pprice" value="49.99"&gt;
&lt;td&gt; &lt;button formnovalidate name="action" value="delete:1"&gt;Delete&lt;/button&gt;
&lt;td&gt; &lt;input readonly="readonly" name="1.pid" value="H412"&gt;
&lt;td&gt; &lt;input required="required" name="1.pname" value="Floor lamp Ulke"&gt;
&lt;td&gt; $&lt;input required="required" type="number" min="0" step="0.01" name="1.pprice" value="49.99"&gt;
&lt;td&gt; &lt;button formnovalidate="formnovalidate" name="action" value="delete:1"&gt;Delete&lt;/button&gt;
&lt;tr&gt;
&lt;td&gt; &lt;input readonly name="2.pid" value="FG28"&gt;
&lt;td&gt; &lt;input required name="2.pname" value="Table lamp Ulke"&gt;
&lt;td&gt; $&lt;input required type=number min=0 step=0.01 name="2.pprice" value="24.99"&gt;
&lt;td&gt; &lt;button formnovalidate name="action" value="delete:2"&gt;Delete&lt;/button&gt;
&lt;td&gt; &lt;input readonly="readonly" name="2.pid" value="FG28"&gt;
&lt;td&gt; &lt;input required="required" name="2.pname" value="Table lamp Ulke"&gt;
&lt;td&gt; $&lt;input required="required" type="number" min="0" step="0.01" name="2.pprice" value="24.99"&gt;
&lt;td&gt; &lt;button formnovalidate="formnovalidate" name="action" value="delete:2"&gt;Delete&lt;/button&gt;
&lt;tr&gt;
&lt;td&gt; &lt;input required name="3.pid" value="" pattern="[A-Z0-9]+"&gt;
&lt;td&gt; &lt;input required name="3.pname" value=""&gt;
&lt;td&gt; $&lt;input required type=number min=0 step=0.01 name="3.pprice" value=""&gt;
&lt;td&gt; &lt;button formnovalidate name="action" value="delete:3"&gt;Delete&lt;/button&gt;
&lt;td&gt; &lt;input required="required" name="3.pid" value="" pattern="[A-Z0-9]+"&gt;
&lt;td&gt; &lt;input required="required" name="3.pname" value=""&gt;
&lt;td&gt; $&lt;input required="required" type="number" min="0" step="0.01" name="3.pprice" value=""&gt;
&lt;td&gt; &lt;button formnovalidate="formnovalidate" name="action" value="delete:3"&gt;Delete&lt;/button&gt;
&lt;/table&gt;
&lt;p&gt; &lt;button formnovalidate name="action" value="add"&gt;Add&lt;/button&gt; &lt;/p&gt;
&lt;p&gt; &lt;button formnovalidate="formnovalidate" name="action" value="add"&gt;Add&lt;/button&gt; &lt;/p&gt;
&lt;p&gt; &lt;button name="action" value="update"&gt;Save&lt;/button&gt; &lt;/p&gt;
&lt;/form&gt;</pre>

Expand Down Expand Up @@ -52025,7 +52051,7 @@ <h6 id=the-min-and-max-attributes><span class=secno>4.10.7.3.7 </span>The <code
<p>The following number control limits input to whole numbers
greater than zero:</p>

<pre>&lt;input name=quantity required type=number min=1 value=1&gt;</pre>
<pre>&lt;input name=quantity required="" type="number" min="1" value="1"&gt;</pre>

</div>

Expand Down Expand Up @@ -52266,20 +52292,27 @@ <h6 id=the-list-attribute><span class=secno>4.10.7.3.9 </span>The <code title=at

<h6 id=the-placeholder-attribute><span class=secno>4.10.7.3.10 </span>The <code title=attr-input-placeholder><a href=#attr-input-placeholder>placeholder</a></code> attribute</h6>

<!-- similar text in the <textarea> section -->
<!-- substantially similar text in the <textarea> section -->

<p>The <dfn id=attr-input-placeholder title=attr-input-placeholder><code>placeholder</code></dfn>
attribute represents a <em>short</em> hint (a word or short phrase)
intended to aid the user with data entry. A hint could be a sample
value or a brief description of the expected format. The attribute,
if specified, must have a value that contains no U+000A LINE FEED
(LF) or U+000D CARRIAGE RETURN (CR) characters.</p>

<p class=note>For a longer hint or other advisory text, the <code title=attr-title><a href=#attr-title>title</a></code> attribute is more appropriate.</p>
intended to aid the user with data entry when the control has no
value. A hint could be a sample value or a brief description of the
expected format. The attribute, if specified, must have a value that
contains no U+000A LINE FEED (LF) or U+000D CARRIAGE RETURN (CR)
characters.</p>

<p>The <code title=attr-input-placeholder><a href=#attr-input-placeholder>placeholder</a></code>
attribute should not be used as an alternative to a
<code><a href=#the-label-element>label</a></code>.</p>
<code><a href=#the-label-element>label</a></code>. For a longer hint or other advisory text, the
<code title=attr-title><a href=#attr-title>title</a></code> attribute is more
appropriate.</p>

<p class=note>These mechanisms are very similar but subtly
different: the hint given by the control's <code><a href=#the-label-element>label</a></code> is
shown at all times; the short hint given in the <code title=attr-input-placeholder><a href=#attr-input-placeholder>placeholder</a></code> attribute is shown
before the user enters a value; and the hint in the <code title=attr-title><a href=#attr-title>title</a></code> attribute is shown when the user
requests further help.</p>

<div class=impl>

Expand Down Expand Up @@ -53801,6 +53834,25 @@ <h4 id=the-textarea-element><span class=secno>4.10.13 </span>The <dfn><code>text
is a <a href=#boolean-attribute>boolean attribute</a> used to control whether the text
can be edited by the user or not.</p>

<div class=example>

<p>In this example, a text field is marked read-only because it
represents a read-only file:</p>

<pre>Filename: &lt;code&gt;/etc/bash.bashrc&lt;/code&gt;
&lt;textarea name="buffer" readonly&gt;
# System-wide .bashrc file for interactive bash(1) shells.

# To enable the settings / commands in this file for login shells as well,
# this file has to be sourced in /etc/profile.

# If not running interactively, don't do anything
[ -z "$PS1" ] &amp;amp;&amp;amp; return

...&lt;/textarea&gt;</pre>

</div>

<div class=impl>

<p><strong>Constraint validation</strong>: If the <code title=attr-textarea-readonly><a href=#attr-textarea-readonly>readonly</a></code> attribute is
Expand Down Expand Up @@ -53993,20 +54045,27 @@ <h4 id=the-textarea-element><span class=secno>4.10.13 </span>The <dfn><code>text
</div>


<!-- similar text in the <input> section -->
<!-- substantially similar text in the <input> section -->

<p>The <dfn id=attr-textarea-placeholder title=attr-textarea-placeholder><code>placeholder</code></dfn>
attribute represents a hint (a word or short phrase) intended to aid
the user with data entry. A hint could be a sample value or a brief
description of the expected format. The attribute, if specified,
must have a value that contains no U+000A LINE FEED (LF) or U+000D
CARRIAGE RETURN (CR) characters.</p>

<p class=note>For a longer hint or other advisory text, the <code title=attr-title><a href=#attr-title>title</a></code> attribute is more appropriate.</p>
attribute represents a <em>short</em> hint (a word or short phrase)
intended to aid the user with data entry when the control has no
value. A hint could be a sample value or a brief description of the
expected format. The attribute, if specified, must have a value that
contains no U+000A LINE FEED (LF) or U+000D CARRIAGE RETURN (CR)
characters.</p>

<p>The <code title=attr-textarea-placeholder><a href=#attr-textarea-placeholder>placeholder</a></code>
attribute should not be used as an alternative to a
<code><a href=#the-label-element>label</a></code>.</p>
<code><a href=#the-label-element>label</a></code>. For a longer hint or other advisory text, the
<code title=attr-title><a href=#attr-title>title</a></code> attribute is more
appropriate.</p>

<p class=note>These mechanisms are very similar but subtly
different: the hint given by the control's <code><a href=#the-label-element>label</a></code> is
shown at all times; the short hint given in the <code title=attr-textarea-placeholder><a href=#attr-textarea-placeholder>placeholder</a></code> attribute is
shown before the user enters a value; and the hint in the <code title=attr-title><a href=#attr-title>title</a></code> attribute is shown when the user
requests further help.</p>

<div class=impl>

Expand Down

0 comments on commit a26d4f3

Please sign in to comment.