[html5] r7244 - [acgiow] (0) Update <ruby>, including examples showing how each use case is addr [...]
whatwg at whatwg.org
whatwg at whatwg.org
Mon Aug 20 14:58:41 PDT 2012
Author: ianh
Date: 2012-08-20 14:58:38 -0700 (Mon, 20 Aug 2012)
New Revision: 7244
Modified:
complete.html
index
source
Log:
[acgiow] (0) Update <ruby>, including examples showing how each use case is addressed.
Affected topics: Canvas, DOM APIs, HTML, HTML Syntax and Parsing, Rendering
Modified: complete.html
===================================================================
--- complete.html 2012-08-10 19:49:38 UTC (rev 7243)
+++ complete.html 2012-08-20 21:58:38 UTC (rev 7244)
@@ -246,7 +246,7 @@
<header class=head id=head><p><a class=logo href=http://www.whatwg.org/><img alt=WHATWG height=101 src=/images/logo width=101></a></p>
<hgroup><h1 class=allcaps>HTML</h1>
- <h2 class="no-num no-toc">Living Standard — Last Updated 10 August 2012</h2>
+ <h2 class="no-num no-toc">Living Standard — Last Updated 20 August 2012</h2>
</hgroup><dl><dt><strong>Web developer edition:</strong></dt>
<dd><strong><a href=http://developers.whatwg.org/>http://developers.whatwg.org/</a></strong></dd>
<dt>Multiple-page version:</dt>
@@ -3995,7 +3995,7 @@
<li>The concept of <dfn id=base-url-change-steps>base URL change steps</dfn> and the definition of what happens when an element is <dfn id=affected-by-a-base-url-change>affected by a base URL change</dfn></li>
<li>The concept of an element's <dfn id=concept-id title=concept-id>unique identifier (ID)</dfn></li>
- <li>The concept of a DOM <dfn id=concept-range title=concept-range>range</dfn>.</li>
+ <li>The concept of a DOM <dfn id=concept-range title=concept-range>range</dfn>, and the terms <dfn id=concept-range-start title=concept-range-start>start</dfn>, <dfn id=concept-range-end title=concept-range-end>end</dfn>, and <dfn id=concept-range-bp title=concept-range-bp>boundary point</dfn> as applied to ranges.</li>
<li><dfn id=mutationobserver><code>MutationObserver</code></dfn> interface</li>
<li>The <dfn id=mutationobserver-scripting-environment><code>MutationObserver</code> <var title="">scripting environment</var></dfn> concept</li>
@@ -22693,7 +22693,7 @@
<dt><a href=#element-dfn-contexts title=element-dfn-contexts>Contexts in which this element can be used</a>:</dt>
<dd>Where <a href=#phrasing-content>phrasing content</a> is expected.</dd>
<dt><a href=#element-dfn-content-model title=element-dfn-content-model>Content model</a>:</dt>
- <dd>One or more groups of: <a href=#phrasing-content>phrasing content</a> followed either by a single <code><a href=#the-rt-element>rt</a></code> element, or an <code><a href=#the-rp-element>rp</a></code> element, an <code><a href=#the-rt-element>rt</a></code> element, and another <code><a href=#the-rp-element>rp</a></code> element.</dd>
+ <dd>See prose.</dd>
<dt><a href=#element-dfn-attributes title=element-dfn-attributes>Content attributes</a>:</dt>
<dd><a href=#global-attributes>Global attributes</a></dd>
<dt><a href=#element-dfn-dom title=element-dfn-dom>DOM interface</a>:</dt><!--TOPIC:DOM APIs-->
@@ -22705,14 +22705,373 @@
pronunciation or to include other annotations. In Japanese, this
form of typography is also known as <i>furigana</i>.</p>
- <p>A <code><a href=#the-ruby-element>ruby</a></code> element <a href=#represents>represents</a> the spans of
- phrasing content it contains, ignoring all the child <code><a href=#the-rt-element>rt</a></code>
- and <code><a href=#the-rp-element>rp</a></code> elements and their descendants. Those spans of
- phrasing content have associated annotations created using the
- <code><a href=#the-rt-element>rt</a></code> element.</p>
+ <p>The content model of <code><a href=#the-ruby-element>ruby</a></code> elements consists of one
+ or more of the following sequences:</p>
- <div class=example>
+ <ol class=brief><li>One or the other of the following:
+ <ul class=brief><li><a href=#phrasing-content>Phrasing content</a>, but with no <code><a href=#the-ruby-element>ruby</a></code> elements and with no <code><a href=#the-ruby-element>ruby</a></code> element descendants
+ <li>A single <code><a href=#the-ruby-element>ruby</a></code> element, but with no further <code><a href=#the-ruby-element>ruby</a></code> element descendants
+ </ul><li>One or the other of the following:
+ <ul class=brief><li>One or more <code><a href=#the-rt-element>rt</a></code> elements
+ <li>An <code><a href=#the-rp-element>rp</a></code> element followed by one or more <code><a href=#the-rt-element>rt</a></code> elements, each of which is itself followed by an <code><a href=#the-rp-element>rp</a></code> element
+ </ul></ol><!-- ( ( phrasing-content | <ruby> ) ( <rt>+ | <rp> ( <rt> <rp> )+ ) )+ // with further ruby descendant restrictions --><p>The <code><a href=#the-ruby-element>ruby</a></code> and <code><a href=#the-rt-element>rt</a></code> elements can be used
+ for a variety of kinds of annotations, including in particular those
+ described below. For more details on Japanese Ruby in particular,
+ and how to render Ruby for Japanese, see <cite>Requirements for
+ Japanese Text Layout</cite>. <a href=#refsJLREQ>[JLREQ]</a></p>
+ <p class=note>At the time of writing, CSS does not yet provide a
+ way to fully control the rendering of the HTML <code><a href=#the-ruby-element>ruby</a></code>
+ element. It is hoped that CSS will be extended to support the styles
+ described below in due course.</p>
+
+ <!-- examples in the following list are mostly based on those in http://www.w3.org/International/datespace/2010/02/jlreq-examples/ -->
+
+ <dl><dt>Mono-ruby for individual base characters
+
+ <dd>
+
+ <p>One or more hiragana or katakana characters (the ruby
+ annotation) are placed with each ideographic character (the base
+ text). This is used to provide readings of kanji characters.
+
+ <div class=example> <!-- B as in BASE -->
+ <pre><ruby>B<rt>annotation</ruby></pre>
+ </div>
+
+ <div class=example>
+ <p>In this example, notice how each annotation corresponds to a single base character.
+ <pre><ruby>君<rt>くん</ruby><ruby>子<rt>し</ruby>は<ruby>和<rt>わ</ruby>して<ruby>同<rt>どう</ruby>ぜず。</pre>
+ <p lang=ja><ruby>君<rt>くん</ruby><ruby>子<rt>し</ruby>は<ruby>和<rt>わ</ruby>して<ruby>同<rt>どう</ruby>ぜず。
+ </div>
+
+ </dd>
+
+
+ <dt>Mono-ruby for compound words (jukugo)
+
+ <dd>
+
+ <p>This is similar to the previous case: each ideographic
+ character in the compound word (the base text) has its reading
+ given in hiragana or katakana characters (the ruby annotation).
+ The difference is that the base text segments form a compound word
+ rather than being separate from each other.
+
+ <div class=example> <!-- B as in BASE -->
+ <pre><ruby>B<rt>annotation</rt>B<rt>annotation</ruby></pre>
+ </div>
+
+ <div class=example>
+ <p>In this example, notice again how each annotation corresponds to a single base character. In this example, each compound word (jukugo) corresponds to a single <code><a href=#the-ruby-element>ruby</a></code> element.</p>
+ <p>The rendering here is expected to be that each annotation be placed over (or next to, in vertical text) the corresponding base character, with the annotations not overhanging any of the adjacent characters.</p>
+ <pre><ruby>鬼<rt>き</rt>門<rt>もん</rt></ruby>の<ruby>方<rt>ほう</rt>角<rt>がく</rt></ruby>を<ruby>凝<rt>ぎょう</rt>視<rt>し</rt></ruby>する</pre>
+ <p lang=ja><ruby>鬼<rt>き</rt>門<rt>もん</ruby>の<ruby>方<rt>ほう</rt>角<rt>がく</ruby>を<ruby>凝<rt>ぎょう</rt>視<rt>し</ruby>する
+
+ </div>
+
+ </dd>
+
+
+ <dt>Jukugo-ruby
+
+ <dd>
+
+ <p>This is semantically identical to the previous case (each
+ individual ideographic character in the base compound word has its
+ reading given in an annotation in hiragana or katakana
+ characters), but the rendering is the more complicated Jukugo Ruby
+ rendering.
+
+ <div class=example>
+ <p>This is the same example as above for mono-ruby for compound words. The different rendering is expected to be achieved using different styling (e.g. in CSS), and is not shown here.</p>
+ <pre><ruby>鬼<rt>き</rt>門<rt>もん</rt></ruby>の<ruby>方<rt>ほう</rt>角<rt>がく</rt></ruby>を<ruby>凝<rt>ぎょう</rt>視<rt>し</rt></ruby>する</pre>
+ <!-- Once CSS is updated to describe this, invoke the CSS and unhide this -->
+ <!--
+ <p lang=ja><ruby>鬼<rt>き</rt>門<rt>もん</rt></ruby>の<ruby>方<rt>ほう</rt>角<rt>がく</rt></ruby>を<ruby>凝<rt>ぎょう</rt>視<rt>し</rt></ruby>する
+ -->
+ </div>
+
+ <p class=note>For more details on <a href=http://www.w3.org/TR/jlreq/#positioning_of_jukugoruby>Jukugo
+ Ruby rendering</a>, see Appendix F in the <cite>Requirements for
+ Japanese Text Layout</cite>. <a href=#refsJLREQ>[JLREQ]</a></p>
+
+ </dd>
+
+
+ <dt>Group ruby for describing meanings
+
+ <dd>
+
+ <p>The annotation describes the meaning of the base text, rather
+ than (or in addition to) the pronunciation. As such, both the base
+ text and the annotation can be multiple characters long.
+
+ <div class=example>
+ <pre><ruby>BASE<rt>annotation</ruby></pre>
+ </div>
+
+ <div class=example>
+ <p>Here a compound ideographic word has its corresponding katakana given as an annotation.
+ <pre><ruby>境界面<rt>インターフェース</ruby></pre>
+ <p lang=ja><ruby>境界面<rt>インターフェース</ruby></div>
+
+ <div class=example>
+ <p>Here a compound ideographic word has its translation in English provided as an annotation.
+ <pre><ruby lang="ja">編集者<rt lang="en">editor</ruby></pre>
+ <p><ruby lang=ja>編集者<rt lang=en>editor</ruby></div>
+
+ </dd>
+
+
+ <dt>Group ruby for Jukuji readings
+
+ <dd>
+
+ <p>A phonetic reading that corresponds to multiple base
+ characters, because a one-to-one mapping would be difficult. (In
+ English, the words "Colonel" and "Lieutenant" are examples of
+ words where a direct mapping of pronunciation to individual
+ letters is, in some dialects, rather unclear.)
+
+ <div class=example>
+ <p>In this example, the name of a species of flowers has a phonetic reading provided using group ruby:
+ <pre><ruby>紫陽花<rt>あじさい</ruby></pre>
+ <p lang=ja><ruby>紫陽花<rt>あじさい</ruby></div>
+
+ </dd>
+
+
+ <dt>Text with both phonetic and semantic annotations (double-sided ruby)
+
+ <dd>
+
+ <p>Sometimes, ruby styles described above are combined.
+
+ <div class=example>
+ <pre><ruby>BASE<rt>annotation 1<rt>annotation 2</ruby></pre>
+ </div>
+
+ <div class=example>
+ <pre><ruby><ruby>B<rt>a</rt>A<rt>n</rt>S<rt>t</rt>E<rt>n</rt></ruby><rt>annotation</ruby></pre>
+ </div>
+
+ <div class=example>
+ <p>Here both a phonetic reading and the meaning are given in ruby annotations. The annotation on the nested <code><a href=#the-ruby-element>ruby</a></code> element gives a mono-ruby phonetic annotation for each base character, while the annotation in the <code><a href=#the-rt-element>rt</a></code> element that is a child of the outer <code><a href=#the-ruby-element>ruby</a></code> element gives the meaning using hiragana.
+ <pre><ruby><ruby>東<rt>とう</rt>南<rt>なん</rt></ruby><rt>たつみ</rt></ruby>の方角</pre>
+ <p lang=ja><ruby><ruby>東<rt>とう</rt>南<rt>なん</ruby><rt>たつみ</ruby>の方角
+ </div>
+
+ </dd>
+
+ </dl><hr><p>Within a <code><a href=#the-ruby-element>ruby</a></code> element that does not have a
+ <code><a href=#the-ruby-element>ruby</a></code> element ancestor, content is segmented and
+ segments are placed into three categories: base text segments,
+ annotation segments, and ignored segments. Ignored segments do not
+ form part of the document's semantics (they consist of some
+ <a href=#inter-element-whitespace>inter-element whitespace</a> and <code><a href=#the-rp-element>rp</a></code> elements,
+ the latter of which are used for legacy user agents that do not
+ support ruby at all). Base text segments can overlap (with a limit
+ of two segments overlapping any one position in the DOM, and with
+ any segment having an earlier start point than an overlapping
+ segment also having an equal or later end point, and any segment
+ have a later end point than an overlapping segment also having an
+ equal or earlier start point<!-- if anyone can find a better way of
+ phrasing this parenthetical, do let me know! -->). Annotation
+ segments correspond to <code><a href=#the-rt-element>rt</a></code> elements. Each annotation
+ segment can be associated with a base text segment, and each base
+ text segment can have annotation segments associated with it. (In a
+ conforming document, each base text segment is associated with at
+ least one annotation segment, and each annotation segment is
+ associated with one base text segment.) A <code><a href=#the-ruby-element>ruby</a></code> element
+ <a href=#represents>represents</a> the union of the segments of base text it
+ contains, along with the mapping from those base text segments to
+ annotation segments. Segments are described in terms of DOM ranges;
+ annotation segment ranges always consist of exactly one element. <a href=#refsDOMCORE>[DOMCORE]</a></p>
+
+ <p>At any particular time, the segmentation and categorisation of
+ content of a <code><a href=#the-ruby-element>ruby</a></code> element is the result that would be
+ obtained from running the following algorithm:</p>
+
+ <ol><li><p>Let <var title="">base text segments</var> be an empty list
+ of base text segments, each potentially with a list of base text
+ subsegments.</li>
+
+ <li><p>Let <var title="">annotation segments</var> be an empty list
+ of annotation segments, each potentially being associated with a
+ base text segment or subsegment.</li>
+
+ <li><p>Let <var title="">root</var> be the <code><a href=#the-ruby-element>ruby</a></code>
+ element for which the algorithm is being run.</li>
+
+ <li><p>If <var title="">root</var> has a <code><a href=#the-ruby-element>ruby</a></code> element
+ ancestor, then jump to the step labeled <i>end</i>.</li>
+
+ <li><p>Let <var title="">current parent</var> be <var title="">root</var>.</li>
+
+ <li><p>Let <var title="">index</var> be 0.</li>
+
+ <li><p>Let <var title="">start index</var> be null.</li>
+
+ <li><p>Let <var title="">parent start index</var> be null.</li>
+
+ <li><p>Let <var title="">current base text</var> be null.</li>
+
+
+ <!-- This is spaghetti code. If someone can work out a way to
+ phrase this that is as unambiguous but maps more cleanly to
+ structured code, please let me know. -->
+
+
+ <li><p><i>Start mode</i>: If <var title="">index</var> is equal to
+ or greater than the number of child nodes in <var title="">current
+ parent</var>, then jump to the step labeled <i>end mode</i>.</p>
+
+ <li><p>If the <var title="">index</var>th node in <var title="">current parent</var> is an <code><a href=#the-rt-element>rt</a></code> or
+ <code><a href=#the-rp-element>rp</a></code> element, jump to the step labeled <i>annotation
+ mode</i>.</li>
+
+ <!-- if we get here then the first node in a ruby element or after
+ an <rt> or <rp> is something we want in a base text -->
+
+ <li><p>Set <var title="">start index</var> to the value of <var title="">index</var>.</li>
+
+ <li><p><i>Base mode</i>: If the <var title="">index</var>th node in
+ <var title="">current parent</var> is a <code><a href=#the-ruby-element>ruby</a></code> element,
+ and if <var title="">current parent</var> is the same element as
+ <var title="">root</var>, then <a href=#push-a-ruby-level>push a ruby level</a> and
+ then jump to the step labeled <i>start mode</i>.</li>
+
+ <li><p>If the <var title="">index</var>th node in <var title="">current parent</var> is an <code><a href=#the-rt-element>rt</a></code> or
+ <code><a href=#the-rp-element>rp</a></code> element, then <a href=#set-the-current-base-text>set the current base
+ text</a> and then jump to the step labeled <i>annotation
+ mode</i>.</li>
+
+ <li><p>Increment <var title="">index</var> by one.</li>
+
+ <li><p><i>Base mode post-increment</i>: If <var title="">index</var> is equal to or greater than the number of
+ child nodes in <var title="">current parent</var>, then jump to the
+ step labeled <i>end mode</i>.</li>
+
+ <li><p>Jump back to the step labeled <i>base mode</i>.</li>
+
+
+ <li><p><i>Annotation mode</i>: If the <var title="">index</var>th
+ node in <var title="">current parent</var> is an <code><a href=#the-rt-element>rt</a></code>
+ element, then <a href=#push-a-ruby-annotation>push a ruby annotation</a> and jump to the
+ step labeled <i>annotation mode increment</i>.</li>
+
+ <li><p>If the <var title="">index</var>th node in <var title="">current parent</var> is an <code><a href=#the-rp-element>rp</a></code> element, jump
+ to the step labeled <i>annotation mode increment</i>.</li>
+
+ <li><p>If the <var title="">index</var>th node in <var title="">current parent</var> is not a <code><a href=#text>Text</a></code> node, or
+ is a <code><a href=#text>Text</a></code> node that is not <a href=#inter-element-whitespace>inter-element
+ whitespace</a>, then jump to the step labeled <i>base
+ mode</i>.</li>
+
+ <!-- index points at whitespace -->
+
+ <li><p><i>Annotation mode increment</i>: Let <var title="">lookahead index</var> be <var title="">index</var> plus
+ one.</li>
+
+ <li><p><i>Annotation mode white-space skipper</i>: If <var title="">lookahead index</var> is equal to the number of child
+ nodes in <var title="">current parent</var> then jump to the step
+ labeled <i>end mode</i>.</li>
+
+ <li><p>If the <var title="">lookahead index</var>th node in <var title="">current parent</var> is an <code><a href=#the-rt-element>rt</a></code> element or an
+ <code><a href=#the-rp-element>rp</a></code> element, then set <var title="">index</var> to <var title="">lookahead index</var> and jump to the step labeled
+ <i>annotation mode</i>.</li>
+
+ <li><p>If the <var title="">lookahead index</var>th node in <var title="">current parent</var> is not a <code><a href=#text>Text</a></code> node, or
+ is a <code><a href=#text>Text</a></code> node that is not <a href=#inter-element-whitespace>inter-element
+ whitespace</a>, then jump to the step labeled <i>base mode</i>
+ (without further incrementing <var title="">index</var>, so the
+ <a href=#inter-element-whitespace>inter-element whitespace</a> seen so far becomes part of
+ the next base text segment).</li>
+
+ <li><p>Increment <var title="">lookahead index</var> by
+ one.</li>
+
+ <li><p>Jump to the step labeled <i>annotation mode white-space
+ skipper</i>.</li>
+
+
+ <li><p><i>End mode</i>: If <var title="">current parent</var> is
+ not the same element as <var title="">root</var>, then <a href=#pop-a-ruby-level>pop a
+ ruby level</a> and jump to the step labeled <i>base mode
+ post-increment</i>.</li>
+
+ <li><p><i>End</i>: Return <var title="">base text segments</var>
+ and <var title="">annotation segments</var>. Any content of the
+ <code><a href=#the-ruby-element>ruby</a></code> element not described by segments in either of
+ thost lists is implicitly in an <i>ignored segment</i>.</li>
+
+ </ol><p>When the steps above say to <dfn id=set-the-current-base-text>set the current base text</dfn>,
+ it means to run the following steps at that point in the
+ algorithm:</p>
+
+ <ol><li><p>Let <var title="">text range</var> a DOM range whose <a href=#concept-range-start title=concept-range-start>start</a> is the <a href=#concept-range-bp title=concept-range-bp>boundary point</a> (<var title="">current parent</var>, <var title="">start index</var>) and
+ whose <a href=#concept-range-end title=concept-range-end>end</a> is the <a href=#concept-range-bp title=concept-range-bp>boundary point</a> (<var title="">current parent</var>, <var title="">index</var>).</li>
+
+ <li><p>Let <var title="">new text segment</var> be a base text
+ segment described by the range <var title="">annotation
+ range</var>.</p>
+
+ <li><p>Add <var title="">new text segment</var> to <var title="">base text segments</var>.</li>
+
+ <li><p>Let <var title="">current base text</var> be <var title="">new text segment</var>.</li>
+
+ <li><p>Let <var title="">start index</var> be null.</li>
+
+ </ol><p>When the steps above say to <dfn id=push-a-ruby-level>push a ruby level</dfn>, it
+ means to run the following steps at that point in the algorithm:</p>
+
+ <ol><li><p>Let <var title="">current parent</var> be the <var title="">index</var>th node in <var title="">current
+ parent</var>.</li>
+
+ <li><p>Let <var title="">index</var> be 0.</li>
+
+ <li><p>Set <var title="">saved start index</var> to the value of
+ <var title="">start index</var>.</li>
+
+ <li><p>Let <var title="">start index</var> be null.</li>
+
+ </ol><p>When the steps above say to <dfn id=pop-a-ruby-level>pop a ruby level</dfn>, it means
+ to run the following steps at that point in the algorithm:</p>
+
+ <ol><li><p>Let <var title="">index</var> be the position of <var title="">current parent</var> in <var title="">root</var>.</li>
+
+ <li><p>Let <var title="">current parent</var> be <var title="">root</var>.</li>
+
+ <li><p>Increment <var title="">index</var> by one.</li>
+
+ <li><p>Set <var title="">start index</var> to the value of
+ <var title="">saved start index</var>.</li>
+
+ <li><p>Let <var title="">saved start index</var> be null.</li>
+
+ </ol><p>When the steps above say to <dfn id=push-a-ruby-annotation>push a ruby annotation</dfn>, it
+ means to run the following steps at that point in the algorithm:</p>
+
+ <ol><li><p>Let <var title="">rt</var> be the <code><a href=#the-rt-element>rt</a></code> element
+ that is the <var title="">index</var>th node of <var title="">current parent</var>.</li>
+
+ <li><p>Let <var title="">annotation range</var> a DOM range whose
+ <a href=#concept-range-start title=concept-range-start>start</a> is the <a href=#concept-range-bp title=concept-range-bp>boundary point</a> (<var title="">current parent</var>, <var title="">index</var>) and whose
+ <a href=#concept-range-end title=concept-range-end>end</a> is the <a href=#concept-range-bp title=concept-range-bp>boundary point</a> (<var title="">current parent</var>, <var title="">index</var> plus one)
+ (i.e. that contains only <var title="">rt</var>).</li>
+
+ <li><p>Let <var title="">new annotation segment</var> be an
+ annotation segment described by the range <var title="">annotation
+ range</var>.</li>
+
+ <li><p>If <var title="">current base text</var> is not null,
+ associate <var title="">new annotation segment</var> with <var title="">current base text</var>.</li>
+
+ <li><p>Add <var title="">new annotation segment</var> to <var title="">annotation segments</var>.</li>
+
+ </ol><div class=example>
+
<!-- this is the hiragana for the word "kanji" ("chinese character") in japanese -->
<!-- in japanese, ruby-like typography is called "furigana" -->
@@ -22731,7 +23090,7 @@
<div class=example>
- <!-- this is the bopomofo for the word "hanzi" ("chinese character") in traditional chinese, as used in taiwan -->
+ <!-- this is the zhuyin fuhao (aka bopomofo) for the word "hanzi" ("chinese character") in traditional chinese, as used in taiwan -->
<p>In this example, each ideograph in the traditional Chinese text
<span lang=zh-TW title="">漢字</span> is annotated
@@ -22763,7 +23122,22 @@
<!-- Note: Examples are 32px/16px Stone Sans Sem ITC TT -->
+ <div class=example>
+ <p>In this more contrived example, the acronym "HTML" has four
+ annotations: one for the whole acronym, briefly describing what it
+ is, one for the letters "HT" expanding them to "Hypertext", one for
+ the letter "M" expanding it to "Markup", and one for the letter "L"
+ expanding it to "Language".</p>
+
+ <pre><ruby>
+ <ruby>HT<rt>Hypertext</rt>M<rt>Markup</rt>L<rt>Language</rt></ruby>
+ <rt>An abstract language for describing documents and applications
+</ruby></pre>
+
+ </div>
+
+
<h4 id=the-rt-element><span class=secno>4.6.22 </span>The <dfn><code>rt</code></dfn> element</h4>
<dl class=element><dt><a href=#element-dfn-categories title=element-dfn-categories>Categories</a>:</dt>
@@ -36736,7 +37110,7 @@
</dl></li>
- <li><p>If <var title="">position</var> is greater than <var title="">width</var>, then jump to the step labeld
+ <li><p>If <var title="">position</var> is greater than <var title="">width</var>, then jump to the step labeled
<i>joins</i>.</li>
<li><p>If <var title="">segment length</var> is greater than zero,
@@ -87991,7 +88365,7 @@
<li><i>Next byte</i>: Move <var title="">position</var> so it
points at the next byte in the input byte stream, and return to the
- step above labeld <i>loop</i>.</li>
+ step above labeled <i>loop</i>.</li>
</ol><p>When the <a href=#prescan-a-byte-stream-to-determine-its-encoding>prescan a byte stream to determine its
encoding</a> algorithm says to <dfn id=concept-get-attributes-when-sniffing title=concept-get-attributes-when-sniffing>get an attribute</dfn>,
@@ -96482,6 +96856,16 @@
<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'. <a href=#refsCSSRUBY>[CSSRUBY]</a></p>
+ <p>When a particular part of a ruby has more than one annotation,
+ the annotations should be distributed on both sides of the base text
+ so as to minimise the stacking of ruby annotations on one side.</p>
+
+ <p class=note>When it becomes possible to do so, the preceding
+ requirement will be updated to be expressed in terms of CSS ruby.
+ (Currently, CSS ruby does not handle nested <code><a href=#the-ruby-element>ruby</a></code>
+ elements or multiple sequential <code><a href=#the-rt-element>rt</a></code> elements, which is
+ how this semantic is expressed.)</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>
elements in the absence of <code><a href=#the-rp-element>rp</a></code> elements.</p>
@@ -96691,7 +97075,6 @@
:root:lang(ee), :not(:lang(ee)) > :lang(ee) { quotes: '\201c' '\201d' '\2018' '\2019' } /* “ ” ‘ ’ */
:root:lang(el), :not(:lang(el)) > :lang(el) { quotes: '\00ab' '\00bb' '\201c' '\201d' } /* « » “ ” */
:root:lang(en), :not(:lang(en)) > :lang(en) { quotes: '\201c' '\201d' '\2018' '\2019' } /* “ ” ‘ ’ */
-:root:lang(en-GB), :not(:lang(en-GB)) > :lang(en-GB) { quotes: '\201c' '\201d' '\2018' '\2019' } /* “ ” ‘ ’ */
:root:lang(es), :not(:lang(es)) > :lang(es) { quotes: '\201c' '\201d' '\00ab' '\00bb' } /* “ ” « » */
:root:lang(et), :not(:lang(et)) > :lang(et) { quotes: '\201e' '\201c' '\201a' '\2018' } /* „ “ ‚ ‘ */
:root:lang(eu), :not(:lang(eu)) > :lang(eu) { quotes: '\201c' '\201d' '\00ab' '\00bb' } /* “ ” « » */
@@ -96773,7 +97156,7 @@
:root:lang(ses), :not(:lang(ses)) > :lang(ses) { quotes: '\201c' '\201d' '\2018' '\2019' } /* “ ” ‘ ’ */
:root:lang(sg), :not(:lang(sg)) > :lang(sg) { quotes: '\00ab' '\00bb' '\201c' '\201d' } /* « » “ ” */
:root:lang(shi), :not(:lang(shi)) > :lang(shi) { quotes: '\00ab' '\00bb' '\201e' '\201d' } /* « » „ ” */
-:root:lang(shi-Tfng), :not(:lang(shi-Tfng)) > :lang(shi-Tfng) { quotes: '\00ab' '\00bb' '\201e' '\201d' } /* « » „ ” */
+:root:lang(shi-Latn), :not(:lang(shi-Latn)) > :lang(shi-Latn) { quotes: '\00ab' '\00bb' '\201e' '\201d' } /* « » „ ” */
:root:lang(si), :not(:lang(si)) > :lang(si) { quotes: '\201c' '\201d' '\2018' '\2019' } /* “ ” ‘ ’ */
:root:lang(sk), :not(:lang(sk)) > :lang(sk) { quotes: '\201e' '\201c' '\201a' '\2018' } /* „ “ ‚ ‘ */
:root:lang(sl), :not(:lang(sl)) > :lang(sl) { quotes: '\201e' '\201c' '\201a' '\2018' } /* „ “ ‚ ‘ */
@@ -104469,6 +104852,9 @@
character sets — Part 11: Latin/Thai
alphabet</a></cite>. ISO.</dd>
+ <dt id=refsJLREQ>[JLREQ]</dt>
+ <dd><cite><a href=http://www.w3.org/TR/jlreq/>Requirements for Japanese Text Layout</a></cite>. W3C.</dd> <!-- too many editors to list -->
+
<dt id=refsJPEG>[JPEG]</dt>
<dd><cite><a href=http://www.w3.org/Graphics/JPEG/jfif3.pdf>JPEG File Interchange Format</a></cite>, E. Hamilton.</dd>
@@ -105148,6 +105534,7 @@
Ivan Enderlin,
Ivo Emanuel Gonçalves,
J. King,
+ Jacob Davies,
Jacques Distler,
Jake Verbaten,
James Craig,
Modified: index
===================================================================
--- index 2012-08-10 19:49:38 UTC (rev 7243)
+++ index 2012-08-20 21:58:38 UTC (rev 7244)
@@ -246,7 +246,7 @@
<header class=head id=head><p><a class=logo href=http://www.whatwg.org/><img alt=WHATWG height=101 src=/images/logo width=101></a></p>
<hgroup><h1 class=allcaps>HTML</h1>
- <h2 class="no-num no-toc">Living Standard — Last Updated 10 August 2012</h2>
+ <h2 class="no-num no-toc">Living Standard — Last Updated 20 August 2012</h2>
</hgroup><dl><dt><strong>Web developer edition:</strong></dt>
<dd><strong><a href=http://developers.whatwg.org/>http://developers.whatwg.org/</a></strong></dd>
<dt>Multiple-page version:</dt>
@@ -3995,7 +3995,7 @@
<li>The concept of <dfn id=base-url-change-steps>base URL change steps</dfn> and the definition of what happens when an element is <dfn id=affected-by-a-base-url-change>affected by a base URL change</dfn></li>
<li>The concept of an element's <dfn id=concept-id title=concept-id>unique identifier (ID)</dfn></li>
- <li>The concept of a DOM <dfn id=concept-range title=concept-range>range</dfn>.</li>
+ <li>The concept of a DOM <dfn id=concept-range title=concept-range>range</dfn>, and the terms <dfn id=concept-range-start title=concept-range-start>start</dfn>, <dfn id=concept-range-end title=concept-range-end>end</dfn>, and <dfn id=concept-range-bp title=concept-range-bp>boundary point</dfn> as applied to ranges.</li>
<li><dfn id=mutationobserver><code>MutationObserver</code></dfn> interface</li>
<li>The <dfn id=mutationobserver-scripting-environment><code>MutationObserver</code> <var title="">scripting environment</var></dfn> concept</li>
@@ -22693,7 +22693,7 @@
<dt><a href=#element-dfn-contexts title=element-dfn-contexts>Contexts in which this element can be used</a>:</dt>
<dd>Where <a href=#phrasing-content>phrasing content</a> is expected.</dd>
<dt><a href=#element-dfn-content-model title=element-dfn-content-model>Content model</a>:</dt>
- <dd>One or more groups of: <a href=#phrasing-content>phrasing content</a> followed either by a single <code><a href=#the-rt-element>rt</a></code> element, or an <code><a href=#the-rp-element>rp</a></code> element, an <code><a href=#the-rt-element>rt</a></code> element, and another <code><a href=#the-rp-element>rp</a></code> element.</dd>
+ <dd>See prose.</dd>
<dt><a href=#element-dfn-attributes title=element-dfn-attributes>Content attributes</a>:</dt>
<dd><a href=#global-attributes>Global attributes</a></dd>
<dt><a href=#element-dfn-dom title=element-dfn-dom>DOM interface</a>:</dt><!--TOPIC:DOM APIs-->
@@ -22705,14 +22705,373 @@
pronunciation or to include other annotations. In Japanese, this
form of typography is also known as <i>furigana</i>.</p>
- <p>A <code><a href=#the-ruby-element>ruby</a></code> element <a href=#represents>represents</a> the spans of
- phrasing content it contains, ignoring all the child <code><a href=#the-rt-element>rt</a></code>
- and <code><a href=#the-rp-element>rp</a></code> elements and their descendants. Those spans of
- phrasing content have associated annotations created using the
- <code><a href=#the-rt-element>rt</a></code> element.</p>
+ <p>The content model of <code><a href=#the-ruby-element>ruby</a></code> elements consists of one
+ or more of the following sequences:</p>
- <div class=example>
+ <ol class=brief><li>One or the other of the following:
+ <ul class=brief><li><a href=#phrasing-content>Phrasing content</a>, but with no <code><a href=#the-ruby-element>ruby</a></code> elements and with no <code><a href=#the-ruby-element>ruby</a></code> element descendants
+ <li>A single <code><a href=#the-ruby-element>ruby</a></code> element, but with no further <code><a href=#the-ruby-element>ruby</a></code> element descendants
+ </ul><li>One or the other of the following:
+ <ul class=brief><li>One or more <code><a href=#the-rt-element>rt</a></code> elements
+ <li>An <code><a href=#the-rp-element>rp</a></code> element followed by one or more <code><a href=#the-rt-element>rt</a></code> elements, each of which is itself followed by an <code><a href=#the-rp-element>rp</a></code> element
+ </ul></ol><!-- ( ( phrasing-content | <ruby> ) ( <rt>+ | <rp> ( <rt> <rp> )+ ) )+ // with further ruby descendant restrictions --><p>The <code><a href=#the-ruby-element>ruby</a></code> and <code><a href=#the-rt-element>rt</a></code> elements can be used
+ for a variety of kinds of annotations, including in particular those
+ described below. For more details on Japanese Ruby in particular,
+ and how to render Ruby for Japanese, see <cite>Requirements for
+ Japanese Text Layout</cite>. <a href=#refsJLREQ>[JLREQ]</a></p>
+ <p class=note>At the time of writing, CSS does not yet provide a
+ way to fully control the rendering of the HTML <code><a href=#the-ruby-element>ruby</a></code>
+ element. It is hoped that CSS will be extended to support the styles
+ described below in due course.</p>
+
+ <!-- examples in the following list are mostly based on those in http://www.w3.org/International/datespace/2010/02/jlreq-examples/ -->
+
+ <dl><dt>Mono-ruby for individual base characters
+
+ <dd>
+
+ <p>One or more hiragana or katakana characters (the ruby
+ annotation) are placed with each ideographic character (the base
+ text). This is used to provide readings of kanji characters.
+
+ <div class=example> <!-- B as in BASE -->
+ <pre><ruby>B<rt>annotation</ruby></pre>
+ </div>
+
+ <div class=example>
+ <p>In this example, notice how each annotation corresponds to a single base character.
+ <pre><ruby>君<rt>くん</ruby><ruby>子<rt>し</ruby>は<ruby>和<rt>わ</ruby>して<ruby>同<rt>どう</ruby>ぜず。</pre>
+ <p lang=ja><ruby>君<rt>くん</ruby><ruby>子<rt>し</ruby>は<ruby>和<rt>わ</ruby>して<ruby>同<rt>どう</ruby>ぜず。
+ </div>
+
+ </dd>
+
+
+ <dt>Mono-ruby for compound words (jukugo)
+
+ <dd>
+
+ <p>This is similar to the previous case: each ideographic
+ character in the compound word (the base text) has its reading
+ given in hiragana or katakana characters (the ruby annotation).
+ The difference is that the base text segments form a compound word
+ rather than being separate from each other.
+
+ <div class=example> <!-- B as in BASE -->
+ <pre><ruby>B<rt>annotation</rt>B<rt>annotation</ruby></pre>
+ </div>
+
+ <div class=example>
+ <p>In this example, notice again how each annotation corresponds to a single base character. In this example, each compound word (jukugo) corresponds to a single <code><a href=#the-ruby-element>ruby</a></code> element.</p>
+ <p>The rendering here is expected to be that each annotation be placed over (or next to, in vertical text) the corresponding base character, with the annotations not overhanging any of the adjacent characters.</p>
+ <pre><ruby>鬼<rt>き</rt>門<rt>もん</rt></ruby>の<ruby>方<rt>ほう</rt>角<rt>がく</rt></ruby>を<ruby>凝<rt>ぎょう</rt>視<rt>し</rt></ruby>する</pre>
+ <p lang=ja><ruby>鬼<rt>き</rt>門<rt>もん</ruby>の<ruby>方<rt>ほう</rt>角<rt>がく</ruby>を<ruby>凝<rt>ぎょう</rt>視<rt>し</ruby>する
+
+ </div>
+
+ </dd>
+
+
+ <dt>Jukugo-ruby
+
+ <dd>
+
+ <p>This is semantically identical to the previous case (each
+ individual ideographic character in the base compound word has its
+ reading given in an annotation in hiragana or katakana
+ characters), but the rendering is the more complicated Jukugo Ruby
+ rendering.
+
+ <div class=example>
+ <p>This is the same example as above for mono-ruby for compound words. The different rendering is expected to be achieved using different styling (e.g. in CSS), and is not shown here.</p>
+ <pre><ruby>鬼<rt>き</rt>門<rt>もん</rt></ruby>の<ruby>方<rt>ほう</rt>角<rt>がく</rt></ruby>を<ruby>凝<rt>ぎょう</rt>視<rt>し</rt></ruby>する</pre>
+ <!-- Once CSS is updated to describe this, invoke the CSS and unhide this -->
+ <!--
+ <p lang=ja><ruby>鬼<rt>き</rt>門<rt>もん</rt></ruby>の<ruby>方<rt>ほう</rt>角<rt>がく</rt></ruby>を<ruby>凝<rt>ぎょう</rt>視<rt>し</rt></ruby>する
+ -->
+ </div>
+
+ <p class=note>For more details on <a href=http://www.w3.org/TR/jlreq/#positioning_of_jukugoruby>Jukugo
+ Ruby rendering</a>, see Appendix F in the <cite>Requirements for
+ Japanese Text Layout</cite>. <a href=#refsJLREQ>[JLREQ]</a></p>
+
+ </dd>
+
+
+ <dt>Group ruby for describing meanings
+
+ <dd>
+
+ <p>The annotation describes the meaning of the base text, rather
+ than (or in addition to) the pronunciation. As such, both the base
+ text and the annotation can be multiple characters long.
+
+ <div class=example>
+ <pre><ruby>BASE<rt>annotation</ruby></pre>
+ </div>
+
+ <div class=example>
+ <p>Here a compound ideographic word has its corresponding katakana given as an annotation.
+ <pre><ruby>境界面<rt>インターフェース</ruby></pre>
+ <p lang=ja><ruby>境界面<rt>インターフェース</ruby></div>
+
+ <div class=example>
+ <p>Here a compound ideographic word has its translation in English provided as an annotation.
+ <pre><ruby lang="ja">編集者<rt lang="en">editor</ruby></pre>
+ <p><ruby lang=ja>編集者<rt lang=en>editor</ruby></div>
+
+ </dd>
+
+
+ <dt>Group ruby for Jukuji readings
+
+ <dd>
+
+ <p>A phonetic reading that corresponds to multiple base
+ characters, because a one-to-one mapping would be difficult. (In
+ English, the words "Colonel" and "Lieutenant" are examples of
+ words where a direct mapping of pronunciation to individual
+ letters is, in some dialects, rather unclear.)
+
+ <div class=example>
+ <p>In this example, the name of a species of flowers has a phonetic reading provided using group ruby:
+ <pre><ruby>紫陽花<rt>あじさい</ruby></pre>
+ <p lang=ja><ruby>紫陽花<rt>あじさい</ruby></div>
+
+ </dd>
+
+
+ <dt>Text with both phonetic and semantic annotations (double-sided ruby)
+
+ <dd>
+
+ <p>Sometimes, ruby styles described above are combined.
+
+ <div class=example>
+ <pre><ruby>BASE<rt>annotation 1<rt>annotation 2</ruby></pre>
+ </div>
+
+ <div class=example>
+ <pre><ruby><ruby>B<rt>a</rt>A<rt>n</rt>S<rt>t</rt>E<rt>n</rt></ruby><rt>annotation</ruby></pre>
+ </div>
+
+ <div class=example>
+ <p>Here both a phonetic reading and the meaning are given in ruby annotations. The annotation on the nested <code><a href=#the-ruby-element>ruby</a></code> element gives a mono-ruby phonetic annotation for each base character, while the annotation in the <code><a href=#the-rt-element>rt</a></code> element that is a child of the outer <code><a href=#the-ruby-element>ruby</a></code> element gives the meaning using hiragana.
+ <pre><ruby><ruby>東<rt>とう</rt>南<rt>なん</rt></ruby><rt>たつみ</rt></ruby>の方角</pre>
+ <p lang=ja><ruby><ruby>東<rt>とう</rt>南<rt>なん</ruby><rt>たつみ</ruby>の方角
+ </div>
+
+ </dd>
+
+ </dl><hr><p>Within a <code><a href=#the-ruby-element>ruby</a></code> element that does not have a
+ <code><a href=#the-ruby-element>ruby</a></code> element ancestor, content is segmented and
+ segments are placed into three categories: base text segments,
+ annotation segments, and ignored segments. Ignored segments do not
+ form part of the document's semantics (they consist of some
+ <a href=#inter-element-whitespace>inter-element whitespace</a> and <code><a href=#the-rp-element>rp</a></code> elements,
+ the latter of which are used for legacy user agents that do not
+ support ruby at all). Base text segments can overlap (with a limit
+ of two segments overlapping any one position in the DOM, and with
+ any segment having an earlier start point than an overlapping
+ segment also having an equal or later end point, and any segment
+ have a later end point than an overlapping segment also having an
+ equal or earlier start point<!-- if anyone can find a better way of
+ phrasing this parenthetical, do let me know! -->). Annotation
+ segments correspond to <code><a href=#the-rt-element>rt</a></code> elements. Each annotation
+ segment can be associated with a base text segment, and each base
+ text segment can have annotation segments associated with it. (In a
+ conforming document, each base text segment is associated with at
+ least one annotation segment, and each annotation segment is
+ associated with one base text segment.) A <code><a href=#the-ruby-element>ruby</a></code> element
+ <a href=#represents>represents</a> the union of the segments of base text it
+ contains, along with the mapping from those base text segments to
+ annotation segments. Segments are described in terms of DOM ranges;
+ annotation segment ranges always consist of exactly one element. <a href=#refsDOMCORE>[DOMCORE]</a></p>
+
+ <p>At any particular time, the segmentation and categorisation of
+ content of a <code><a href=#the-ruby-element>ruby</a></code> element is the result that would be
+ obtained from running the following algorithm:</p>
+
+ <ol><li><p>Let <var title="">base text segments</var> be an empty list
+ of base text segments, each potentially with a list of base text
+ subsegments.</li>
+
+ <li><p>Let <var title="">annotation segments</var> be an empty list
+ of annotation segments, each potentially being associated with a
+ base text segment or subsegment.</li>
+
+ <li><p>Let <var title="">root</var> be the <code><a href=#the-ruby-element>ruby</a></code>
+ element for which the algorithm is being run.</li>
+
+ <li><p>If <var title="">root</var> has a <code><a href=#the-ruby-element>ruby</a></code> element
+ ancestor, then jump to the step labeled <i>end</i>.</li>
+
+ <li><p>Let <var title="">current parent</var> be <var title="">root</var>.</li>
+
+ <li><p>Let <var title="">index</var> be 0.</li>
+
+ <li><p>Let <var title="">start index</var> be null.</li>
+
+ <li><p>Let <var title="">parent start index</var> be null.</li>
+
+ <li><p>Let <var title="">current base text</var> be null.</li>
+
+
+ <!-- This is spaghetti code. If someone can work out a way to
+ phrase this that is as unambiguous but maps more cleanly to
+ structured code, please let me know. -->
+
+
+ <li><p><i>Start mode</i>: If <var title="">index</var> is equal to
+ or greater than the number of child nodes in <var title="">current
+ parent</var>, then jump to the step labeled <i>end mode</i>.</p>
+
+ <li><p>If the <var title="">index</var>th node in <var title="">current parent</var> is an <code><a href=#the-rt-element>rt</a></code> or
+ <code><a href=#the-rp-element>rp</a></code> element, jump to the step labeled <i>annotation
+ mode</i>.</li>
+
+ <!-- if we get here then the first node in a ruby element or after
+ an <rt> or <rp> is something we want in a base text -->
+
+ <li><p>Set <var title="">start index</var> to the value of <var title="">index</var>.</li>
+
+ <li><p><i>Base mode</i>: If the <var title="">index</var>th node in
+ <var title="">current parent</var> is a <code><a href=#the-ruby-element>ruby</a></code> element,
+ and if <var title="">current parent</var> is the same element as
+ <var title="">root</var>, then <a href=#push-a-ruby-level>push a ruby level</a> and
+ then jump to the step labeled <i>start mode</i>.</li>
+
+ <li><p>If the <var title="">index</var>th node in <var title="">current parent</var> is an <code><a href=#the-rt-element>rt</a></code> or
+ <code><a href=#the-rp-element>rp</a></code> element, then <a href=#set-the-current-base-text>set the current base
+ text</a> and then jump to the step labeled <i>annotation
+ mode</i>.</li>
+
+ <li><p>Increment <var title="">index</var> by one.</li>
+
+ <li><p><i>Base mode post-increment</i>: If <var title="">index</var> is equal to or greater than the number of
+ child nodes in <var title="">current parent</var>, then jump to the
+ step labeled <i>end mode</i>.</li>
+
+ <li><p>Jump back to the step labeled <i>base mode</i>.</li>
+
+
+ <li><p><i>Annotation mode</i>: If the <var title="">index</var>th
+ node in <var title="">current parent</var> is an <code><a href=#the-rt-element>rt</a></code>
+ element, then <a href=#push-a-ruby-annotation>push a ruby annotation</a> and jump to the
+ step labeled <i>annotation mode increment</i>.</li>
+
+ <li><p>If the <var title="">index</var>th node in <var title="">current parent</var> is an <code><a href=#the-rp-element>rp</a></code> element, jump
+ to the step labeled <i>annotation mode increment</i>.</li>
+
+ <li><p>If the <var title="">index</var>th node in <var title="">current parent</var> is not a <code><a href=#text>Text</a></code> node, or
+ is a <code><a href=#text>Text</a></code> node that is not <a href=#inter-element-whitespace>inter-element
+ whitespace</a>, then jump to the step labeled <i>base
+ mode</i>.</li>
+
+ <!-- index points at whitespace -->
+
+ <li><p><i>Annotation mode increment</i>: Let <var title="">lookahead index</var> be <var title="">index</var> plus
+ one.</li>
+
+ <li><p><i>Annotation mode white-space skipper</i>: If <var title="">lookahead index</var> is equal to the number of child
+ nodes in <var title="">current parent</var> then jump to the step
+ labeled <i>end mode</i>.</li>
+
+ <li><p>If the <var title="">lookahead index</var>th node in <var title="">current parent</var> is an <code><a href=#the-rt-element>rt</a></code> element or an
+ <code><a href=#the-rp-element>rp</a></code> element, then set <var title="">index</var> to <var title="">lookahead index</var> and jump to the step labeled
+ <i>annotation mode</i>.</li>
+
+ <li><p>If the <var title="">lookahead index</var>th node in <var title="">current parent</var> is not a <code><a href=#text>Text</a></code> node, or
+ is a <code><a href=#text>Text</a></code> node that is not <a href=#inter-element-whitespace>inter-element
+ whitespace</a>, then jump to the step labeled <i>base mode</i>
+ (without further incrementing <var title="">index</var>, so the
+ <a href=#inter-element-whitespace>inter-element whitespace</a> seen so far becomes part of
+ the next base text segment).</li>
+
+ <li><p>Increment <var title="">lookahead index</var> by
+ one.</li>
+
+ <li><p>Jump to the step labeled <i>annotation mode white-space
+ skipper</i>.</li>
+
+
+ <li><p><i>End mode</i>: If <var title="">current parent</var> is
+ not the same element as <var title="">root</var>, then <a href=#pop-a-ruby-level>pop a
+ ruby level</a> and jump to the step labeled <i>base mode
+ post-increment</i>.</li>
+
+ <li><p><i>End</i>: Return <var title="">base text segments</var>
+ and <var title="">annotation segments</var>. Any content of the
+ <code><a href=#the-ruby-element>ruby</a></code> element not described by segments in either of
+ thost lists is implicitly in an <i>ignored segment</i>.</li>
+
+ </ol><p>When the steps above say to <dfn id=set-the-current-base-text>set the current base text</dfn>,
+ it means to run the following steps at that point in the
+ algorithm:</p>
+
+ <ol><li><p>Let <var title="">text range</var> a DOM range whose <a href=#concept-range-start title=concept-range-start>start</a> is the <a href=#concept-range-bp title=concept-range-bp>boundary point</a> (<var title="">current parent</var>, <var title="">start index</var>) and
+ whose <a href=#concept-range-end title=concept-range-end>end</a> is the <a href=#concept-range-bp title=concept-range-bp>boundary point</a> (<var title="">current parent</var>, <var title="">index</var>).</li>
+
+ <li><p>Let <var title="">new text segment</var> be a base text
+ segment described by the range <var title="">annotation
+ range</var>.</p>
+
+ <li><p>Add <var title="">new text segment</var> to <var title="">base text segments</var>.</li>
+
+ <li><p>Let <var title="">current base text</var> be <var title="">new text segment</var>.</li>
+
+ <li><p>Let <var title="">start index</var> be null.</li>
+
+ </ol><p>When the steps above say to <dfn id=push-a-ruby-level>push a ruby level</dfn>, it
+ means to run the following steps at that point in the algorithm:</p>
+
+ <ol><li><p>Let <var title="">current parent</var> be the <var title="">index</var>th node in <var title="">current
+ parent</var>.</li>
+
+ <li><p>Let <var title="">index</var> be 0.</li>
+
+ <li><p>Set <var title="">saved start index</var> to the value of
+ <var title="">start index</var>.</li>
+
+ <li><p>Let <var title="">start index</var> be null.</li>
+
+ </ol><p>When the steps above say to <dfn id=pop-a-ruby-level>pop a ruby level</dfn>, it means
+ to run the following steps at that point in the algorithm:</p>
+
+ <ol><li><p>Let <var title="">index</var> be the position of <var title="">current parent</var> in <var title="">root</var>.</li>
+
+ <li><p>Let <var title="">current parent</var> be <var title="">root</var>.</li>
+
+ <li><p>Increment <var title="">index</var> by one.</li>
+
+ <li><p>Set <var title="">start index</var> to the value of
+ <var title="">saved start index</var>.</li>
+
+ <li><p>Let <var title="">saved start index</var> be null.</li>
+
+ </ol><p>When the steps above say to <dfn id=push-a-ruby-annotation>push a ruby annotation</dfn>, it
+ means to run the following steps at that point in the algorithm:</p>
+
+ <ol><li><p>Let <var title="">rt</var> be the <code><a href=#the-rt-element>rt</a></code> element
+ that is the <var title="">index</var>th node of <var title="">current parent</var>.</li>
+
+ <li><p>Let <var title="">annotation range</var> a DOM range whose
+ <a href=#concept-range-start title=concept-range-start>start</a> is the <a href=#concept-range-bp title=concept-range-bp>boundary point</a> (<var title="">current parent</var>, <var title="">index</var>) and whose
+ <a href=#concept-range-end title=concept-range-end>end</a> is the <a href=#concept-range-bp title=concept-range-bp>boundary point</a> (<var title="">current parent</var>, <var title="">index</var> plus one)
+ (i.e. that contains only <var title="">rt</var>).</li>
+
+ <li><p>Let <var title="">new annotation segment</var> be an
+ annotation segment described by the range <var title="">annotation
+ range</var>.</li>
+
+ <li><p>If <var title="">current base text</var> is not null,
+ associate <var title="">new annotation segment</var> with <var title="">current base text</var>.</li>
+
+ <li><p>Add <var title="">new annotation segment</var> to <var title="">annotation segments</var>.</li>
+
+ </ol><div class=example>
+
<!-- this is the hiragana for the word "kanji" ("chinese character") in japanese -->
<!-- in japanese, ruby-like typography is called "furigana" -->
@@ -22731,7 +23090,7 @@
<div class=example>
- <!-- this is the bopomofo for the word "hanzi" ("chinese character") in traditional chinese, as used in taiwan -->
+ <!-- this is the zhuyin fuhao (aka bopomofo) for the word "hanzi" ("chinese character") in traditional chinese, as used in taiwan -->
<p>In this example, each ideograph in the traditional Chinese text
<span lang=zh-TW title="">漢字</span> is annotated
@@ -22763,7 +23122,22 @@
<!-- Note: Examples are 32px/16px Stone Sans Sem ITC TT -->
+ <div class=example>
+ <p>In this more contrived example, the acronym "HTML" has four
+ annotations: one for the whole acronym, briefly describing what it
+ is, one for the letters "HT" expanding them to "Hypertext", one for
+ the letter "M" expanding it to "Markup", and one for the letter "L"
+ expanding it to "Language".</p>
+
+ <pre><ruby>
+ <ruby>HT<rt>Hypertext</rt>M<rt>Markup</rt>L<rt>Language</rt></ruby>
+ <rt>An abstract language for describing documents and applications
+</ruby></pre>
+
+ </div>
+
+
<h4 id=the-rt-element><span class=secno>4.6.22 </span>The <dfn><code>rt</code></dfn> element</h4>
<dl class=element><dt><a href=#element-dfn-categories title=element-dfn-categories>Categories</a>:</dt>
@@ -36736,7 +37110,7 @@
</dl></li>
- <li><p>If <var title="">position</var> is greater than <var title="">width</var>, then jump to the step labeld
+ <li><p>If <var title="">position</var> is greater than <var title="">width</var>, then jump to the step labeled
<i>joins</i>.</li>
<li><p>If <var title="">segment length</var> is greater than zero,
@@ -87991,7 +88365,7 @@
<li><i>Next byte</i>: Move <var title="">position</var> so it
points at the next byte in the input byte stream, and return to the
- step above labeld <i>loop</i>.</li>
+ step above labeled <i>loop</i>.</li>
</ol><p>When the <a href=#prescan-a-byte-stream-to-determine-its-encoding>prescan a byte stream to determine its
encoding</a> algorithm says to <dfn id=concept-get-attributes-when-sniffing title=concept-get-attributes-when-sniffing>get an attribute</dfn>,
@@ -96482,6 +96856,16 @@
<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'. <a href=#refsCSSRUBY>[CSSRUBY]</a></p>
+ <p>When a particular part of a ruby has more than one annotation,
+ the annotations should be distributed on both sides of the base text
+ so as to minimise the stacking of ruby annotations on one side.</p>
+
+ <p class=note>When it becomes possible to do so, the preceding
+ requirement will be updated to be expressed in terms of CSS ruby.
+ (Currently, CSS ruby does not handle nested <code><a href=#the-ruby-element>ruby</a></code>
+ elements or multiple sequential <code><a href=#the-rt-element>rt</a></code> elements, which is
+ how this semantic is expressed.)</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>
elements in the absence of <code><a href=#the-rp-element>rp</a></code> elements.</p>
@@ -96691,7 +97075,6 @@
:root:lang(ee), :not(:lang(ee)) > :lang(ee) { quotes: '\201c' '\201d' '\2018' '\2019' } /* “ ” ‘ ’ */
:root:lang(el), :not(:lang(el)) > :lang(el) { quotes: '\00ab' '\00bb' '\201c' '\201d' } /* « » “ ” */
:root:lang(en), :not(:lang(en)) > :lang(en) { quotes: '\201c' '\201d' '\2018' '\2019' } /* “ ” ‘ ’ */
-:root:lang(en-GB), :not(:lang(en-GB)) > :lang(en-GB) { quotes: '\201c' '\201d' '\2018' '\2019' } /* “ ” ‘ ’ */
:root:lang(es), :not(:lang(es)) > :lang(es) { quotes: '\201c' '\201d' '\00ab' '\00bb' } /* “ ” « » */
:root:lang(et), :not(:lang(et)) > :lang(et) { quotes: '\201e' '\201c' '\201a' '\2018' } /* „ “ ‚ ‘ */
:root:lang(eu), :not(:lang(eu)) > :lang(eu) { quotes: '\201c' '\201d' '\00ab' '\00bb' } /* “ ” « » */
@@ -96773,7 +97156,7 @@
:root:lang(ses), :not(:lang(ses)) > :lang(ses) { quotes: '\201c' '\201d' '\2018' '\2019' } /* “ ” ‘ ’ */
:root:lang(sg), :not(:lang(sg)) > :lang(sg) { quotes: '\00ab' '\00bb' '\201c' '\201d' } /* « » “ ” */
:root:lang(shi), :not(:lang(shi)) > :lang(shi) { quotes: '\00ab' '\00bb' '\201e' '\201d' } /* « » „ ” */
-:root:lang(shi-Tfng), :not(:lang(shi-Tfng)) > :lang(shi-Tfng) { quotes: '\00ab' '\00bb' '\201e' '\201d' } /* « » „ ” */
+:root:lang(shi-Latn), :not(:lang(shi-Latn)) > :lang(shi-Latn) { quotes: '\00ab' '\00bb' '\201e' '\201d' } /* « » „ ” */
:root:lang(si), :not(:lang(si)) > :lang(si) { quotes: '\201c' '\201d' '\2018' '\2019' } /* “ ” ‘ ’ */
:root:lang(sk), :not(:lang(sk)) > :lang(sk) { quotes: '\201e' '\201c' '\201a' '\2018' } /* „ “ ‚ ‘ */
:root:lang(sl), :not(:lang(sl)) > :lang(sl) { quotes: '\201e' '\201c' '\201a' '\2018' } /* „ “ ‚ ‘ */
@@ -104469,6 +104852,9 @@
character sets — Part 11: Latin/Thai
alphabet</a></cite>. ISO.</dd>
+ <dt id=refsJLREQ>[JLREQ]</dt>
+ <dd><cite><a href=http://www.w3.org/TR/jlreq/>Requirements for Japanese Text Layout</a></cite>. W3C.</dd> <!-- too many editors to list -->
+
<dt id=refsJPEG>[JPEG]</dt>
<dd><cite><a href=http://www.w3.org/Graphics/JPEG/jfif3.pdf>JPEG File Interchange Format</a></cite>, E. Hamilton.</dd>
@@ -105148,6 +105534,7 @@
Ivan Enderlin,
Ivo Emanuel Gonçalves,
J. King,
+ Jacob Davies,
Jacques Distler,
Jake Verbaten,
James Craig,
Modified: source
===================================================================
--- source 2012-08-10 19:49:38 UTC (rev 7243)
+++ source 2012-08-20 21:58:38 UTC (rev 7244)
@@ -2928,7 +2928,7 @@
<li>The concept of <dfn>base URL change steps</dfn> and the definition of what happens when an element is <dfn>affected by a base URL change</dfn></li>
<li>The concept of an element's <dfn title="concept-id">unique identifier (ID)</dfn></li>
- <li>The concept of a DOM <dfn title="concept-range">range</dfn>.</li>
+ <li>The concept of a DOM <dfn title="concept-range">range</dfn>, and the terms <dfn title="concept-range-start">start</dfn>, <dfn title="concept-range-end">end</dfn>, and <dfn title="concept-range-bp">boundary point</dfn> as applied to ranges.</li>
<li><dfn><code>MutationObserver</code></dfn> interface</li>
<li>The <dfn><code>MutationObserver</code> <var title="">scripting environment</var></dfn> concept</li>
@@ -24310,7 +24310,7 @@
<dt><span title="element-dfn-contexts">Contexts in which this element can be used</span>:</dt>
<dd>Where <span>phrasing content</span> is expected.</dd>
<dt><span title="element-dfn-content-model">Content model</span>:</dt>
- <dd>One or more groups of: <span>phrasing content</span> followed either by a single <code>rt</code> element, or an <code>rp</code> element, an <code>rt</code> element, and another <code>rp</code> element.</dd>
+ <dd>See prose.</dd>
<dt><span title="element-dfn-attributes">Content attributes</span>:</dt>
<dd><span>Global attributes</span></dd>
<dt><span title="element-dfn-dom">DOM interface</span>:</dt><!--TOPIC:DOM APIs-->
@@ -24324,12 +24324,444 @@
pronunciation or to include other annotations. In Japanese, this
form of typography is also known as <i>furigana</i>.</p>
- <p>A <code>ruby</code> element <span>represents</span> the spans of
- phrasing content it contains, ignoring all the child <code>rt</code>
- and <code>rp</code> elements and their descendants. Those spans of
- phrasing content have associated annotations created using the
- <code>rt</code> element.</p>
+ <p>The content model of <code>ruby</code> elements consists of one
+ or more of the following sequences:</p>
+ <ol class="brief">
+ <li>One or the other of the following:
+ <ul class="brief">
+ <li><span>Phrasing content</span>, but with no <code>ruby</code> elements and with no <code>ruby</code> element descendants
+ <li>A single <code>ruby</code> element, but with no further <code>ruby</code> element descendants
+ </ul>
+ <li>One or the other of the following:
+ <ul class="brief">
+ <li>One or more <code>rt</code> elements
+ <li>An <code>rp</code> element followed by one or more <code>rt</code> elements, each of which is itself followed by an <code>rp</code> element
+ </ul>
+ </ol>
+
+ <!-- ( ( phrasing-content | <ruby> ) ( <rt>+ | <rp> ( <rt> <rp> )+ ) )+ // with further ruby descendant restrictions -->
+
+ <p>The <code>ruby</code> and <code>rt</code> elements can be used
+ for a variety of kinds of annotations, including in particular those
+ described below. For more details on Japanese Ruby in particular,
+ and how to render Ruby for Japanese, see <cite>Requirements for
+ Japanese Text Layout</cite>. <a href="#refsJLREQ">[JLREQ]</a></p>
+
+ <p class="note">At the time of writing, CSS does not yet provide a
+ way to fully control the rendering of the HTML <code>ruby</code>
+ element. It is hoped that CSS will be extended to support the styles
+ described below in due course.</p>
+
+ <!-- examples in the following list are mostly based on those in http://www.w3.org/International/datespace/2010/02/jlreq-examples/ -->
+
+ <dl>
+
+ <dt>Mono-ruby for individual base characters
+
+ <dd>
+
+ <p>One or more hiragana or katakana characters (the ruby
+ annotation) are placed with each ideographic character (the base
+ text). This is used to provide readings of kanji characters.
+
+ <div class="example"> <!-- B as in BASE -->
+ <pre><ruby>B<rt>annotation</ruby></pre>
+ </div>
+
+ <div class="example">
+ <p>In this example, notice how each annotation corresponds to a single base character.
+ <pre><ruby>君<rt>くん</ruby><ruby>子<rt>し</ruby>は<ruby>和<rt>わ</ruby>して<ruby>同<rt>どう</ruby>ぜず。</pre>
+ <p lang=ja><ruby>君<rt>くん</ruby><ruby>子<rt>し</ruby>は<ruby>和<rt>わ</ruby>して<ruby>同<rt>どう</ruby>ぜず。
+ </div>
+
+ </dd>
+
+
+ <dt>Mono-ruby for compound words (jukugo)
+
+ <dd>
+
+ <p>This is similar to the previous case: each ideographic
+ character in the compound word (the base text) has its reading
+ given in hiragana or katakana characters (the ruby annotation).
+ The difference is that the base text segments form a compound word
+ rather than being separate from each other.
+
+ <div class="example"> <!-- B as in BASE -->
+ <pre><ruby>B<rt>annotation</rt>B<rt>annotation</ruby></pre>
+ </div>
+
+ <div class="example">
+ <p>In this example, notice again how each annotation corresponds to a single base character. In this example, each compound word (jukugo) corresponds to a single <code>ruby</code> element.</p>
+ <p>The rendering here is expected to be that each annotation be placed over (or next to, in vertical text) the corresponding base character, with the annotations not overhanging any of the adjacent characters.</p>
+ <pre><ruby>鬼<rt>き</rt>門<rt>もん</rt></ruby>の<ruby>方<rt>ほう</rt>角<rt>がく</rt></ruby>を<ruby>凝<rt>ぎょう</rt>視<rt>し</rt></ruby>する</pre>
+ <p lang=ja><ruby>鬼<rt>き</rt>門<rt>もん</rt></ruby>の<ruby>方<rt>ほう</rt>角<rt>がく</rt></ruby>を<ruby>凝<rt>ぎょう</rt>視<rt>し</rt></ruby>する
+
+ </div>
+
+ </dd>
+
+
+ <dt>Jukugo-ruby
+
+ <dd>
+
+ <p>This is semantically identical to the previous case (each
+ individual ideographic character in the base compound word has its
+ reading given in an annotation in hiragana or katakana
+ characters), but the rendering is the more complicated Jukugo Ruby
+ rendering.
+
+ <div class="example">
+ <p>This is the same example as above for mono-ruby for compound words. The different rendering is expected to be achieved using different styling (e.g. in CSS), and is not shown here.</p>
+ <pre><ruby>鬼<rt>き</rt>門<rt>もん</rt></ruby>の<ruby>方<rt>ほう</rt>角<rt>がく</rt></ruby>を<ruby>凝<rt>ぎょう</rt>視<rt>し</rt></ruby>する</pre>
+ <!-- Once CSS is updated to describe this, invoke the CSS and unhide this -->
+ <!--
+ <p lang=ja><ruby>鬼<rt>き</rt>門<rt>もん</rt></ruby>の<ruby>方<rt>ほう</rt>角<rt>がく</rt></ruby>を<ruby>凝<rt>ぎょう</rt>視<rt>し</rt></ruby>する
+ -->
+ </div>
+
+ <p class="note">For more details on <a
+ href="http://www.w3.org/TR/jlreq/#positioning_of_jukugoruby">Jukugo
+ Ruby rendering</a>, see Appendix F in the <cite>Requirements for
+ Japanese Text Layout</cite>. <a href="#refsJLREQ">[JLREQ]</a></p>
+
+ </dd>
+
+
+ <dt>Group ruby for describing meanings
+
+ <dd>
+
+ <p>The annotation describes the meaning of the base text, rather
+ than (or in addition to) the pronunciation. As such, both the base
+ text and the annotation can be multiple characters long.
+
+ <div class="example">
+ <pre><ruby>BASE<rt>annotation</ruby></pre>
+ </div>
+
+ <div class="example">
+ <p>Here a compound ideographic word has its corresponding katakana given as an annotation.
+ <pre><ruby>境界面<rt>インターフェース</ruby></pre>
+ <p lang=ja><ruby>境界面<rt>インターフェース</ruby>
+ </div>
+
+ <div class="example">
+ <p>Here a compound ideographic word has its translation in English provided as an annotation.
+ <pre><ruby lang="ja">編集者<rt lang="en">editor</ruby></pre>
+ <p><ruby lang="ja">編集者<rt lang="en">editor</ruby>
+ </div>
+
+ </dd>
+
+
+ <dt>Group ruby for Jukuji readings
+
+ <dd>
+
+ <p>A phonetic reading that corresponds to multiple base
+ characters, because a one-to-one mapping would be difficult. (In
+ English, the words "Colonel" and "Lieutenant" are examples of
+ words where a direct mapping of pronunciation to individual
+ letters is, in some dialects, rather unclear.)
+
+ <div class="example">
+ <p>In this example, the name of a species of flowers has a phonetic reading provided using group ruby:
+ <pre><ruby>紫陽花<rt>あじさい</ruby></pre>
+ <p lang=ja><ruby>紫陽花<rt>あじさい</ruby>
+ </div>
+
+ </dd>
+
+
+ <dt>Text with both phonetic and semantic annotations (double-sided ruby)
+
+ <dd>
+
+ <p>Sometimes, ruby styles described above are combined.
+
+ <div class="example">
+ <pre><ruby>BASE<rt>annotation 1<rt>annotation 2</ruby></pre>
+ </div>
+
+ <div class="example">
+ <pre><ruby><ruby>B<rt>a</rt>A<rt>n</rt>S<rt>t</rt>E<rt>n</rt></ruby><rt>annotation</ruby></pre>
+ </div>
+
+ <div class="example">
+ <p>Here both a phonetic reading and the meaning are given in ruby annotations. The annotation on the nested <code>ruby</code> element gives a mono-ruby phonetic annotation for each base character, while the annotation in the <code>rt</code> element that is a child of the outer <code>ruby</code> element gives the meaning using hiragana.
+ <pre><ruby><ruby>東<rt>とう</rt>南<rt>なん</rt></ruby><rt>たつみ</rt></ruby>の方角</pre>
+ <p lang=ja><ruby><ruby>東<rt>とう</rt>南<rt>なん</rt></ruby><rt>たつみ</rt></ruby>の方角
+ </div>
+
+ </dd>
+
+ </dl>
+
+ <hr>
+
+ <p>Within a <code>ruby</code> element that does not have a
+ <code>ruby</code> element ancestor, content is segmented and
+ segments are placed into three categories: base text segments,
+ annotation segments, and ignored segments. Ignored segments do not
+ form part of the document's semantics (they consist of some
+ <span>inter-element whitespace</span> and <code>rp</code> elements,
+ the latter of which are used for legacy user agents that do not
+ support ruby at all). Base text segments can overlap (with a limit
+ of two segments overlapping any one position in the DOM, and with
+ any segment having an earlier start point than an overlapping
+ segment also having an equal or later end point, and any segment
+ have a later end point than an overlapping segment also having an
+ equal or earlier start point<!-- if anyone can find a better way of
+ phrasing this parenthetical, do let me know! -->). Annotation
+ segments correspond to <code>rt</code> elements. Each annotation
+ segment can be associated with a base text segment, and each base
+ text segment can have annotation segments associated with it. (In a
+ conforming document, each base text segment is associated with at
+ least one annotation segment, and each annotation segment is
+ associated with one base text segment.) A <code>ruby</code> element
+ <span>represents</span> the union of the segments of base text it
+ contains, along with the mapping from those base text segments to
+ annotation segments. Segments are described in terms of DOM ranges;
+ annotation segment ranges always consist of exactly one element. <a
+ href="#refsDOMCORE">[DOMCORE]</a></p>
+
+ <p>At any particular time, the segmentation and categorisation of
+ content of a <code>ruby</code> element is the result that would be
+ obtained from running the following algorithm:</p>
+
+ <ol>
+
+ <li><p>Let <var title="">base text segments</var> be an empty list
+ of base text segments, each potentially with a list of base text
+ subsegments.</p></li>
+
+ <li><p>Let <var title="">annotation segments</var> be an empty list
+ of annotation segments, each potentially being associated with a
+ base text segment or subsegment.</p></li>
+
+ <li><p>Let <var title="">root</var> be the <code>ruby</code>
+ element for which the algorithm is being run.</p></li>
+
+ <li><p>If <var title="">root</var> has a <code>ruby</code> element
+ ancestor, then jump to the step labeled <i>end</i>.</p></li>
+
+ <li><p>Let <var title="">current parent</var> be <var
+ title="">root</var>.</p></li>
+
+ <li><p>Let <var title="">index</var> be 0.</p></li>
+
+ <li><p>Let <var title="">start index</var> be null.</p></li>
+
+ <li><p>Let <var title="">parent start index</var> be null.</p></li>
+
+ <li><p>Let <var title="">current base text</var> be null.</p></li>
+
+
+ <!-- This is spaghetti code. If someone can work out a way to
+ phrase this that is as unambiguous but maps more cleanly to
+ structured code, please let me know. -->
+
+
+ <li><p><i>Start mode</i>: If <var title="">index</var> is equal to
+ or greater than the number of child nodes in <var title="">current
+ parent</var>, then jump to the step labeled <i>end mode</i>.</p>
+
+ <li><p>If the <var title="">index</var>th node in <var
+ title="">current parent</var> is an <code>rt</code> or
+ <code>rp</code> element, jump to the step labeled <i>annotation
+ mode</i>.</p></li>
+
+ <!-- if we get here then the first node in a ruby element or after
+ an <rt> or <rp> is something we want in a base text -->
+
+ <li><p>Set <var title="">start index</var> to the value of <var
+ title="">index</var>.</p></li>
+
+ <li><p><i>Base mode</i>: If the <var title="">index</var>th node in
+ <var title="">current parent</var> is a <code>ruby</code> element,
+ and if <var title="">current parent</var> is the same element as
+ <var title="">root</var>, then <span>push a ruby level</span> and
+ then jump to the step labeled <i>start mode</i>.</p></li>
+
+ <li><p>If the <var title="">index</var>th node in <var
+ title="">current parent</var> is an <code>rt</code> or
+ <code>rp</code> element, then <span>set the current base
+ text</span> and then jump to the step labeled <i>annotation
+ mode</i>.</p></li>
+
+ <li><p>Increment <var title="">index</var> by one.</p></li>
+
+ <li><p><i>Base mode post-increment</i>: If <var
+ title="">index</var> is equal to or greater than the number of
+ child nodes in <var title="">current parent</var>, then jump to the
+ step labeled <i>end mode</i>.</p></li>
+
+ <li><p>Jump back to the step labeled <i>base mode</i>.</p></li>
+
+
+ <li><p><i>Annotation mode</i>: If the <var title="">index</var>th
+ node in <var title="">current parent</var> is an <code>rt</code>
+ element, then <span>push a ruby annotation</span> and jump to the
+ step labeled <i>annotation mode increment</i>.</p></li>
+
+ <li><p>If the <var title="">index</var>th node in <var
+ title="">current parent</var> is an <code>rp</code> element, jump
+ to the step labeled <i>annotation mode increment</i>.</p></li>
+
+ <li><p>If the <var title="">index</var>th node in <var
+ title="">current parent</var> is not a <code>Text</code> node, or
+ is a <code>Text</code> node that is not <span>inter-element
+ whitespace</span>, then jump to the step labeled <i>base
+ mode</i>.</p></li>
+
+ <!-- index points at whitespace -->
+
+ <li><p><i>Annotation mode increment</i>: Let <var
+ title="">lookahead index</var> be <var title="">index</var> plus
+ one.</p></li>
+
+ <li><p><i>Annotation mode white-space skipper</i>: If <var
+ title="">lookahead index</var> is equal to the number of child
+ nodes in <var title="">current parent</var> then jump to the step
+ labeled <i>end mode</i>.</p></li>
+
+ <li><p>If the <var title="">lookahead index</var>th node in <var
+ title="">current parent</var> is an <code>rt</code> element or an
+ <code>rp</code> element, then set <var title="">index</var> to <var
+ title="">lookahead index</var> and jump to the step labeled
+ <i>annotation mode</i>.</p></li>
+
+ <li><p>If the <var title="">lookahead index</var>th node in <var
+ title="">current parent</var> is not a <code>Text</code> node, or
+ is a <code>Text</code> node that is not <span>inter-element
+ whitespace</span>, then jump to the step labeled <i>base mode</i>
+ (without further incrementing <var title="">index</var>, so the
+ <span>inter-element whitespace</span> seen so far becomes part of
+ the next base text segment).</p></li>
+
+ <li><p>Increment <var title="">lookahead index</var> by
+ one.</p></li>
+
+ <li><p>Jump to the step labeled <i>annotation mode white-space
+ skipper</i>.</p></li>
+
+
+ <li><p><i>End mode</i>: If <var title="">current parent</var> is
+ not the same element as <var title="">root</var>, then <span>pop a
+ ruby level</span> and jump to the step labeled <i>base mode
+ post-increment</i>.</p></li>
+
+ <li><p><i>End</i>: Return <var title="">base text segments</var>
+ and <var title="">annotation segments</var>. Any content of the
+ <code>ruby</code> element not described by segments in either of
+ thost lists is implicitly in an <i>ignored segment</i>.</p></li>
+
+ </ol>
+
+
+ <p>When the steps above say to <dfn>set the current base text</dfn>,
+ it means to run the following steps at that point in the
+ algorithm:</p>
+
+ <ol>
+
+ <li><p>Let <var title="">text range</var> a DOM range whose <span
+ title="concept-range-start">start</span> is the <span
+ title="concept-range-bp">boundary point</span> (<var
+ title="">current parent</var>, <var title="">start index</var>) and
+ whose <span title="concept-range-end">end</span> is the <span
+ title="concept-range-bp">boundary point</span> (<var
+ title="">current parent</var>, <var title="">index</var>).</p></li>
+
+ <li><p>Let <var title="">new text segment</var> be a base text
+ segment described by the range <var title="">annotation
+ range</var>.</p>
+
+ <li><p>Add <var title="">new text segment</var> to <var
+ title="">base text segments</var>.</p></li>
+
+ <li><p>Let <var title="">current base text</var> be <var
+ title="">new text segment</var>.</p></li>
+
+ <li><p>Let <var title="">start index</var> be null.</p></li>
+
+ </ol>
+
+
+ <p>When the steps above say to <dfn>push a ruby level</dfn>, it
+ means to run the following steps at that point in the algorithm:</p>
+
+ <ol>
+
+ <li><p>Let <var title="">current parent</var> be the <var
+ title="">index</var>th node in <var title="">current
+ parent</var>.</p></li>
+
+ <li><p>Let <var title="">index</var> be 0.</p></li>
+
+ <li><p>Set <var title="">saved start index</var> to the value of
+ <var title="">start index</var>.</p></li>
+
+ <li><p>Let <var title="">start index</var> be null.</p></li>
+
+ </ol>
+
+
+ <p>When the steps above say to <dfn>pop a ruby level</dfn>, it means
+ to run the following steps at that point in the algorithm:</p>
+
+ <ol>
+
+ <li><p>Let <var title="">index</var> be the position of <var
+ title="">current parent</var> in <var title="">root</var>.</p></li>
+
+ <li><p>Let <var title="">current parent</var> be <var
+ title="">root</var>.</p></li>
+
+ <li><p>Increment <var title="">index</var> by one.</p></li>
+
+ <li><p>Set <var title="">start index</var> to the value of
+ <var title="">saved start index</var>.</p></li>
+
+ <li><p>Let <var title="">saved start index</var> be null.</p></li>
+
+ </ol>
+
+
+ <p>When the steps above say to <dfn>push a ruby annotation</dfn>, it
+ means to run the following steps at that point in the algorithm:</p>
+
+ <ol>
+
+ <li><p>Let <var title="">rt</var> be the <code>rt</code> element
+ that is the <var title="">index</var>th node of <var
+ title="">current parent</var>.</p></li>
+
+ <li><p>Let <var title="">annotation range</var> a DOM range whose
+ <span title="concept-range-start">start</span> is the <span
+ title="concept-range-bp">boundary point</span> (<var
+ title="">current parent</var>, <var title="">index</var>) and whose
+ <span title="concept-range-end">end</span> is the <span
+ title="concept-range-bp">boundary point</span> (<var
+ title="">current parent</var>, <var title="">index</var> plus one)
+ (i.e. that contains only <var title="">rt</var>).</p></li>
+
+ <li><p>Let <var title="">new annotation segment</var> be an
+ annotation segment described by the range <var title="">annotation
+ range</var>.</p></li>
+
+ <li><p>If <var title="">current base text</var> is not null,
+ associate <var title="">new annotation segment</var> with <var
+ title="">current base text</var>.</p></li>
+
+ <li><p>Add <var title="">new annotation segment</var> to <var
+ title="">annotation segments</var>.</p></li>
+
+ </ol>
+
<div class="example">
<!-- this is the hiragana for the word "kanji" ("chinese character") in japanese -->
@@ -24352,7 +24784,7 @@
<div class="example">
- <!-- this is the bopomofo for the word "hanzi" ("chinese character") in traditional chinese, as used in taiwan -->
+ <!-- this is the zhuyin fuhao (aka bopomofo) for the word "hanzi" ("chinese character") in traditional chinese, as used in taiwan -->
<p>In this example, each ideograph in the traditional Chinese text
<span title="" lang="zh-TW">漢字</span> is annotated
@@ -24386,7 +24818,22 @@
<!-- Note: Examples are 32px/16px Stone Sans Sem ITC TT -->
+ <div class="example">
+ <p>In this more contrived example, the acronym "HTML" has four
+ annotations: one for the whole acronym, briefly describing what it
+ is, one for the letters "HT" expanding them to "Hypertext", one for
+ the letter "M" expanding it to "Markup", and one for the letter "L"
+ expanding it to "Language".</p>
+
+ <pre><ruby>
+ <ruby>HT<rt>Hypertext</rt>M<rt>Markup</rt>L<rt>Language</rt></ruby>
+ <rt>An abstract language for describing documents and applications
+</ruby></pre>
+
+ </div>
+
+
<h4>The <dfn><code>rt</code></dfn> element</h4>
<dl class="element">
@@ -42765,7 +43212,7 @@
</li>
<li><p>If <var title="">position</var> is greater than <var
- title="">width</var>, then jump to the step labeld
+ title="">width</var>, then jump to the step labeled
<i>joins</i>.</p></li>
<li><p>If <var title="">segment length</var> is greater than zero,
@@ -102276,7 +102723,7 @@
<li><i>Next byte</i>: Move <var title="">position</var> so it
points at the next byte in the input byte stream, and return to the
- step above labeld <i>loop</i>.</li>
+ step above labeled <i>loop</i>.</li>
</ol>
@@ -111923,6 +112370,16 @@
boxes whose 'display' property has the value 'ruby-base'. <a
href="#refsCSSRUBY">[CSSRUBY]</a></p>
+ <p>When a particular part of a ruby has more than one annotation,
+ the annotations should be distributed on both sides of the base text
+ so as to minimise the stacking of ruby annotations on one side.</p>
+
+ <p class="note">When it becomes possible to do so, the preceding
+ requirement will be updated to be expressed in terms of CSS ruby.
+ (Currently, CSS ruby does not handle nested <code>ruby</code>
+ elements or multiple sequential <code>rt</code> elements, which is
+ how this semantic is expressed.)</p>
+
<p>User agents that do not support correct ruby rendering are
expected to render parentheses around the text of <code>rt</code>
elements in the absence of <code>rp</code> elements.</p>
@@ -122528,6 +122985,9 @@
character sets — Part 11: Latin/Thai
alphabet</a></cite>. ISO.</dd>
+ <dt id="refsJLREQ">[JLREQ]</dt>
+ <dd><cite><a href="http://www.w3.org/TR/jlreq/">Requirements for Japanese Text Layout</a></cite>. W3C.</dd> <!-- too many editors to list -->
+
<dt id="refsJPEG">[JPEG]</dt>
<dd><cite><a href="http://www.w3.org/Graphics/JPEG/jfif3.pdf">JPEG File Interchange Format</a></cite>, E. Hamilton.</dd>
@@ -123349,6 +123809,7 @@
Ivan Enderlin,
Ivo Emanuel Gonçalves,
J. King,
+ Jacob Davies,
Jacques Distler,
Jake Verbaten,
James Craig,
More information about the Commit-Watchers
mailing list