[html5] r5151 - [giow] (0) Captions - Stage 21.5: rendering: property mappings
whatwg at whatwg.org
whatwg at whatwg.org
Mon Jul 12 17:44:32 PDT 2010
Author: ianh
Date: 2010-07-12 17:44:31 -0700 (Mon, 12 Jul 2010)
New Revision: 5151
Modified:
complete.html
index
source
Log:
[giow] (0) Captions - Stage 21.5: rendering: property mappings
Modified: complete.html
===================================================================
--- complete.html 2010-07-12 22:26:49 UTC (rev 5150)
+++ complete.html 2010-07-13 00:44:31 UTC (rev 5151)
@@ -209,7 +209,7 @@
<header class=head id=head><p><a class=logo href=http://www.whatwg.org/ rel=home><img alt=WHATWG src=/images/logo></a></p>
<hgroup><h1>Web Applications 1.0</h1>
- <h2 class="no-num no-toc">Draft Standard — 12 July 2010</h2>
+ <h2 class="no-num no-toc">Draft Standard — 13 July 2010</h2>
</hgroup><p>You can take part in this work. <a href=http://www.whatwg.org/mailing-list>Join the working group's discussion list.</a></p>
<p><strong>Web designers!</strong> We have a <a href=http://blog.whatwg.org/faq/>FAQ</a>, a <a href=http://forums.whatwg.org/>forum</a>, and a <a href=http://www.whatwg.org/mailing-list#help>help mailing list</a> for you!</p>
<!--<p class="impl"><strong>Implementors!</strong> We have a <a href="http://www.whatwg.org/mailing-list#implementors">mailing list</a> for you too!</p>-->
@@ -1293,7 +1293,8 @@
<li><a href=#timed-tracks-0><span class=secno>14.3.2 </span>Timed tracks</a>
<ol>
<li><a href=#websrt-cue-text-rendering-rules><span class=secno>14.3.2.1 </span>WebSRT cue text rendering rules</a></li>
- <li><a href=#css-extensions><span class=secno>14.3.2.2 </span>CSS extensions</a></ol></li>
+ <li><a href=#applying-css-properties-to-websrt-node-objects><span class=secno>14.3.2.2 </span>Applying CSS properties to WebSRT Node Objects</a></li>
+ <li><a href=#css-extensions><span class=secno>14.3.2.3 </span>CSS extensions</a></ol></li>
<li><a href=#images-0><span class=secno>14.3.3 </span>Images</a></li>
<li><a href=#attributes-for-embedded-content-and-images><span class=secno>14.3.4 </span>Attributes for embedded content and images</a></li>
<li><a href=#image-maps-0><span class=secno>14.3.5 </span>Image maps</a></li>
@@ -85427,7 +85428,7 @@
<p>For the purposes of the CSS ruby model, runs of children of
<code><a href=#the-ruby-element>ruby</a></code> elements that are not <code><a href=#the-rt-element>rt</a></code> or
<code><a href=#the-rp-element>rp</a></code> elements are expected to be wrapped in anonymous
- boxes whose 'display' property has the value 'ruby-base'.</p>
+ boxes whose 'display' property has the value 'ruby-base'. <a href=#refsCSSRUBY>[CSSRUBY]</a></p>
<p>User agents that do not support correct ruby rendering are
expected to render parentheses around the text of <code><a href=#the-rt-element>rt</a></code>
@@ -86361,29 +86362,39 @@
<h4 id=timed-tracks-0><span class=secno>14.3.2 </span>Timed tracks</h4>
+ <p class=note>This section is intended to be moved to its own CSS
+ module once an editor is found to run with it.</p>
+
<h5 id=websrt-cue-text-rendering-rules><span class=secno>14.3.2.1 </span><dfn>WebSRT cue text rendering rules</dfn></h5>
<p>The <dfn id=rules-for-updating-the-display-of-websrt-timed-tracks>rules for updating the display of WebSRT timed
tracks</dfn> render the <a href=#timed-track title="timed track">timed
tracks</a> of a <a href=#media-element>media element</a> (specifically, a
- <code><a href=#video>video</a></code> element) by applying the steps below. All the
- <a href=#timed-track title="timed track">timed tracks</a> that use these rules
- for a given <a href=#media-element>media element</a> are rendered together, to
- avoid overlapping subtitles from multiple tracks.</p>
+ <code><a href=#video>video</a></code> element), or of another playback mechanism, by
+ applying the steps below. All the <a href=#timed-track title="timed track">timed
+ tracks</a> that use these rules for a given <a href=#media-element>media
+ element</a>, or other playback mechanism, are rendered together,
+ to avoid overlapping subtitles from multiple tracks.</p>
<p>The output of the steps below is a set of CSS boxes that covers
- the rendering area of the <code><a href=#video>video</a></code> element.</p>
+ the rendering area of the <a href=#media-element>media element</a> or other
+ playback mechanism, which user agents are expected to render in a
+ manner suiting the user.</p>
<p>The rules are as follows:</p>
<ol><li><p>If the <a href=#media-element>media element</a> is an <code><a href=#audio>audio</a></code>
- element, abort these steps. There is nothing to render.</li>
+ element, or is another playback mechanism with no rendering area,
+ abort these steps. There is nothing to render.</li>
+ <li><p>Let <var title="">video</var> be the <a href=#media-element>media
+ element</a> or other playback mechanism.</li>
+
<li><p>Let <var title="">output</var> be an empty list of
absolutely positioned CSS block boxes.</li>
- <li><p>Let <var title="">tracks</var> be the subset of the
- <a href=#media-element>media element</a>'s <a href=#list-of-timed-tracks>list of timed tracks</a> that
+ <li><p>Let <var title="">tracks</var> be the subset of
+ <var title="">video</var>'s <a href=#list-of-timed-tracks>list of timed tracks</a> that
have as their <a href=#rules-for-updating-the-timed-track-rendering>rules for updating the timed track
rendering</a> these <a href=#rules-for-updating-the-display-of-websrt-timed-tracks>rules for updating the display of
WebSRT timed tracks</a>, and whose <a href=#timed-track-mode>timed track mode</a>
@@ -86430,11 +86441,21 @@
<p>If the <i>paragraph embedding level</i> determined in the
previous step is even (the <i>paragraph direction</i> is
- left-to-right), let <var title="">direction</var> be <i>ltr</i>,
- otherwise, let it be <i>rtl</i>.</p>
+ left-to-right), let <var title="">direction</var> be 'ltr',
+ otherwise, let it be 'rtl'.</p>
</li>
+ <li><p>If the <a href=#timed-track-cue-writing-direction>timed track cue writing direction</a> is
+ <a href=#timed-track-cue-horizontal-writing-direction title="timed track cue horizontal writing
+ direction">horizontal</a>, then let <var title="">block-flow</var> be 'tb'. Otherwise, if the <a href=#timed-track-cue-writing-direction>timed
+ track cue writing direction</a> is <a href=#timed-track-cue-vertical-growing-left-writing-direction title="timed track
+ cue vertical growing left writing direction">vertical growing
+ left</a>, then let <var title="">block-flow</var> be
+ 'lr'. Otherwise, the <a href=#timed-track-cue-writing-direction>timed track cue writing
+ direction</a> is <a href=#timed-track-cue-vertical-growing-right-writing-direction title="timed track cue vertical growing
+ right writing direction">vertical growing right</a>; let <var title="">block-flow</var> be 'rl'.</li>
+
<li>
<p>Determine the value of <var title="">maximum size</var> for
@@ -86443,10 +86464,10 @@
<dl class=switch><dt>If the <a href=#timed-track-cue-writing-direction>timed track cue writing direction</a> is <a href=#timed-track-cue-horizontal-writing-direction title="timed track cue horizontal writing direction">horizontal</a>,
the <a href=#timed-track-cue-alignment>timed track cue alignment</a> is <a href=#timed-track-cue-start-alignment title="timed track cue start alignment">start</a>,
- and <var title="">direction</var> is <i>ltr</i></dt>
+ and <var title="">direction</var> is 'ltr'</dt>
<dt>If the <a href=#timed-track-cue-writing-direction>timed track cue writing direction</a> is <a href=#timed-track-cue-horizontal-writing-direction title="timed track cue horizontal writing direction">horizontal</a>,
the <a href=#timed-track-cue-alignment>timed track cue alignment</a> is <a href=#timed-track-cue-end-alignment title="timed track cue end alignment">end</a>,
- and <var title="">direction</var> is <i>rtl</i></dt>
+ and <var title="">direction</var> is 'rtl'</dt>
<dt>If the <a href=#timed-track-cue-writing-direction>timed track cue writing direction</a> is <a href=#timed-track-cue-vertical-growing-left-writing-direction title="timed track cue vertical growing left writing direction">vertical growing left</a>,
and the <a href=#timed-track-cue-alignment>timed track cue alignment</a> is <a href=#timed-track-cue-start-alignment title="timed track cue start alignment">start</a></dt>
<dt>If the <a href=#timed-track-cue-writing-direction>timed track cue writing direction</a> is <a href=#timed-track-cue-vertical-growing-right-writing-direction title="timed track cue vertical growing right writing direction">vertical growing right</a>,
@@ -86458,10 +86479,10 @@
<dt>If the <a href=#timed-track-cue-writing-direction>timed track cue writing direction</a> is <a href=#timed-track-cue-horizontal-writing-direction title="timed track cue horizontal writing direction">horizontal</a>,
the <a href=#timed-track-cue-alignment>timed track cue alignment</a> is <a href=#timed-track-cue-end-alignment title="timed track cue end alignment">end</a>,
- and <var title="">direction</var> is <i>ltr</i></dt>
+ and <var title="">direction</var> is 'ltr'</dt>
<dt>If the <a href=#timed-track-cue-writing-direction>timed track cue writing direction</a> is <a href=#timed-track-cue-horizontal-writing-direction title="timed track cue horizontal writing direction">horizontal</a>,
the <a href=#timed-track-cue-alignment>timed track cue alignment</a> is <a href=#timed-track-cue-start-alignment title="timed track cue start alignment">start</a>,
- and <var title="">direction</var> is <i>rtl</i></dt>
+ and <var title="">direction</var> is 'rtl'</dt>
<dt>If the <a href=#timed-track-cue-writing-direction>timed track cue writing direction</a> is <a href=#timed-track-cue-vertical-growing-left-writing-direction title="timed track cue vertical growing left writing direction">vertical growing left</a>,
and the <a href=#timed-track-cue-alignment>timed track cue alignment</a> is <a href=#timed-track-cue-end-alignment title="timed track cue end alignment">end</a></dt>
<dt>If the <a href=#timed-track-cue-writing-direction>timed track cue writing direction</a> is <a href=#timed-track-cue-vertical-growing-right-writing-direction title="timed track cue vertical growing right writing direction">vertical growing right</a>,
@@ -86474,11 +86495,11 @@
<dt>If the <a href=#timed-track-cue-writing-direction>timed track cue writing direction</a> is <a href=#timed-track-cue-horizontal-writing-direction title="timed track cue horizontal writing direction">horizontal</a>,
the <a href=#timed-track-cue-alignment>timed track cue alignment</a> is <a href=#timed-track-cue-middle-alignment title="timed track cue middle alignment">middle</a>,
the <a href=#timed-track-cue-text-position>timed track cue text position</a> is less than or equal to 50,
- and <var title="">direction</var> is <i>ltr</i></dt>
+ and <var title="">direction</var> is 'ltr'</dt>
<dt>If the <a href=#timed-track-cue-writing-direction>timed track cue writing direction</a> is <a href=#timed-track-cue-horizontal-writing-direction title="timed track cue horizontal writing direction">horizontal</a>,
the <a href=#timed-track-cue-alignment>timed track cue alignment</a> is <a href=#timed-track-cue-middle-alignment title="timed track cue middle alignment">middle</a>,
the <a href=#timed-track-cue-text-position>timed track cue text position</a> is greater than <!-- or equal to --> 50,
- and <var title="">direction</var> is <i>rtl</i></dt>
+ and <var title="">direction</var> is 'rtl'</dt>
<dt>If the <a href=#timed-track-cue-writing-direction>timed track cue writing direction</a> is <a href=#timed-track-cue-vertical-growing-left-writing-direction title="timed track cue vertical growing left writing direction">vertical growing left</a>,
the <a href=#timed-track-cue-alignment>timed track cue alignment</a> is <a href=#timed-track-cue-middle-alignment title="timed track cue middle alignment">middle</a>,
and the <a href=#timed-track-cue-text-position>timed track cue text position</a> is less than or equal to 50</dt>
@@ -86493,11 +86514,11 @@
<dt>If the <a href=#timed-track-cue-writing-direction>timed track cue writing direction</a> is <a href=#timed-track-cue-horizontal-writing-direction title="timed track cue horizontal writing direction">horizontal</a>,
the <a href=#timed-track-cue-alignment>timed track cue alignment</a> is <a href=#timed-track-cue-middle-alignment title="timed track cue middle alignment">middle</a>,
the <a href=#timed-track-cue-text-position>timed track cue text position</a> is greater than <!-- or equal to --> 50,
- and <var title="">direction</var> is <i>ltr</i></dt>
+ and <var title="">direction</var> is 'ltr'</dt>
<dt>If the <a href=#timed-track-cue-writing-direction>timed track cue writing direction</a> is <a href=#timed-track-cue-horizontal-writing-direction title="timed track cue horizontal writing direction">horizontal</a>,
the <a href=#timed-track-cue-alignment>timed track cue alignment</a> is <a href=#timed-track-cue-middle-alignment title="timed track cue middle alignment">middle</a>,
the <a href=#timed-track-cue-text-position>timed track cue text position</a> is less than or equal to 50,
- and <var title="">direction</var> is <i>rtl</i></dt>
+ and <var title="">direction</var> is 'rtl'</dt>
<dt>If the <a href=#timed-track-cue-writing-direction>timed track cue writing direction</a> is <a href=#timed-track-cue-vertical-growing-left-writing-direction title="timed track cue vertical growing left writing direction">vertical growing left</a>,
the <a href=#timed-track-cue-alignment>timed track cue alignment</a> is <a href=#timed-track-cue-middle-alignment title="timed track cue middle alignment">middle</a>,
and the <a href=#timed-track-cue-text-position>timed track cue text position</a> is greater than <!-- or equal to --> 50</dt>
@@ -86514,6 +86535,14 @@
<li><p>If the <a href=#timed-track-cue-size>timed track cue size</a> is less than <var title="">maximum size</var>, then let <var title="">size</var> be
<a href=#timed-track-cue-size>timed track cue size</a>. Otherwise, let <var title="">size</var> be <var title="">maximum size</var>.</li>
+ <li><p>If the <a href=#timed-track-cue-writing-direction>timed track cue writing direction</a> is
+ <a href=#timed-track-cue-horizontal-writing-direction title="timed track cue horizontal writing
+ direction">horizontal</a>, then let <var title="">width</var>
+ be '<var title="">size</var>vw' and <var title="">height</var> be
+ 'auto'. Otherwise, let <var title="">width</var> be 'auto' and
+ <var title="">height</var> be '<var title="">size</var>vh'. (These are CSS values used by the next
+ section to set CSS properties for the rendering.)</li>
+
<li><p></p>
<pre class=XXX>
@@ -86565,13 +86594,25 @@
<li>No style sheets are associated with <var title="">nodes</var>.</li>
- <li>All properties have their initial values, except as
+ <li>Runs of children of <a href=#websrt-ruby-object title="WebSRT Ruby Object">WebSRT
+ Ruby Objects</a> that are not <a href=#websrt-ruby-text-object title="WebSRT Ruby Text
+ Object">WebSRT Ruby Text Objects</a> must be wrapped in
+ anonymous boxes whose 'display' property has the value
+ 'ruby-base'. <a href=#refsCSSRUBY>[CSSRUBY]</a></li>
+
+ <li>All properties on <a href=#websrt-node-object title="WebSRT Node Object">WebSRT
+ Node Objects</a> have their initial values, except as
explicitly overridden for specific nodes in the next
section.</li>
- <li>The viewport (and initial containing block) is the
- <a href=#media-element>media element</a>'s rendering area.</li>
+ <li>Text runs must be wrapped at the edge of their containing
+ blocks, regardless of the value of the 'white-space' property,
+ even if doing so requires splitting a word where there is no
+ line breaking opportunity.</li>
+ <li>The viewport (and initial containing block) is
+ <var title="">video</var>'s rendering area.</li>
+
</ul><p>Let <var title="">boxes</var> be the boxes generated as
descendants of the initial containing block, along with their
positions.</p>
@@ -86609,8 +86650,8 @@
<li><p>If there are any line boxes in the (possibly now
repositioned) <var title="">boxes</var> that do not completely
- fit inside the <a href=#media-element>media element</a>'s rendering area,
- remove those offending line boxes from <var title="">boxes</var>.</li>
+ fit inside <var title="">video</var>'s rendering area, remove
+ those offending line boxes from <var title="">boxes</var>.</li>
<li><p>Let <var title="">cue</var>'s <a href=#timed-track-cue-display-state>timed track cue
display state</a> have the CSS boxes in <var title="">boxes</var>.</li>
@@ -86621,11 +86662,59 @@
<li><p>Return <var title="">output</var>.</li>
- </ol><h5 id=css-extensions><span class=secno>14.3.2.2 </span>CSS extensions</h5>
+ </ol><h5 id=applying-css-properties-to-websrt-node-objects><span class=secno>14.3.2.2 </span>Applying CSS properties to <a href=#websrt-node-object title="WebSRT Node Object">WebSRT Node Objects</a></h5>
- <p class=note>This section is intended to be moved to a CSS
- specification once an editor is found to run with it.</p>
+ <p>When following the <a href=#rules-for-updating-the-display-of-websrt-timed-tracks>rules for updating the display of WebSRT
+ timed tracks</a>, user agents must set properties of <a href=#websrt-node-object title="WebSRT Node Object">WebSRT Node Objects</a> as defined in
+ this section. <a href=#refsCSS>[CSS]</a></p>
+ <p>On the (root) <a href=#list-of-websrt-node-objects>List of WebSRT Node Objects</a>, the
+ 'position' property must be set to 'absolute', the 'direction'
+ property must be set to <var title="">direction</var>, the
+ 'block-flow' property must be set to <var title="">block-flow</var>,
+ the 'top' property must be set to <var title="">top</var>, the
+ 'left' property must be set to <var title="">left</var>, the 'width'
+ property must be set to <var title="">width</var>, and the 'height'
+ property must be set to <var title="">height</var>, where <var title="">direction</var>, <var title="">block-flow</var>, <var title="">top</var>, <var title="">left</var>, <var title="">width</var>, and <var title="">height</var> are the values
+ with those names determined by the <a href=#rules-for-updating-the-display-of-websrt-timed-tracks>rules for updating the
+ display of WebSRT timed tracks</a> for the <a href=#timed-track-cue>timed track
+ cue</a> from whose <a href=#timed-track-cue-text title="timed track cue text">text</a>
+ the <a href=#list-of-websrt-node-objects>List of WebSRT Node Objects</a> was constructed.</p>
+
+ <p>The 'font' shorthand property on the (root) <a href=#list-of-websrt-node-objects>List of WebSRT
+ Node Objects</a> must be set to '0.1vh sans-serif'. <a href=#refsCSSRUBY>[CSSRUBY]</a> <a href=#refsCSSVALUES>[CSSVALUES]</a></p>
+
+ <p>The 'color' property on the (root) <a href=#list-of-websrt-node-objects>List of WebSRT Node
+ Objects</a> must be set to 'rgba(255,255,255,0)'. <a href=#refsCSSCOLOR>[CSSCOLOR]</a></p>
+
+ <p>The 'background' shorthand property on the (root) <a href=#list-of-websrt-node-objects>List of
+ WebSRT Node Objects</a> must be set to 'rgba(0,0,0,0.8)'. <a href=#refsCSSCOLOR>[CSSCOLOR]</a></p>
+
+ <p>A text outline or stroke may also be set on the (root) <a href=#list-of-websrt-node-objects>List
+ of WebSRT Node Objects</a>, if supported.</p> <!-- 'text-outline'
+ is in CSS3 Text, but Tab says that's awaiting medical attention. -->
+
+ <p>The 'font-style' property on <a href=#websrt-italic-object title="WebSRT Italic
+ Object">WebSRT Italic Objects</a> must be set to 'italic'.</p>
+ <p>The 'font-weight' property on <a href=#websrt-bold-object title="WebSRT Bold
+ Object">WebSRT Bold Objects</a> must be set to 'bold'.</p>
+
+ <p>The 'display' property on <a href=#websrt-ruby-object title="WebSRT Ruby Object">WebSRT
+ Ruby Objects</a> must be set to 'ruby'. <a href=#refsCSSRUBY>[CSSRUBY]</a></p>
+
+ <p>The 'display' property on <a href=#websrt-ruby-text-object title="WebSRT Ruby Text
+ Object">WebSRT Ruby Text Objects</a> must be set to
+ 'ruby-text'. <a href=#refsCSSRUBY>[CSSRUBY]</a></p>
+
+ <p>If there are style sheets that apply to the <a href=#media-element>media
+ element</a> or other playback mechanism, then they must be
+ interpreted as defined in the next section.</p>
+
+ <p>All other properties must be set to their initial values.</p>
+
+
+ <h5 id=css-extensions><span class=secno>14.3.2.3 </span>CSS extensions</h5>
+
<p>When a user agent is rendering one or more <a href=#timed-track-cue title="timed
track cue">timed track cues</a> according to the <a href=#websrt-cue-text-rendering-rules>WebSRT cue
text rendering rules</a>, <a href=#websrt-node-object title="WebSRT Node Object">WebSRT
@@ -86641,8 +86730,6 @@
<!-- XXX
- map display types
-
rules for rendering the list of active cues:
- for each segment, decide if it's before or after the current
playback position.
@@ -86666,8 +86753,6 @@
- outline
- anything else that doesn't affect the size or position or kind of CSS boxes
- force wrapping at viewport edge
-
-->
<p class=XXX>...</p>
@@ -93007,10 +93092,17 @@
<dd><cite><a href=http://dev.w3.org/csswg/cssom/>Cascading Style Sheets
Object Model (CSSOM)</a></cite>, A. van Kesteren. W3C.</dd>
+ <dt id=refsCSSRUBY>[CSSRUBY]</dt>
+ <dd><cite><a href=http://dev.w3.org/csswg/css3-ruby/>CSS3 Ruby
+ Module</a></cite>, R. Ishida. W3C.</dd>
+
<dt id=refsCSSUI>[CSSUI]</dt>
<dd><cite><a href=http://www.w3.org/TR/css3-ui/>CSS3 Basic User
Interface Module</a></cite>, T. Çelik. W3C.</dd>
+ <dt id=refsCSSVALUES>[CSSVALUES]</dt>
+ <dd><cite><a href=http://dev.w3.org/csswg/css3-values/>CSS3 Values and Units</a></cite>, H. Lie, C. Lilley. W3C.</dd>
+
<dt id=refsDOMCORE>[DOMCORE]</dt>
<dd><cite><a href=http://www.w3.org/TR/DOM-Level-3-Core/>Document
Object Model (DOM) Level 3 Core Specification</a></cite>, A. Le
Modified: index
===================================================================
--- index 2010-07-12 22:26:49 UTC (rev 5150)
+++ index 2010-07-13 00:44:31 UTC (rev 5151)
@@ -213,7 +213,7 @@
<header class=head id=head><p><a class=logo href=http://www.whatwg.org/ rel=home><img alt=WHATWG src=/images/logo></a></p>
<hgroup><h1>HTML5 (including next generation additions still in development)</h1>
- <h2 class="no-num no-toc">Draft Standard — 12 July 2010</h2>
+ <h2 class="no-num no-toc">Draft Standard — 13 July 2010</h2>
</hgroup><p>You can take part in this work. <a href=http://www.whatwg.org/mailing-list>Join the working group's discussion list.</a></p>
<p><strong>Web designers!</strong> We have a <a href=http://blog.whatwg.org/faq/>FAQ</a>, a <a href=http://forums.whatwg.org/>forum</a>, and a <a href=http://www.whatwg.org/mailing-list#help>help mailing list</a> for you!</p>
<!--<p class="impl"><strong>Implementors!</strong> We have a <a href="http://www.whatwg.org/mailing-list#implementors">mailing list</a> for you too!</p>-->
@@ -1163,7 +1163,8 @@
<li><a href=#timed-tracks-0><span class=secno>12.3.2 </span>Timed tracks</a>
<ol>
<li><a href=#websrt-cue-text-rendering-rules><span class=secno>12.3.2.1 </span>WebSRT cue text rendering rules</a></li>
- <li><a href=#css-extensions><span class=secno>12.3.2.2 </span>CSS extensions</a></ol></li>
+ <li><a href=#applying-css-properties-to-websrt-node-objects><span class=secno>12.3.2.2 </span>Applying CSS properties to WebSRT Node Objects</a></li>
+ <li><a href=#css-extensions><span class=secno>12.3.2.3 </span>CSS extensions</a></ol></li>
<li><a href=#images-0><span class=secno>12.3.3 </span>Images</a></li>
<li><a href=#attributes-for-embedded-content-and-images><span class=secno>12.3.4 </span>Attributes for embedded content and images</a></li>
<li><a href=#image-maps-0><span class=secno>12.3.5 </span>Image maps</a></li>
@@ -78668,7 +78669,7 @@
<p>For the purposes of the CSS ruby model, runs of children of
<code><a href=#the-ruby-element>ruby</a></code> elements that are not <code><a href=#the-rt-element>rt</a></code> or
<code><a href=#the-rp-element>rp</a></code> elements are expected to be wrapped in anonymous
- boxes whose 'display' property has the value 'ruby-base'.</p>
+ boxes whose 'display' property has the value 'ruby-base'. <a href=#refsCSSRUBY>[CSSRUBY]</a></p>
<p>User agents that do not support correct ruby rendering are
expected to render parentheses around the text of <code><a href=#the-rt-element>rt</a></code>
@@ -79602,29 +79603,39 @@
<h4 id=timed-tracks-0><span class=secno>12.3.2 </span>Timed tracks</h4>
+ <p class=note>This section is intended to be moved to its own CSS
+ module once an editor is found to run with it.</p>
+
<h5 id=websrt-cue-text-rendering-rules><span class=secno>12.3.2.1 </span><dfn>WebSRT cue text rendering rules</dfn></h5>
<p>The <dfn id=rules-for-updating-the-display-of-websrt-timed-tracks>rules for updating the display of WebSRT timed
tracks</dfn> render the <a href=#timed-track title="timed track">timed
tracks</a> of a <a href=#media-element>media element</a> (specifically, a
- <code><a href=#video>video</a></code> element) by applying the steps below. All the
- <a href=#timed-track title="timed track">timed tracks</a> that use these rules
- for a given <a href=#media-element>media element</a> are rendered together, to
- avoid overlapping subtitles from multiple tracks.</p>
+ <code><a href=#video>video</a></code> element), or of another playback mechanism, by
+ applying the steps below. All the <a href=#timed-track title="timed track">timed
+ tracks</a> that use these rules for a given <a href=#media-element>media
+ element</a>, or other playback mechanism, are rendered together,
+ to avoid overlapping subtitles from multiple tracks.</p>
<p>The output of the steps below is a set of CSS boxes that covers
- the rendering area of the <code><a href=#video>video</a></code> element.</p>
+ the rendering area of the <a href=#media-element>media element</a> or other
+ playback mechanism, which user agents are expected to render in a
+ manner suiting the user.</p>
<p>The rules are as follows:</p>
<ol><li><p>If the <a href=#media-element>media element</a> is an <code><a href=#audio>audio</a></code>
- element, abort these steps. There is nothing to render.</li>
+ element, or is another playback mechanism with no rendering area,
+ abort these steps. There is nothing to render.</li>
+ <li><p>Let <var title="">video</var> be the <a href=#media-element>media
+ element</a> or other playback mechanism.</li>
+
<li><p>Let <var title="">output</var> be an empty list of
absolutely positioned CSS block boxes.</li>
- <li><p>Let <var title="">tracks</var> be the subset of the
- <a href=#media-element>media element</a>'s <a href=#list-of-timed-tracks>list of timed tracks</a> that
+ <li><p>Let <var title="">tracks</var> be the subset of
+ <var title="">video</var>'s <a href=#list-of-timed-tracks>list of timed tracks</a> that
have as their <a href=#rules-for-updating-the-timed-track-rendering>rules for updating the timed track
rendering</a> these <a href=#rules-for-updating-the-display-of-websrt-timed-tracks>rules for updating the display of
WebSRT timed tracks</a>, and whose <a href=#timed-track-mode>timed track mode</a>
@@ -79671,11 +79682,21 @@
<p>If the <i>paragraph embedding level</i> determined in the
previous step is even (the <i>paragraph direction</i> is
- left-to-right), let <var title="">direction</var> be <i>ltr</i>,
- otherwise, let it be <i>rtl</i>.</p>
+ left-to-right), let <var title="">direction</var> be 'ltr',
+ otherwise, let it be 'rtl'.</p>
</li>
+ <li><p>If the <a href=#timed-track-cue-writing-direction>timed track cue writing direction</a> is
+ <a href=#timed-track-cue-horizontal-writing-direction title="timed track cue horizontal writing
+ direction">horizontal</a>, then let <var title="">block-flow</var> be 'tb'. Otherwise, if the <a href=#timed-track-cue-writing-direction>timed
+ track cue writing direction</a> is <a href=#timed-track-cue-vertical-growing-left-writing-direction title="timed track
+ cue vertical growing left writing direction">vertical growing
+ left</a>, then let <var title="">block-flow</var> be
+ 'lr'. Otherwise, the <a href=#timed-track-cue-writing-direction>timed track cue writing
+ direction</a> is <a href=#timed-track-cue-vertical-growing-right-writing-direction title="timed track cue vertical growing
+ right writing direction">vertical growing right</a>; let <var title="">block-flow</var> be 'rl'.</li>
+
<li>
<p>Determine the value of <var title="">maximum size</var> for
@@ -79684,10 +79705,10 @@
<dl class=switch><dt>If the <a href=#timed-track-cue-writing-direction>timed track cue writing direction</a> is <a href=#timed-track-cue-horizontal-writing-direction title="timed track cue horizontal writing direction">horizontal</a>,
the <a href=#timed-track-cue-alignment>timed track cue alignment</a> is <a href=#timed-track-cue-start-alignment title="timed track cue start alignment">start</a>,
- and <var title="">direction</var> is <i>ltr</i></dt>
+ and <var title="">direction</var> is 'ltr'</dt>
<dt>If the <a href=#timed-track-cue-writing-direction>timed track cue writing direction</a> is <a href=#timed-track-cue-horizontal-writing-direction title="timed track cue horizontal writing direction">horizontal</a>,
the <a href=#timed-track-cue-alignment>timed track cue alignment</a> is <a href=#timed-track-cue-end-alignment title="timed track cue end alignment">end</a>,
- and <var title="">direction</var> is <i>rtl</i></dt>
+ and <var title="">direction</var> is 'rtl'</dt>
<dt>If the <a href=#timed-track-cue-writing-direction>timed track cue writing direction</a> is <a href=#timed-track-cue-vertical-growing-left-writing-direction title="timed track cue vertical growing left writing direction">vertical growing left</a>,
and the <a href=#timed-track-cue-alignment>timed track cue alignment</a> is <a href=#timed-track-cue-start-alignment title="timed track cue start alignment">start</a></dt>
<dt>If the <a href=#timed-track-cue-writing-direction>timed track cue writing direction</a> is <a href=#timed-track-cue-vertical-growing-right-writing-direction title="timed track cue vertical growing right writing direction">vertical growing right</a>,
@@ -79699,10 +79720,10 @@
<dt>If the <a href=#timed-track-cue-writing-direction>timed track cue writing direction</a> is <a href=#timed-track-cue-horizontal-writing-direction title="timed track cue horizontal writing direction">horizontal</a>,
the <a href=#timed-track-cue-alignment>timed track cue alignment</a> is <a href=#timed-track-cue-end-alignment title="timed track cue end alignment">end</a>,
- and <var title="">direction</var> is <i>ltr</i></dt>
+ and <var title="">direction</var> is 'ltr'</dt>
<dt>If the <a href=#timed-track-cue-writing-direction>timed track cue writing direction</a> is <a href=#timed-track-cue-horizontal-writing-direction title="timed track cue horizontal writing direction">horizontal</a>,
the <a href=#timed-track-cue-alignment>timed track cue alignment</a> is <a href=#timed-track-cue-start-alignment title="timed track cue start alignment">start</a>,
- and <var title="">direction</var> is <i>rtl</i></dt>
+ and <var title="">direction</var> is 'rtl'</dt>
<dt>If the <a href=#timed-track-cue-writing-direction>timed track cue writing direction</a> is <a href=#timed-track-cue-vertical-growing-left-writing-direction title="timed track cue vertical growing left writing direction">vertical growing left</a>,
and the <a href=#timed-track-cue-alignment>timed track cue alignment</a> is <a href=#timed-track-cue-end-alignment title="timed track cue end alignment">end</a></dt>
<dt>If the <a href=#timed-track-cue-writing-direction>timed track cue writing direction</a> is <a href=#timed-track-cue-vertical-growing-right-writing-direction title="timed track cue vertical growing right writing direction">vertical growing right</a>,
@@ -79715,11 +79736,11 @@
<dt>If the <a href=#timed-track-cue-writing-direction>timed track cue writing direction</a> is <a href=#timed-track-cue-horizontal-writing-direction title="timed track cue horizontal writing direction">horizontal</a>,
the <a href=#timed-track-cue-alignment>timed track cue alignment</a> is <a href=#timed-track-cue-middle-alignment title="timed track cue middle alignment">middle</a>,
the <a href=#timed-track-cue-text-position>timed track cue text position</a> is less than or equal to 50,
- and <var title="">direction</var> is <i>ltr</i></dt>
+ and <var title="">direction</var> is 'ltr'</dt>
<dt>If the <a href=#timed-track-cue-writing-direction>timed track cue writing direction</a> is <a href=#timed-track-cue-horizontal-writing-direction title="timed track cue horizontal writing direction">horizontal</a>,
the <a href=#timed-track-cue-alignment>timed track cue alignment</a> is <a href=#timed-track-cue-middle-alignment title="timed track cue middle alignment">middle</a>,
the <a href=#timed-track-cue-text-position>timed track cue text position</a> is greater than <!-- or equal to --> 50,
- and <var title="">direction</var> is <i>rtl</i></dt>
+ and <var title="">direction</var> is 'rtl'</dt>
<dt>If the <a href=#timed-track-cue-writing-direction>timed track cue writing direction</a> is <a href=#timed-track-cue-vertical-growing-left-writing-direction title="timed track cue vertical growing left writing direction">vertical growing left</a>,
the <a href=#timed-track-cue-alignment>timed track cue alignment</a> is <a href=#timed-track-cue-middle-alignment title="timed track cue middle alignment">middle</a>,
and the <a href=#timed-track-cue-text-position>timed track cue text position</a> is less than or equal to 50</dt>
@@ -79734,11 +79755,11 @@
<dt>If the <a href=#timed-track-cue-writing-direction>timed track cue writing direction</a> is <a href=#timed-track-cue-horizontal-writing-direction title="timed track cue horizontal writing direction">horizontal</a>,
the <a href=#timed-track-cue-alignment>timed track cue alignment</a> is <a href=#timed-track-cue-middle-alignment title="timed track cue middle alignment">middle</a>,
the <a href=#timed-track-cue-text-position>timed track cue text position</a> is greater than <!-- or equal to --> 50,
- and <var title="">direction</var> is <i>ltr</i></dt>
+ and <var title="">direction</var> is 'ltr'</dt>
<dt>If the <a href=#timed-track-cue-writing-direction>timed track cue writing direction</a> is <a href=#timed-track-cue-horizontal-writing-direction title="timed track cue horizontal writing direction">horizontal</a>,
the <a href=#timed-track-cue-alignment>timed track cue alignment</a> is <a href=#timed-track-cue-middle-alignment title="timed track cue middle alignment">middle</a>,
the <a href=#timed-track-cue-text-position>timed track cue text position</a> is less than or equal to 50,
- and <var title="">direction</var> is <i>rtl</i></dt>
+ and <var title="">direction</var> is 'rtl'</dt>
<dt>If the <a href=#timed-track-cue-writing-direction>timed track cue writing direction</a> is <a href=#timed-track-cue-vertical-growing-left-writing-direction title="timed track cue vertical growing left writing direction">vertical growing left</a>,
the <a href=#timed-track-cue-alignment>timed track cue alignment</a> is <a href=#timed-track-cue-middle-alignment title="timed track cue middle alignment">middle</a>,
and the <a href=#timed-track-cue-text-position>timed track cue text position</a> is greater than <!-- or equal to --> 50</dt>
@@ -79755,6 +79776,14 @@
<li><p>If the <a href=#timed-track-cue-size>timed track cue size</a> is less than <var title="">maximum size</var>, then let <var title="">size</var> be
<a href=#timed-track-cue-size>timed track cue size</a>. Otherwise, let <var title="">size</var> be <var title="">maximum size</var>.</li>
+ <li><p>If the <a href=#timed-track-cue-writing-direction>timed track cue writing direction</a> is
+ <a href=#timed-track-cue-horizontal-writing-direction title="timed track cue horizontal writing
+ direction">horizontal</a>, then let <var title="">width</var>
+ be '<var title="">size</var>vw' and <var title="">height</var> be
+ 'auto'. Otherwise, let <var title="">width</var> be 'auto' and
+ <var title="">height</var> be '<var title="">size</var>vh'. (These are CSS values used by the next
+ section to set CSS properties for the rendering.)</li>
+
<li><p></p>
<pre class=XXX>
@@ -79806,13 +79835,25 @@
<li>No style sheets are associated with <var title="">nodes</var>.</li>
- <li>All properties have their initial values, except as
+ <li>Runs of children of <a href=#websrt-ruby-object title="WebSRT Ruby Object">WebSRT
+ Ruby Objects</a> that are not <a href=#websrt-ruby-text-object title="WebSRT Ruby Text
+ Object">WebSRT Ruby Text Objects</a> must be wrapped in
+ anonymous boxes whose 'display' property has the value
+ 'ruby-base'. <a href=#refsCSSRUBY>[CSSRUBY]</a></li>
+
+ <li>All properties on <a href=#websrt-node-object title="WebSRT Node Object">WebSRT
+ Node Objects</a> have their initial values, except as
explicitly overridden for specific nodes in the next
section.</li>
- <li>The viewport (and initial containing block) is the
- <a href=#media-element>media element</a>'s rendering area.</li>
+ <li>Text runs must be wrapped at the edge of their containing
+ blocks, regardless of the value of the 'white-space' property,
+ even if doing so requires splitting a word where there is no
+ line breaking opportunity.</li>
+ <li>The viewport (and initial containing block) is
+ <var title="">video</var>'s rendering area.</li>
+
</ul><p>Let <var title="">boxes</var> be the boxes generated as
descendants of the initial containing block, along with their
positions.</p>
@@ -79850,8 +79891,8 @@
<li><p>If there are any line boxes in the (possibly now
repositioned) <var title="">boxes</var> that do not completely
- fit inside the <a href=#media-element>media element</a>'s rendering area,
- remove those offending line boxes from <var title="">boxes</var>.</li>
+ fit inside <var title="">video</var>'s rendering area, remove
+ those offending line boxes from <var title="">boxes</var>.</li>
<li><p>Let <var title="">cue</var>'s <a href=#timed-track-cue-display-state>timed track cue
display state</a> have the CSS boxes in <var title="">boxes</var>.</li>
@@ -79862,11 +79903,59 @@
<li><p>Return <var title="">output</var>.</li>
- </ol><h5 id=css-extensions><span class=secno>12.3.2.2 </span>CSS extensions</h5>
+ </ol><h5 id=applying-css-properties-to-websrt-node-objects><span class=secno>12.3.2.2 </span>Applying CSS properties to <a href=#websrt-node-object title="WebSRT Node Object">WebSRT Node Objects</a></h5>
- <p class=note>This section is intended to be moved to a CSS
- specification once an editor is found to run with it.</p>
+ <p>When following the <a href=#rules-for-updating-the-display-of-websrt-timed-tracks>rules for updating the display of WebSRT
+ timed tracks</a>, user agents must set properties of <a href=#websrt-node-object title="WebSRT Node Object">WebSRT Node Objects</a> as defined in
+ this section. <a href=#refsCSS>[CSS]</a></p>
+ <p>On the (root) <a href=#list-of-websrt-node-objects>List of WebSRT Node Objects</a>, the
+ 'position' property must be set to 'absolute', the 'direction'
+ property must be set to <var title="">direction</var>, the
+ 'block-flow' property must be set to <var title="">block-flow</var>,
+ the 'top' property must be set to <var title="">top</var>, the
+ 'left' property must be set to <var title="">left</var>, the 'width'
+ property must be set to <var title="">width</var>, and the 'height'
+ property must be set to <var title="">height</var>, where <var title="">direction</var>, <var title="">block-flow</var>, <var title="">top</var>, <var title="">left</var>, <var title="">width</var>, and <var title="">height</var> are the values
+ with those names determined by the <a href=#rules-for-updating-the-display-of-websrt-timed-tracks>rules for updating the
+ display of WebSRT timed tracks</a> for the <a href=#timed-track-cue>timed track
+ cue</a> from whose <a href=#timed-track-cue-text title="timed track cue text">text</a>
+ the <a href=#list-of-websrt-node-objects>List of WebSRT Node Objects</a> was constructed.</p>
+
+ <p>The 'font' shorthand property on the (root) <a href=#list-of-websrt-node-objects>List of WebSRT
+ Node Objects</a> must be set to '0.1vh sans-serif'. <a href=#refsCSSRUBY>[CSSRUBY]</a> <a href=#refsCSSVALUES>[CSSVALUES]</a></p>
+
+ <p>The 'color' property on the (root) <a href=#list-of-websrt-node-objects>List of WebSRT Node
+ Objects</a> must be set to 'rgba(255,255,255,0)'. <a href=#refsCSSCOLOR>[CSSCOLOR]</a></p>
+
+ <p>The 'background' shorthand property on the (root) <a href=#list-of-websrt-node-objects>List of
+ WebSRT Node Objects</a> must be set to 'rgba(0,0,0,0.8)'. <a href=#refsCSSCOLOR>[CSSCOLOR]</a></p>
+
+ <p>A text outline or stroke may also be set on the (root) <a href=#list-of-websrt-node-objects>List
+ of WebSRT Node Objects</a>, if supported.</p> <!-- 'text-outline'
+ is in CSS3 Text, but Tab says that's awaiting medical attention. -->
+
+ <p>The 'font-style' property on <a href=#websrt-italic-object title="WebSRT Italic
+ Object">WebSRT Italic Objects</a> must be set to 'italic'.</p>
+ <p>The 'font-weight' property on <a href=#websrt-bold-object title="WebSRT Bold
+ Object">WebSRT Bold Objects</a> must be set to 'bold'.</p>
+
+ <p>The 'display' property on <a href=#websrt-ruby-object title="WebSRT Ruby Object">WebSRT
+ Ruby Objects</a> must be set to 'ruby'. <a href=#refsCSSRUBY>[CSSRUBY]</a></p>
+
+ <p>The 'display' property on <a href=#websrt-ruby-text-object title="WebSRT Ruby Text
+ Object">WebSRT Ruby Text Objects</a> must be set to
+ 'ruby-text'. <a href=#refsCSSRUBY>[CSSRUBY]</a></p>
+
+ <p>If there are style sheets that apply to the <a href=#media-element>media
+ element</a> or other playback mechanism, then they must be
+ interpreted as defined in the next section.</p>
+
+ <p>All other properties must be set to their initial values.</p>
+
+
+ <h5 id=css-extensions><span class=secno>12.3.2.3 </span>CSS extensions</h5>
+
<p>When a user agent is rendering one or more <a href=#timed-track-cue title="timed
track cue">timed track cues</a> according to the <a href=#websrt-cue-text-rendering-rules>WebSRT cue
text rendering rules</a>, <a href=#websrt-node-object title="WebSRT Node Object">WebSRT
@@ -79882,8 +79971,6 @@
<!-- XXX
- map display types
-
rules for rendering the list of active cues:
- for each segment, decide if it's before or after the current
playback position.
@@ -79907,8 +79994,6 @@
- outline
- anything else that doesn't affect the size or position or kind of CSS boxes
- force wrapping at viewport edge
-
-->
<p class=XXX>...</p>
@@ -86384,10 +86469,17 @@
<dd><cite><a href=http://dev.w3.org/csswg/cssom/>Cascading Style Sheets
Object Model (CSSOM)</a></cite>, A. van Kesteren. W3C.</dd>
+ <dt id=refsCSSRUBY>[CSSRUBY]</dt>
+ <dd><cite><a href=http://dev.w3.org/csswg/css3-ruby/>CSS3 Ruby
+ Module</a></cite>, R. Ishida. W3C.</dd>
+
<dt id=refsCSSUI>[CSSUI]</dt>
<dd><cite><a href=http://www.w3.org/TR/css3-ui/>CSS3 Basic User
Interface Module</a></cite>, T. Çelik. W3C.</dd>
+ <dt id=refsCSSVALUES>[CSSVALUES]</dt>
+ <dd><cite><a href=http://dev.w3.org/csswg/css3-values/>CSS3 Values and Units</a></cite>, H. Lie, C. Lilley. W3C.</dd>
+
<dt id=refsDOMCORE>[DOMCORE]</dt>
<dd><cite><a href=http://www.w3.org/TR/DOM-Level-3-Core/>Document
Object Model (DOM) Level 3 Core Specification</a></cite>, A. Le
Modified: source
===================================================================
--- source 2010-07-12 22:26:49 UTC (rev 5150)
+++ source 2010-07-13 00:44:31 UTC (rev 5151)
@@ -97453,7 +97453,8 @@
<p>For the purposes of the CSS ruby model, runs of children of
<code>ruby</code> elements that are not <code>rt</code> or
<code>rp</code> elements are expected to be wrapped in anonymous
- boxes whose 'display' property has the value 'ruby-base'.</p>
+ boxes whose 'display' property has the value 'ruby-base'. <a
+ href="#refsCSSRUBY">[CSSRUBY]</a></p>
<p>User agents that do not support correct ruby rendering are
expected to render parentheses around the text of <code>rt</code>
@@ -98518,31 +98519,41 @@
<h4>Timed tracks</h4>
+ <p class="note">This section is intended to be moved to its own CSS
+ module once an editor is found to run with it.</p>
+
<h5><dfn>WebSRT cue text rendering rules</dfn></h5>
<p>The <dfn>rules for updating the display of WebSRT timed
tracks</dfn> render the <span title="timed track">timed
tracks</span> of a <span>media element</span> (specifically, a
- <code>video</code> element) by applying the steps below. All the
- <span title="timed track">timed tracks</span> that use these rules
- for a given <span>media element</span> are rendered together, to
- avoid overlapping subtitles from multiple tracks.</p>
+ <code>video</code> element), or of another playback mechanism, by
+ applying the steps below. All the <span title="timed track">timed
+ tracks</span> that use these rules for a given <span>media
+ element</span>, or other playback mechanism, are rendered together,
+ to avoid overlapping subtitles from multiple tracks.</p>
<p>The output of the steps below is a set of CSS boxes that covers
- the rendering area of the <code>video</code> element.</p>
+ the rendering area of the <span>media element</span> or other
+ playback mechanism, which user agents are expected to render in a
+ manner suiting the user.</p>
<p>The rules are as follows:</p>
<ol>
<li><p>If the <span>media element</span> is an <code>audio</code>
- element, abort these steps. There is nothing to render.</p></li>
+ element, or is another playback mechanism with no rendering area,
+ abort these steps. There is nothing to render.</p></li>
+ <li><p>Let <var title="">video</var> be the <span>media
+ element</span> or other playback mechanism.</p></li>
+
<li><p>Let <var title="">output</var> be an empty list of
absolutely positioned CSS block boxes.</p></li>
- <li><p>Let <var title="">tracks</var> be the subset of the
- <span>media element</span>'s <span>list of timed tracks</span> that
+ <li><p>Let <var title="">tracks</var> be the subset of
+ <var title="">video</var>'s <span>list of timed tracks</span> that
have as their <span>rules for updating the timed track
rendering</span> these <span>rules for updating the display of
WebSRT timed tracks</span>, and whose <span>timed track mode</span>
@@ -98603,11 +98614,23 @@
<p>If the <i>paragraph embedding level</i> determined in the
previous step is even (the <i>paragraph direction</i> is
- left-to-right), let <var title="">direction</var> be <i>ltr</i>,
- otherwise, let it be <i>rtl</i>.</p>
+ left-to-right), let <var title="">direction</var> be 'ltr',
+ otherwise, let it be 'rtl'.</p>
</li>
+ <li><p>If the <span>timed track cue writing direction</span> is
+ <span title="timed track cue horizontal writing
+ direction">horizontal</span>, then let <var
+ title="">block-flow</var> be 'tb'. Otherwise, if the <span>timed
+ track cue writing direction</span> is <span title="timed track
+ cue vertical growing left writing direction">vertical growing
+ left</span>, then let <var title="">block-flow</var> be
+ 'lr'. Otherwise, the <span>timed track cue writing
+ direction</span> is <span title="timed track cue vertical growing
+ right writing direction">vertical growing right</span>; let <var
+ title="">block-flow</var> be 'rl'.</p></li>
+
<li>
<p>Determine the value of <var title="">maximum size</var> for
@@ -98618,10 +98641,10 @@
<dt>If the <span>timed track cue writing direction</span> is <span title="timed track cue horizontal writing direction">horizontal</span>,
the <span>timed track cue alignment</span> is <span title="timed track cue start alignment">start</span>,
- and <var title="">direction</var> is <i>ltr</i></dt>
+ and <var title="">direction</var> is 'ltr'</dt>
<dt>If the <span>timed track cue writing direction</span> is <span title="timed track cue horizontal writing direction">horizontal</span>,
the <span>timed track cue alignment</span> is <span title="timed track cue end alignment">end</span>,
- and <var title="">direction</var> is <i>rtl</i></dt>
+ and <var title="">direction</var> is 'rtl'</dt>
<dt>If the <span>timed track cue writing direction</span> is <span title="timed track cue vertical growing left writing direction">vertical growing left</span>,
and the <span>timed track cue alignment</span> is <span title="timed track cue start alignment">start</span></dt>
<dt>If the <span>timed track cue writing direction</span> is <span title="timed track cue vertical growing right writing direction">vertical growing right</span>,
@@ -98633,10 +98656,10 @@
<dt>If the <span>timed track cue writing direction</span> is <span title="timed track cue horizontal writing direction">horizontal</span>,
the <span>timed track cue alignment</span> is <span title="timed track cue end alignment">end</span>,
- and <var title="">direction</var> is <i>ltr</i></dt>
+ and <var title="">direction</var> is 'ltr'</dt>
<dt>If the <span>timed track cue writing direction</span> is <span title="timed track cue horizontal writing direction">horizontal</span>,
the <span>timed track cue alignment</span> is <span title="timed track cue start alignment">start</span>,
- and <var title="">direction</var> is <i>rtl</i></dt>
+ and <var title="">direction</var> is 'rtl'</dt>
<dt>If the <span>timed track cue writing direction</span> is <span title="timed track cue vertical growing left writing direction">vertical growing left</span>,
and the <span>timed track cue alignment</span> is <span title="timed track cue end alignment">end</span></dt>
<dt>If the <span>timed track cue writing direction</span> is <span title="timed track cue vertical growing right writing direction">vertical growing right</span>,
@@ -98649,11 +98672,11 @@
<dt>If the <span>timed track cue writing direction</span> is <span title="timed track cue horizontal writing direction">horizontal</span>,
the <span>timed track cue alignment</span> is <span title="timed track cue middle alignment">middle</span>,
the <span>timed track cue text position</span> is less than or equal to 50,
- and <var title="">direction</var> is <i>ltr</i></dt>
+ and <var title="">direction</var> is 'ltr'</dt>
<dt>If the <span>timed track cue writing direction</span> is <span title="timed track cue horizontal writing direction">horizontal</span>,
the <span>timed track cue alignment</span> is <span title="timed track cue middle alignment">middle</span>,
the <span>timed track cue text position</span> is greater than <!-- or equal to --> 50,
- and <var title="">direction</var> is <i>rtl</i></dt>
+ and <var title="">direction</var> is 'rtl'</dt>
<dt>If the <span>timed track cue writing direction</span> is <span title="timed track cue vertical growing left writing direction">vertical growing left</span>,
the <span>timed track cue alignment</span> is <span title="timed track cue middle alignment">middle</span>,
and the <span>timed track cue text position</span> is less than or equal to 50</dt>
@@ -98668,11 +98691,11 @@
<dt>If the <span>timed track cue writing direction</span> is <span title="timed track cue horizontal writing direction">horizontal</span>,
the <span>timed track cue alignment</span> is <span title="timed track cue middle alignment">middle</span>,
the <span>timed track cue text position</span> is greater than <!-- or equal to --> 50,
- and <var title="">direction</var> is <i>ltr</i></dt>
+ and <var title="">direction</var> is 'ltr'</dt>
<dt>If the <span>timed track cue writing direction</span> is <span title="timed track cue horizontal writing direction">horizontal</span>,
the <span>timed track cue alignment</span> is <span title="timed track cue middle alignment">middle</span>,
the <span>timed track cue text position</span> is less than or equal to 50,
- and <var title="">direction</var> is <i>rtl</i></dt>
+ and <var title="">direction</var> is 'rtl'</dt>
<dt>If the <span>timed track cue writing direction</span> is <span title="timed track cue vertical growing left writing direction">vertical growing left</span>,
the <span>timed track cue alignment</span> is <span title="timed track cue middle alignment">middle</span>,
and the <span>timed track cue text position</span> is greater than <!-- or equal to --> 50</dt>
@@ -98693,6 +98716,15 @@
<span>timed track cue size</span>. Otherwise, let <var
title="">size</var> be <var title="">maximum size</var>.</p></li>
+ <li><p>If the <span>timed track cue writing direction</span> is
+ <span title="timed track cue horizontal writing
+ direction">horizontal</span>, then let <var title="">width</var>
+ be '<var title="">size</var>vw' and <var title="">height</var> be
+ 'auto'. Otherwise, let <var title="">width</var> be 'auto' and
+ <var title="">height</var> be '<var
+ title="">size</var>vh'. (These are CSS values used by the next
+ section to set CSS properties for the rendering.)</p></li>
+
<li><p></p>
<pre class="XXX">
@@ -98749,13 +98781,25 @@
<li>No style sheets are associated with <var
title="">nodes</var>.</li>
- <li>All properties have their initial values, except as
+ <li>Runs of children of <span title="WebSRT Ruby Object">WebSRT
+ Ruby Objects</span> that are not <span title="WebSRT Ruby Text
+ Object">WebSRT Ruby Text Objects</span> must be wrapped in
+ anonymous boxes whose 'display' property has the value
+ 'ruby-base'. <a href="#refsCSSRUBY">[CSSRUBY]</a></li>
+
+ <li>All properties on <span title="WebSRT Node Object">WebSRT
+ Node Objects</span> have their initial values, except as
explicitly overridden for specific nodes in the next
section.</li>
- <li>The viewport (and initial containing block) is the
- <span>media element</span>'s rendering area.</li>
+ <li>Text runs must be wrapped at the edge of their containing
+ blocks, regardless of the value of the 'white-space' property,
+ even if doing so requires splitting a word where there is no
+ line breaking opportunity.</li>
+ <li>The viewport (and initial containing block) is
+ <var title="">video</var>'s rendering area.</li>
+
</ul>
<p>Let <var title="">boxes</var> be the boxes generated as
@@ -98799,8 +98843,8 @@
<li><p>If there are any line boxes in the (possibly now
repositioned) <var title="">boxes</var> that do not completely
- fit inside the <span>media element</span>'s rendering area,
- remove those offending line boxes from <var
+ fit inside <var title="">video</var>'s rendering area, remove
+ those offending line boxes from <var
title="">boxes</var>.</p></li>
<li><p>Let <var title="">cue</var>'s <span>timed track cue
@@ -98819,11 +98863,68 @@
</ol>
+ <h5>Applying CSS properties to <span title="WebSRT Node Object">WebSRT Node Objects</span></h5>
+
+ <p>When following the <span>rules for updating the display of WebSRT
+ timed tracks</span>, user agents must set properties of <span
+ title="WebSRT Node Object">WebSRT Node Objects</span> as defined in
+ this section. <a href="#refsCSS">[CSS]</a></p>
+
+ <p>On the (root) <span>List of WebSRT Node Objects</span>, the
+ 'position' property must be set to 'absolute', the 'direction'
+ property must be set to <var title="">direction</var>, the
+ 'block-flow' property must be set to <var title="">block-flow</var>,
+ the 'top' property must be set to <var title="">top</var>, the
+ 'left' property must be set to <var title="">left</var>, the 'width'
+ property must be set to <var title="">width</var>, and the 'height'
+ property must be set to <var title="">height</var>, where <var
+ title="">direction</var>, <var title="">block-flow</var>, <var
+ title="">top</var>, <var title="">left</var>, <var
+ title="">width</var>, and <var title="">height</var> are the values
+ with those names determined by the <span>rules for updating the
+ display of WebSRT timed tracks</span> for the <span>timed track
+ cue</span> from whose <span title="timed track cue text">text</span>
+ the <span>List of WebSRT Node Objects</span> was constructed.</p>
+
+ <p>The 'font' shorthand property on the (root) <span>List of WebSRT
+ Node Objects</span> must be set to '0.1vh sans-serif'. <a
+ href="#refsCSSRUBY">[CSSRUBY]</a> <a
+ href="#refsCSSVALUES">[CSSVALUES]</a></p>
+
+ <p>The 'color' property on the (root) <span>List of WebSRT Node
+ Objects</span> must be set to 'rgba(255,255,255,0)'. <a
+ href="#refsCSSCOLOR">[CSSCOLOR]</a></p>
+
+ <p>The 'background' shorthand property on the (root) <span>List of
+ WebSRT Node Objects</span> must be set to 'rgba(0,0,0,0.8)'. <a
+ href="#refsCSSCOLOR">[CSSCOLOR]</a></p>
+
+ <p>A text outline or stroke may also be set on the (root) <span>List
+ of WebSRT Node Objects</span>, if supported.</p> <!-- 'text-outline'
+ is in CSS3 Text, but Tab says that's awaiting medical attention. -->
+
+ <p>The 'font-style' property on <span title="WebSRT Italic
+ Object">WebSRT Italic Objects</span> must be set to 'italic'.</p>
+ <p>The 'font-weight' property on <span title="WebSRT Bold
+ Object">WebSRT Bold Objects</span> must be set to 'bold'.</p>
+
+ <p>The 'display' property on <span title="WebSRT Ruby Object">WebSRT
+ Ruby Objects</span> must be set to 'ruby'. <a
+ href="#refsCSSRUBY">[CSSRUBY]</a></p>
+
+ <p>The 'display' property on <span title="WebSRT Ruby Text
+ Object">WebSRT Ruby Text Objects</span> must be set to
+ 'ruby-text'. <a href="#refsCSSRUBY">[CSSRUBY]</a></p>
+
+ <p>If there are style sheets that apply to the <span>media
+ element</span> or other playback mechanism, then they must be
+ interpreted as defined in the next section.</p>
+
+ <p>All other properties must be set to their initial values.</p>
+
+
<h5>CSS extensions</h5>
- <p class="note">This section is intended to be moved to a CSS
- specification once an editor is found to run with it.</p>
-
<p>When a user agent is rendering one or more <span title="timed
track cue">timed track cues</span> according to the <span>WebSRT cue
text rendering rules</span>, <span title="WebSRT Node Object">WebSRT
@@ -98839,8 +98940,6 @@
<!-- XXX
- map display types
-
rules for rendering the list of active cues:
- for each segment, decide if it's before or after the current
playback position.
@@ -98864,8 +98963,6 @@
- outline
- anything else that doesn't affect the size or position or kind of CSS boxes
- force wrapping at viewport edge
-
-->
<p class="XXX">...</p>
@@ -106634,10 +106731,17 @@
<dd><cite><a href="http://dev.w3.org/csswg/cssom/">Cascading Style Sheets
Object Model (CSSOM)</a></cite>, A. van Kesteren. W3C.</dd>
+ <dt id="refsCSSRUBY">[CSSRUBY]</dt>
+ <dd><cite><a href="http://dev.w3.org/csswg/css3-ruby/">CSS3 Ruby
+ Module</a></cite>, R. Ishida. W3C.</dd>
+
<dt id="refsCSSUI">[CSSUI]</dt>
<dd><cite><a href="http://www.w3.org/TR/css3-ui/">CSS3 Basic User
Interface Module</a></cite>, T. Çelik. W3C.</dd>
+ <dt id="refsCSSVALUES">[CSSVALUES]</dt>
+ <dd><cite><a href="http://dev.w3.org/csswg/css3-values/">CSS3 Values and Units</a></cite>, H. Lie, C. Lilley. W3C.</dd>
+
<dt id="refsDOM2HTML">[DOM2HTML]</dt>
<dd>(Non-normative) <cite><a
href="http://www.w3.org/TR/DOM-Level-2-HTML/">Document Object Model
More information about the Commit-Watchers
mailing list