[cit] (2) <ruby> support. This isn't very compatible with IE, but it …

…seems to be relatively compatible with the Web's usage of ruby.

git-svn-id: http://svn.whatwg.org/webapps@1704 340c8d12-0b0e-0410-8428-c7bf67bfef74

index

@@ -25,7 +25,7 @@
 
    <h1 id=html-5>HTML 5</h1>
 
-   <h2 class="no-num no-toc" id=draft>Draft Recommendation &mdash; 25 May
+   <h2 class="no-num no-toc" id=draft>Draft Recommendation &mdash; 26 May
     2008</h2>
 
    <p>You can take part in this work. <a
@@ -600,10 +600,19 @@
        <li><a href="#the-bdo"><span class=secno>3.10.21 </span>The
         <code>bdo</code> element</a>
 
-       <li><a href="#usage"><span class=secno>3.10.22 </span>Usage
+       <li><a href="#the-ruby"><span class=secno>3.10.22 </span>The
+        <code>ruby</code> element</a>
+
+       <li><a href="#the-rt"><span class=secno>3.10.23 </span>The
+        <code>rt</code> element</a>
+
+       <li><a href="#the-rp"><span class=secno>3.10.24 </span>The
+        <code>rp</code> element</a>
+
+       <li><a href="#usage"><span class=secno>3.10.25 </span>Usage
         summary</a>
 
-       <li><a href="#footnotes"><span class=secno>3.10.23
+       <li><a href="#footnotes"><span class=secno>3.10.26
         </span>Footnotes</a>
       </ul>
 
@@ -10794,7 +10803,6 @@ first matching case):&lt;/p&gt;
 
   <h3 id=text-level><span class=secno>3.10 </span>Text-level semantics</h3>
   <!-- XXX ew, find a better section name -->
-  <!-- XXX ruby (delayed until someone can define it with error handling rules) -->
 
   <h4 id=the-a><span class=secno>3.10.1 </span>The <dfn
    id=a><code>a</code></dfn> element</h4>
    <a href="#refsCSS21">[CSS21]</a></p>
   <!-- XXX need examples -->
 
