html5/spec Overview.html,1.4535,1.4536

Update of /sources/public/html5/spec
In directory hutz:/tmp/cvs-serv1037

Modified Files:
	Overview.html 
Log Message:
Add a <bdi> element to safely let people insert user-generated content that may have bidi implications. (whatwg r5669)

Index: Overview.html
===================================================================
RCS file: /sources/public/html5/spec/Overview.html,v
retrieving revision 1.4535
retrieving revision 1.4536
diff -u -d -r1.4535 -r1.4536
--- Overview.html	3 Nov 2010 23:14:10 -0000	1.4535
+++ Overview.html	5 Nov 2010 00:55:29 -0000	1.4536
@@ -734,11 +734,12 @@
      <li><a href="#the-ruby-element"><span class="secno">4.6.19 </span>The <code>ruby</code> element</a></li>
      <li><a href="#the-rt-element"><span class="secno">4.6.20 </span>The <code>rt</code> element</a></li>
      <li><a href="#the-rp-element"><span class="secno">4.6.21 </span>The <code>rp</code> element</a></li>
-     <li><a href="#the-bdo-element"><span class="secno">4.6.22 </span>The <code>bdo</code> element</a></li>
-     <li><a href="#the-span-element"><span class="secno">4.6.23 </span>The <code>span</code> element</a></li>
-     <li><a href="#the-br-element"><span class="secno">4.6.24 </span>The <code>br</code> element</a></li>
-     <li><a href="#the-wbr-element"><span class="secno">4.6.25 </span>The <code>wbr</code> element</a></li>
-     <li><a href="#usage-summary"><span class="secno">4.6.26 </span>Usage summary</a></ol></li>
+     <li><a href="#the-bdi-element"><span class="secno">4.6.22 </span>The <code>bdi</code> element</a></li>
+     <li><a href="#the-bdo-element"><span class="secno">4.6.23 </span>The <code>bdo</code> element</a></li>
+     <li><a href="#the-span-element"><span class="secno">4.6.24 </span>The <code>span</code> element</a></li>
+     <li><a href="#the-br-element"><span class="secno">4.6.25 </span>The <code>br</code> element</a></li>
+     <li><a href="#the-wbr-element"><span class="secno">4.6.26 </span>The <code>wbr</code> element</a></li>
+     <li><a href="#usage-summary"><span class="secno">4.6.27 </span>Usage summary</a></ol></li>
    <li><a href="#edits"><span class="secno">4.7 </span>Edits</a>
     <ol>
      <li><a href="#the-ins-element"><span class="secno">4.7.1 </span>The <code>ins</code> element</a></li>
@@ -8905,6 +8906,7 @@
    <li><code><a href="#the-aside-element">aside</a></code></li>
    <li><code><a href="#audio">audio</a></code></li>
    <li><code><a href="#the-b-element">b</a></code></li>
+   <li><code><a href="#the-bdi-element">bdi</a></code></li>
    <li><code><a href="#the-bdo-element">bdo</a></code></li>
    <li><code><a href="#the-blockquote-element">blockquote</a></code></li>
    <li><code><a href="#the-br-element">br</a></code></li>
@@ -9013,6 +9015,7 @@
    <li><code><a href="#the-area-element">area</a></code> (if it is a descendant of a <code><a href="#the-map-element">map</a></code> element)</li>
    <li><code><a href="#audio">audio</a></code></li>
    <li><code><a href="#the-b-element">b</a></code></li>
+   <li><code><a href="#the-bdi-element">bdi</a></code></li>
    <li><code><a href="#the-bdo-element">bdo</a></code></li>
    <li><code><a href="#the-br-element">br</a></code></li>
    <li><code><a href="#the-button-element">button</a></code></li>
@@ -17241,7 +17244,50 @@
 
    <pre lang="ja">... &#28450; (&#12363;&#12435;) &#23383; (&#12376;) ...</pre>
 