-  <h4 id=usage><span class=secno>3.10.22 </span>Usage summary</h4>
+  <h4 id=the-ruby><span class=secno>3.10.22 </span>The <dfn
+   id=ruby><code>ruby</code></dfn> element</h4>
+
+  <dl class=element>
+   <dt>Categories
+
+   <dd><a href="#phrasing0">Phrasing content</a>.
+
+   <dt>Contexts in which this element may be used:
+
+   <dd>Where <a href="#phrasing0">phrasing content</a> is expected.
+
+   <dt>Content model:
+
+   <dd>One or more groups of: <a href="#phrasing0">phrasing content</a>
+    followed either by a single <code><a href="#rt">rt</a></code> element, or
+    an <code><a href="#rp">rp</a></code> element, an <code><a
+    href="#rt">rt</a></code> element, and another <code><a
+    href="#rp">rp</a></code> element.
+
+   <dt>Element-specific attributes:
+
+   <dd>None.
+
+   <dt>DOM interface:
+
+   <dd>Uses <code><a href="#htmlelement">HTMLElement</a></code>.
+  </dl>
+
+  <p>The <code><a href="#ruby">ruby</a></code> element allows one or more
+   spans of phrasing content to be marked with ruby annotations.
+
+  <p>A <code><a href="#ruby">ruby</a></code> element represents the spans of
+   phrasing content it contains, ignoring all the child <code><a
+   href="#rt">rt</a></code> and <code><a href="#rp">rp</a></code> elements
+   and their descendants. Those spans of phrasing content have associated
+   annotations created using the <code><a href="#rt">rt</a></code> element.
+
+  <div class=example>
+   <p>In this example, each ideograph in the text <span
+    lang=ja>&#x658e;&#x85e4;&#x4fe1;&#x7537;</span> is annotated with its
+    reading.</p>
+
+   <pre lang=ja>... &lt;ruby>
+ &#x658e; &lt;rt> &#x3055;&#x3044; &lt;/rt>
+ &#x85e4; &lt;rt> &#x3068;&#x3046; &lt;/rt>
+ &#x4fe1; &lt;rt> &#x306e;&#x3076; &lt;/rt>
+ &#x7537; &lt;rt> &#x304a;         &lt;/rt>
+&lt;/ruby> ...</pre>
+
+   <p>This might be rendered as:</p>
+
+   <p><img alt="The four main ideographs, each with its reading annotation
+    rendered in a smaller font above it." src="images/sample-ruby.png"></p>
+  </div>
+
+  <h4 id=the-rt><span class=secno>3.10.23 </span>The <dfn
+   id=rt><code>rt</code></dfn> element</h4>
+
+  <dl class=element>
+   <dt>Categories
+
+   <dd>None.
+
+   <dt>Contexts in which this element may be used:
+
+   <dd>As a child of a <code><a href="#ruby">ruby</a></code> element.
+
+   <dt>Content model:
+
+   <dd><a href="#phrasing0">Phrasing content</a>.
+
+   <dt>Element-specific attributes:
+
+   <dd>None.
+
+   <dt>DOM interface:
+
+   <dd>Uses <code><a href="#htmlelement">HTMLElement</a></code>.
+  </dl>
+
+  <p>The <code><a href="#rt">rt</a></code> element marks the ruby text
+   component of a ruby annotation.
+
+  <p>An <code><a href="#rt">rt</a></code> element that is a child of a
+   <code><a href="#ruby">ruby</a></code> element represents an annotation
+   (given by its children) for the zero or more nodes of phrasing content
+   that immediately precedes it in the <code><a href="#ruby">ruby</a></code>
+   element, ignoring <code><a href="#rp">rp</a></code> elements.
+
+  <p>An <code><a href="#rt">rt</a></code> element that is not a child of a
+   <code><a href="#ruby">ruby</a></code> element represents the same thing as
+   its children.
+
+  <h4 id=the-rp><span class=secno>3.10.24 </span>The <dfn
+   id=rp><code>rp</code></dfn> element</h4>
+
+  <dl class=element>
+   <dt>Categories
+
+   <dd>None.
+
+   <dt>Contexts in which this element may be used:
+
+   <dd>As a child of a <code><a href="#ruby">ruby</a></code> element, either
+    immediately before or immediately after an <code><a
+    href="#rt">rt</a></code> element.
+
+   <dt>Content model:
+
+   <dd>If the <code><a href="#rp">rp</a></code> element is immediately after
+    an <code><a href="#rt">rt</a></code> element that is immediately preceded
+    by another <code><a href="#rp">rp</a></code> element: a single character
+    from Unicode character class Pe.
+
+   <dd>Otherwise: a single character from Unicode character class Ps.
+
+   <dt>Element-specific attributes:
+
+   <dd>None.
+
+   <dt>DOM interface:
+
+   <dd>Uses <code><a href="#htmlelement">HTMLElement</a></code>.
+  </dl>
+
+  <p>The <code><a href="#rp">rp</a></code> element can be used to provide
+   parentheses around a ruby text component of a ruby annotation, to be shown
+   by user agents that don't support ruby annotations.
+
+  <p>An <code><a href="#rp">rp</a></code> element that is a child of a
+   <code><a href="#ruby">ruby</a></code> element represents nothing and it
+   and its contents must be ignored. An <code><a href="#rp">rp</a></code>
+   element whose parent element is not a <code><a
+   href="#ruby">ruby</a></code> element represents the same thing as its
+   children.
+
+  <div class=example>
+   <p>The example above, in which each ideograph in the text <span
+    lang=ja>&#x658e;&#x85e4;&#x4fe1;&#x7537;</span> is annotated with its
+    reading, could be expanded to use <code><a href="#rp">rp</a></code> so
+    that in legacy user agentthe readings are in parentheses:</p>
+
+   <pre lang=ja>... &lt;ruby>
+ &#x658e; &lt;rp>(&lt;/rp>&lt;rt>&#x3055;&#x3044;&lt;/rt>&lt;rp>)&lt;/rp>
+ &#x85e4; &lt;rp>(&lt;/rp>&lt;rt>&#x3068;&#x3046;&lt;/rt>&lt;rp>)&lt;/rp>
+ &#x4fe1; &lt;rp>(&lt;/rp>&lt;rt>&#x306e;&#x3076;&lt;/rt>&lt;rp>)&lt;/rp>
+ &#x7537; &lt;rp>(&lt;/rp>&lt;rt>&#x304a;&lt;/rt>&lt;rp>)&lt;/rp>
+&lt;/ruby> ...</pre>
+
+   <p>In conforming user agents the rendering would be as above, but in user
+    agents that do not support ruby, the rendering would be:</p>
+
+   <pre
+    lang=ja>... &#x658e; (&#x3055;&#x3044;) &#x85e4; (&#x3068;&#x3046;) &#x4fe1; (&#x306e;&#x3076;) &#x7537; (&#x304a;) ...</pre>
+  </div>
+
+  <h4 id=usage><span class=secno>3.10.25 </span>Usage summary</h4>
 
   <p class=big-issue>We need to summarize the various elements, in particular
    to distinguish b/i/em/strong/var/q/mark/cite.</p>
   <!-- XXX when you do this, also reorder the elements in this section
   to bring the related ones closer together. -->
 
-  <h4 id=footnotes><span class=secno>3.10.23 </span>Footnotes</h4>
+  <h4 id=footnotes><span class=secno>3.10.26 </span>Footnotes</h4>
 
   <p>HTML does not have a dedicated mechanism for marking up footnotes. Here
    are the recommended alternatives.
    end tags</dfn>, then, while the <a href="#current5">current node</a> is a
    <code><a href="#dd">dd</a></code> element, a <code><a
    href="#dt">dt</a></code> element, an <code><a href="#li">li</a></code>
-   element, or a <code><a href="#p">p</a></code> element, the UA must pop the
-   <a href="#current5">current node</a> off the <a href="#stack">stack of
-   open elements</a>.
+   element, a <code><a href="#p">p</a></code> element, an <code><a
+   href="#rp">rp</a></code> element, or an <code><a href="#rt">rt</a></code>
+   element, the UA must pop the <a href="#current5">current node</a> off the
+   <a href="#stack">stack of open elements</a>.
 
   <p>If a step requires the UA to generate implied end tags but lists an
    element to exclude from the process, then the UA must perform the above
      in table</a>". Otherwise, switch the <span>insertion mode</span> to "<a
      href="#in-select" title="insertion mode: in select">in select</a>".</p>
 
+   <dt>A start tag whose tag name is one of: "rp", "rt"
+
+   <dd> <!-- the parsing rules for ruby really don't match IE much at all,
+         but in practice the markup used is very simple and so strict
+         compatibility with IE isn't required. For example, as defined
+         here we get very, very different behaviour than IE for
+         pathological cases like:
+
+           <ruby><ol><li><p>a<rt>b
+           <ruby>a<rt>b<p>c
+
+         But in practice most ruby markup falls into these cases:
+
+           <ruby>a<rt>b</ruby>
+           <ruby>a<rp>b<rt>c<rp>d</ruby>
+           <ruby>a<rt>b</rt></ruby>
+           <ruby>a<rp>b</rp><rt>c</rt><rp>d</rp></ruby>
+
+    -->
+
+    <p>If the <a href="#stack">stack of open elements</a> <a href="#have-an"
+     title="has an element in scope">has a <code>ruby</code> element in
+     scope</a>, then <a href="#generate">generate implied end tags</a>. If
+     the <a href="#current5">current node</a> is not then a <code><a
+     href="#ruby">ruby</a></code> element, this is a <a href="#parse1">parse
+     error</a>; pop all the nodes from the <a href="#current5">current
+     node</a> up to the node immediately before the bottommost <code><a
+     href="#ruby">ruby</a></code> element on the <a href="#stack">stack of
+     open elements</a>.</p>
+
+    <p><a href="#insert0">Insert an HTML element</a> for the token.</p>
+
    <dt>An end tag whose tag name is "br"
 
    <dd>