-  </div><h4 id="the-bdo-element"><span class="secno">4.6.22 </span>The <dfn><code>bdo</code></dfn> element</h4><dl class="element"><dt>Categories</dt>
+  </div><h4 id="the-bdi-element"><span class="secno">4.6.22 </span>The <dfn><code>bdi</code></dfn> element</h4><dl class="element"><dt>Categories</dt>
+   <dd><a href="#flow-content">Flow content</a>.</dd>
+   <dd><a href="#phrasing-content">Phrasing content</a>.</dd>
+   <dt>Contexts in which this element can be used:</dt>
+   <dd>Where <a href="#phrasing-content">phrasing content</a> is expected.</dd>
+   <dt>Content model:</dt>
+   <dd><a href="#phrasing-content">Phrasing content</a>.</dd>
+   <dt>Content attributes:</dt>
+   <dd><a href="#global-attributes">Global attributes</a></dd>
+   <!--XXX <dd>Also, the <code title="attr-dir">dir</code> global attribute has special semantics on this element.</dd>-->
+   <dt>DOM interface:</dt>
+   <dd>Uses <code><a href="#htmlelement">HTMLElement</a></code>.</dd>
+  </dl><p>The <code><a href="#the-bdi-element">bdi</a></code> element <a href="#represents">represents</a> a span of
+  text that is to be isolated from its surroundings for the purposes
+  of bidirectional text formatting. <a href="#refsBIDI">[BIDI]</a></p><!-- XXX once we have dir=auto, this element should default to dir=auto --><div class="impl">
+
+  <p>For the purposes of the bidirectional algorithm, the user agent
+  must act as if the contents of the element were a self-contained
+  paragraph not present in the parent element.</p>
+
+  <p>The requirements on handling the <code><a href="#the-bdi-element">bdi</a></code> element for the
+  bidi algorithm may be implemented indirectly through the style
+  layer. For example, an HTML+CSS user agent should implement these
+  requirements by implementing the CSS 'unicode-bidi' property. <a href="#refsCSS">[CSS]</a></p>
+
+  </div><div class="example">
+
+   <p>This element is especially useful when embedding user-generated
+   content with an unknown directionality.</p>
+
+   <p>In this example, usernames are shown along with the number of
+   posts that the user has submitted. If the <code><a href="#the-bdi-element">bdi</a></code> element
+   was not used, the username of the Arabic user would end up
+   confusing the text (the bidirectional algorithm would put the colon
+   next and the number "3" to the word "User" rather than next to the
+   word "posts").</p>
+
+   <pre>&lt;ul&gt;
+ &lt;li&gt;User &lt;bdi&gt;jcranmer&lt;/bdi&gt;: 12 posts.
+ &lt;li&gt;User &lt;bdi&gt;hober&lt;/bdi&gt;: 5 posts.
+ &lt;li&gt;User &lt;bdi&gt;<bdo dir="rtl">&#1573;&#1610;&#1575;&#1606;</bdo>&lt;/bdi&gt;: 3 posts.
+&lt;/ul&gt;</pre>
+
+  </div><h4 id="the-bdo-element"><span class="secno">4.6.23 </span>The <dfn><code>bdo</code></dfn> element</h4><dl class="element"><dt>Categories</dt>
    <dd><a href="#flow-content">Flow content</a>.</dd>
    <dd><a href="#phrasing-content">Phrasing content</a>.</dd>
    <dt>Contexts in which this element can be used:</dt>
@@ -17280,7 +17326,7 @@
   layer. For example, an HTML+CSS user agent should implement these
   requirements by implementing the CSS 'unicode-bidi' property. <a href="#refsCSS">[CSS]</a></p>
 
-  </div><h4 id="the-span-element"><span class="secno">4.6.23 </span>The <dfn><code>span</code></dfn> element</h4><dl class="element"><dt>Categories</dt>
+  </div><h4 id="the-span-element"><span class="secno">4.6.24 </span>The <dfn><code>span</code></dfn> element</h4><dl class="element"><dt>Categories</dt>
    <dd><a href="#flow-content">Flow content</a>.</dd>
    <dd><a href="#phrasing-content">Phrasing content</a>.</dd>
    <dt>Contexts in which this element can be used:</dt>
@@ -17311,7 +17357,7 @@
     &lt;span class="keyword"&gt;break&lt;/span&gt;;
 }&lt;/code&gt;&lt;/pre&gt;</pre>
 
-  </div><h4 id="the-br-element"><span class="secno">4.6.24 </span>The <dfn><code>br</code></dfn> element</h4><dl class="element"><dt>Categories</dt>
+  </div><h4 id="the-br-element"><span class="secno">4.6.25 </span>The <dfn><code>br</code></dfn> element</h4><dl class="element"><dt>Categories</dt>
    <dd><a href="#flow-content">Flow content</a>.</dd>
    <dd><a href="#phrasing-content">Phrasing content</a>.</dd>
    <dt>Contexts in which this element can be used:</dt>
@@ -17370,7 +17416,7 @@
   <p>A <code><a href="#the-br-element">br</a></code> element does not separate paragraphs for the
   purposes of the Unicode bidirectional algorithm. <a href="#refsBIDI">[BIDI]</a></p>
 
-  </div><h4 id="the-wbr-element"><span class="secno">4.6.25 </span>The <dfn><code>wbr</code></dfn> element</h4><dl class="element"><dt>Categories</dt>
+  </div><h4 id="the-wbr-element"><span class="secno">4.6.26 </span>The <dfn><code>wbr</code></dfn> element</h4><dl class="element"><dt>Categories</dt>
    <dd><a href="#flow-content">Flow content</a>.</dd>
    <dd><a href="#phrasing-content">Phrasing content</a>.</dd>
    <dt>Contexts in which this element can be used:</dt>
@@ -17398,7 +17444,7 @@
   <p>Any content inside <code><a href="#the-wbr-element">wbr</a></code> elements must not be
   considered part of the surrounding text.</p>
 
-  </div><h4 id="usage-summary"><span class="secno">4.6.26 </span>Usage summary</h4><p><i>This section is non-normative.</i><table><thead><tr><th>Element
+  </div><h4 id="usage-summary"><span class="secno">4.6.27 </span>Usage summary</h4><p><i>This section is non-normative.</i><table><thead><tr><th>Element
      <th>Purpose
      <th>Example
    <tbody><tr><td><code><a href="#the-a-element">a</a></code>
@@ -17481,6 +17527,10 @@
      <td>Ruby annotations
      <td><pre class="example"><strong>&lt;ruby&gt; OJ &lt;rp&gt;(&lt;rt&gt;Orange Juice&lt;rp&gt;)&lt;/ruby&gt;</strong></pre>
 
+    <tr><td><code><a href="#the-bdi-element">bdi</a></code>
+     <td>Text directionality isolation
+     <td><pre class="example">The recommended restaurant is <strong>&lt;bdi lang=""&gt;My Juice Caf&eacute; (At The Beach)&lt;/bdi&gt;</strong>.</pre>
+
     <tr><td><code><a href="#the-bdo-element">bdo</a></code>
      <td>Text directionality formatting
      <td><pre class="example">The proposal is to write English, but in reverse order. "Juice" would become "<strong>&lt;bdo dir=rtl&gt;Juice&lt;/bdo&gt;</strong>"</pre>
@@ -62857,7 +62907,8 @@
 
 [dir=ltr] { direction: ltr; unicode-bidi: embed; } /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
 [dir=rtl] { direction: rtl; unicode-bidi: embed; } /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
-bdo[dir=ltr], bdo[dir=rtl] { unicode-bidi: bidi-override; } /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */</pre>
+bdo[dir=ltr], bdo[dir=rtl] { unicode-bidi: bidi-override; } /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
+bdi { unicode-bidi: isolate; }</pre>
 
   <p>In addition, rules setting the 'quotes' property appropriately
   for the locales and languages understood by the user are expected to
@@ -67180,6 +67231,14 @@
          <code title="attr-base-href"><a href="#attr-base-href">href</a></code>;
          <code title="attr-base-target"><a href="#attr-base-target">target</a></code></td>
      <td><code><a href="#htmlbaseelement">HTMLBaseElement</a></code></td>
+    <tr><th><code><a href="#the-bdi-element">bdi</a></code></th>
+     <td>Text directionality isolation</td>
+     <td><a href="#flow-content" title="Flow content">flow</a>;
+         <a href="#phrasing-content" title="Phrasing content">phrasing</a></td>
+     <td><a href="#phrasing-content" title="Phrasing content">phrasing</a></td>
+     <td><a href="#phrasing-content" title="Phrasing content">phrasing</a></td>
+     <td><a href="#global-attributes" title="global attributes">globals</a></td>
+     <td><code><a href="#htmlelement">HTMLElement</a></code></td>
     <tr><th><code><a href="#the-bdo-element">bdo</a></code></th>
      <td>Text directionality formatting</td>
      <td><a href="#flow-content" title="Flow content">flow</a>;
@@ -68221,6 +68280,7 @@
       <code><a href="#the-aside-element">aside</a></code>;
       <code><a href="#audio">audio</a></code>;
       <code><a href="#the-b-element">b</a></code>;
+      <code><a href="#the-bdi-element">bdi</a></code>;
       <code><a href="#the-bdo-element">bdo</a></code>;
       <code><a href="#the-blockquote-element">blockquote</a></code>;
       <code><a href="#the-br-element">br</a></code>;
@@ -68322,6 +68382,7 @@
       <code><a href="#the-abbr-element">abbr</a></code>;
       <code><a href="#audio">audio</a></code>;
       <code><a href="#the-b-element">b</a></code>;
+      <code><a href="#the-bdi-element">bdi</a></code>;
       <code><a href="#the-bdo-element">bdo</a></code>;
       <code><a href="#the-br-element">br</a></code>;
       <code><a href="#the-button-element">button</a></code>;
@@ -69595,6 +69656,9 @@
     <tr><td> <code><a href="#the-base-element">base</a></code>
      <td> <code><a href="#htmlbaseelement">HTMLBaseElement</a></code> : <code><a href="#htmlelement">HTMLElement</a></code>
 
+    <tr><td> <code><a href="#the-bdi-element">bdi</a></code>
+     <td> <code><a href="#htmlelement">HTMLElement</a></code>
+
     <tr><td> <code><a href="#the-bdo-element">bdo</a></code>
      <td> <code><a href="#htmlelement">HTMLElement</a></code>

Received on Friday, 5 November 2010 00:55:39 UTC