Skip to content

Commit

Permalink
[giow] (0) Revamp how dir='' is implemented; add dir=auto; update to …
Browse files Browse the repository at this point in the history 
…recent CSS developments.

Fixing http://www.w3.org/Bugs/Public/show_bug.cgi?id=10808

git-svn-id: http://svn.whatwg.org/webapps@5672 340c8d12-0b0e-0410-8428-c7bf67bfef74
  • Loading branch information
@Hixie
Hixie committed Nov 9, 2010
1 parent 93132b3 commit fd6901d
Show file tree
Hide file tree
Showing 3 changed files with 503 additions and 150 deletions.
207 changes: 158 additions & 49 deletions complete.html
View file
Expand Up @@ -214,7 +214,7 @@

<header class=head id=head><p><a class=logo href=http://www.whatwg.org/ rel=home><img alt=WHATWG height=101 src=/images/logo width=101></a></p>
<hgroup><h1>Web Applications 1.0</h1>
<h2 class="no-num no-toc">Draft Standard &mdash; 5 November 2010</h2>
<h2 class="no-num no-toc">Draft Standard &mdash; 9 November 2010</h2>
</hgroup><p>You can take part in this work. <a href=http://www.whatwg.org/mailing-list>Join the working group's discussion list.</a></p>
<p><strong>Web designers!</strong> We have a <a href=http://blog.whatwg.org/faq/>FAQ</a>, a <a href=http://forums.whatwg.org/>forum</a>, and a <a href=http://www.whatwg.org/mailing-list#help>help mailing list</a> for you!</p>
<!--<p class="impl"><strong>Implementors!</strong> We have a <a href="http://www.whatwg.org/mailing-list#implementors">mailing list</a> for you too!</p>-->
Expand Down Expand Up @@ -9630,41 +9630,127 @@ <h5 id=the-dir-attribute><span class=secno>3.2.3.5 </span>The <dfn title=attr-di

<p>The <code title=attr-dir><a href=#the-dir-attribute>dir</a></code> attribute specifies the
element's text directionality. The attribute is an <a href=#enumerated-attribute>enumerated
attribute</a> with the keyword <code title="">ltr</code> mapping
to the state <i>ltr</i>, and the keyword <code title="">rtl</code>
mapping to the state <i>rtl</i>. The attribute has no <i>invalid
value default</i> and no <i>missing value default</i>.</p>
attribute</a> with the following keywords and states:</p>

<div class=impl>
<dl><dt>The <dfn id=attr-dir-ltr title=attr-dir-ltr><code>ltr</code></dfn> keyword, which maps to the <dfn id=attr-dir-ltr-state title=attr-dir-ltr-state>ltr</dfn> state</dt>

<p>The processing of this attribute is primarily performed by the
presentation layer. For example, the rendering section in this
specification defines a mapping from this attribute to the CSS
'direction' and 'unicode-bidi' properties, and CSS defines rendering
in terms of those properties.</p>

</div>

<p><dfn id=the-directionality>The directionality</dfn> of an element, which is used in
particular by the <code><a href=#the-canvas-element>canvas</a></code> element's text rendering API,
is either 'ltr' or 'rtl'. If the user agent supports CSS and the
'direction' property on this element has a computed value of either
'ltr' or 'rtl', then that is <a href=#the-directionality>the directionality</a> of the
element. Otherwise, if the element is <a href=#being-rendered>being rendered</a>,
then <a href=#the-directionality>the directionality</a> of the element is the
directionality used by the presentation layer, potentially
determined from the value of the <code title=attr-dir><a href=#the-dir-attribute>dir</a></code>
attribute on the element. Otherwise, if the element's <code title=attr-dir><a href=#the-dir-attribute>dir</a></code> attribute has the state <i>ltr</i>, the
element's directionality is 'ltr' (left-to-right); if the attribute
has the state <i>rtl</i>, the element's directionality is 'rtl'
(right-to-left); and otherwise, the element's directionality is the
same as its parent element, or 'ltr' if there is no parent
element.</p>
<dd>

<p>Indicates that the contents of the element are explicitly
directionally embedded left-to-right text.</p>

</dd>

<dt>The <dfn id=attr-dir-rtl title=attr-dir-rtl><code>rtl</code></dfn> keyword, which maps to the <dfn id=attr-dir-rtl-state title=attr-dir-rtl-state>rtl</dfn> state</dt>

<dd>

<p>Indicates that the contents of the element are explicitly
directionally embedded right-to-left text.</p>

</dd>

<dt>The <dfn id=attr-dir-auto title=attr-dir-auto><code>auto</code></dfn> keyword, which maps to the <dfn id=attr-dir-auto-state title=attr-dir-auto-state>auto</dfn> state</dt>

<dd>

<p>Indicates that the contents of the element are explicitly
embedded text, but that the direction is to be determined
programmatically using the contents of the element (as described
below).</p>

<p class=note>The heuristic used by this state is very crude (it
just looks at the first character with a strong directionality, in
a manner analogous to the Paragraph Level determination in the
bidirectional algorithm). Authors are urged to only use this value
as a last resort when the direction of the text is truly unknown
and no better server-side heuristic can be applied.</p>

</dd>

</dl><p>The attribute has no <i>invalid value default</i> and no
<i>missing value default</i>.</p>

<p><dfn id=the-directionality>The directionality</dfn> of an element is either '<dfn id=concept-ltr title=concept-ltr>ltr</dfn>' or '<dfn id=concept-rtl title=concept-rtl>rtl</dfn>', and is determined as per the first
appropriate set of steps from the following list:</p>

<dl class=switch><dt>If the element's <code title=attr-dir><a href=#the-dir-attribute>dir</a></code> attribute is
in the <a href=#attr-dir-ltr-state title=attr-dir-ltr-state>ltr</a> state</dt>

<dd><p><a href=#the-directionality>The directionality</a> of the element is '<a href=#concept-ltr title=concept-ltr>ltr</a>'.</dd>


<dt>If the element's <code title=attr-dir><a href=#the-dir-attribute>dir</a></code> attribute is
in the <a href=#attr-dir-rtl-state title=attr-dir-rtl-state>rtl</a> state</dt>

<dd><p><a href=#the-directionality>The directionality</a> of the element is '<a href=#concept-rtl title=concept-rtl>rtl</a>'.</dd>


<dt>If the element's <code title=attr-dir><a href=#the-dir-attribute>dir</a></code> attribute is
in the <a href=#attr-dir-auto-state title=attr-dir-auto-state>auto</a> state</dt>

<dt>If the element is a <code><a href=#the-bdi-element>bdi</a></code> element and the <code title=attr-dir><a href=#the-dir-attribute>dir</a></code> attribute is not in a defined state
(i.e. it is not present or has an invalid value)</dt>

<dd>

<p>Find the first character in <a href=#tree-order>tree order</a> that
matches the following criteria:</p>

<ul><li><p>The character is from a <a href=#text-node>text node</a> that is a
descendant of the element whose <a href=#the-directionality title="the
directionality">directionality</a> is being
determined.</li>

<li><p>The character is of bidirectional character type L, AL,
or R. <a href=#refsBIDI>[BIDI]</a></li>

<li>

<p>The character is not in a text node that has an ancestor
element that is a descendant of the element whose <a href=#the-directionality title="the directionality">directionality</a> is being
determined and that is either:</p>

<ul class=brief><li>A <code><a href=#script>script</a></code> element.
<li>A <code><a href=#the-style-element>style</a></code> element.
<li>An element with a <code title=attr-dir><a href=#the-dir-attribute>dir</a></code> attribute in a defined state.
</ul></li>

</ul><p>If such a character is found and it is of bidirectional
character type AL or R, <a href=#the-directionality>the directionality</a> of the
element is '<a href=#concept-rtl title=concept-rtl>rtl</a>'.</p>

<p>Otherwise, <a href=#the-directionality>the directionality</a> of the element is
'<a href=#concept-ltr title=concept-ltr>ltr</a>'.</p>

</dd>



<dt>If the element is a <a href=#root-element>root element</a> and the <code title=attr-dir><a href=#the-dir-attribute>dir</a></code> attribute is not in a defined state
(i.e. it is not present or has an invalid value)</dt>

<dd><p><a href=#the-directionality>The directionality</a> of the element is '<a href=#concept-ltr title=concept-ltr>ltr</a>'.</dd>


<dt>If the element has a parent element and the <code title=attr-dir><a href=#the-dir-attribute>dir</a></code> attribute is not in a defined state
(i.e. it is not present or has an invalid value)</dt>

<dd><p><a href=#the-directionality>The directionality</a> of the element is the same
as the element's parent element's <a href=#the-directionality title="the
directionality">directionality</a>.</dd>


</dl><p>The effect of this attribute is primarily on the presentation
layer. For example, the rendering section in this specification
defines a mapping from this attribute to the CSS 'direction' and
'unicode-bidi' properties, and CSS defines rendering in terms of
those properties.</p>

<hr><dl class=domintro><dt><var title="">document</var> . <code title=dom-dir><a href=#dom-dir>dir</a></code> [ = <var title="">value</var> ]</dt>
<dd>
<p>Returns <a href=#the-html-element>the <code>html</code> element</a>'s <code title=attr-dir><a href=#the-dir-attribute>dir</a></code> attribute's value, if any.</p>
<p>Can be set, to either "<code title="">ltr</code>" or "<code title="">rtl</code>", to replace <a href=#the-html-element>the <code>html</code> element</a>'s <code title=attr-dir><a href=#the-dir-attribute>dir</a></code> attribute's value.</p>
<p>Can be set, to either "<code title="">ltr</code>", "<code title="">rtl</code>", or "<code title="">auto</code>" to replace <a href=#the-html-element>the <code>html</code> element</a>'s <code title=attr-dir><a href=#the-dir-attribute>dir</a></code> attribute's value.</p>
<p>If there is no <a href=#the-html-element title="the html element"><code>html</code> element</a>, returns the empty string and ignores new values.</p>
</dd>

Expand All @@ -9690,6 +9776,7 @@ <h5 id=the-dir-attribute><span class=secno>3.2.3.5 </span>The <dfn title=attr-di
by search engines).</p>



<h5 id=classes><span class=secno>3.2.3.6 </span>The <dfn title=attr-class><code>class</code></dfn> attribute</h5>

<p>Every <a href=#html-elements title="HTML elements">HTML element</a> may have a
Expand Down Expand Up @@ -19893,14 +19980,17 @@ <h4 id=the-bdi-element><span class=secno>4.6.22 </span>The <dfn><code>bdi</code>
<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>-->
<dd>Also, the <code title=attr-dir><a href=#the-dir-attribute>dir</a></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 -->
<p class=note>The <code title=attr-dir><a href=#the-dir-attribute>dir</a></code> global
attribute defaults to <code title=attr-dir-auto><a href=#attr-dir-auto>auto</a></code> on
this element (it never inherits from the parent element like with
other elements).</p>

<div class=impl>

Expand Down Expand Up @@ -51434,6 +51524,27 @@ <h4 id=pseudo-classes><span class=secno>4.14.2 </span>Pseudo-classes</h4>

</dd>


<dt><dfn id=selector-ltr title=selector-ltr><code>:ltr</code></dfn></dt>

<dd>

<p>The <code title=selector-ltr><a href=#selector-ltr>:ltr</a></code> pseudo-class must
match all elements whose <a href=#the-directionality title="the
directionality">directionality</a> is '<a href=#concept-ltr title=concept-ltr>ltr</a>'.</p>

</dd>

<dt><dfn id=selector-rtl title=selector-rtl><code>:rtl</code></dfn></dt>

<dd>

<p>The <code title=selector-rtl><a href=#selector-rtl>:rtl</a></code> pseudo-class must
match all elements whose <a href=#the-directionality title="the
directionality">directionality</a> is '<a href=#concept-rtl title=concept-rtl>rtl</a>'.</p>

</dd>

</dl><p class=note>Another section of this specification defines the
<i><a href=#target-element>target element</a></i> used with the <code title=selector-target>:target</code> pseudo-class.</p>

Expand Down Expand Up @@ -83413,15 +83524,6 @@ <h4 id=display-types><span class=secno>14.2.2 </span>Display types</h4>
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>

<p>The <code><a href=#the-br-element>br</a></code> element is expected to render as if its
contents were a single U+000A LINE FEED (LF) character and its
'white-space' property was 'pre'. User agents are expected to
support the 'clear' property on inline elements (in order to render
<code><a href=#the-br-element>br</a></code> elements with <code title=attr-br-clear><a href=#attr-br-clear>clear</a></code> attributes) in the manner
described in the non-normative note to this effect in CSS2.1.</p>
<!-- section 9.5.2 of CSS2.1 -->
<!-- br { content: '\A'; } /* waiting for 'content' to apply to elements */ -->

<p>The user agent is expected to hide <code><a href=#the-noscript-element>noscript</a></code> elements
for whom <a href=#concept-n-script title=concept-n-script>scripting is enabled</a>,
irrespective of CSS rules.</p>
Expand Down Expand Up @@ -83996,6 +84098,8 @@ <h4 id=punctuation-and-decorations><span class=secno>14.2.6 </span>Punctuation a
q:before { content: open-quote; }
q:after { content: close-quote; }

br { content: '\A'; white-space: pre; }

nobr { white-space: nowrap; }
listing, plaintext, pre, xmp { white-space: pre; }
textarea { white-space: pre-wrap; }
Expand Down Expand Up @@ -84035,16 +84139,21 @@ <h4 id=punctuation-and-decorations><span class=secno>14.2.6 </span>Punctuation a
table { border-style: outset; }
td, th { border-style: inset; }

output { unicode-bidi: isolate; }
:ltr { direction: ltr; }
:rtl { direction: rtl; }
[dir] { unicode-bidi: embed; }
bdo, bdo[dir] { unicode-bidi: bidi-override; }
bdi, output { unicode-bidi: isolate; }
textarea[dir=auto], pre[dir=auto] { unicode-bidi: plaintext; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */</pre>

[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> */
bdi { unicode-bidi: isolate; }</pre>
<p>Rules setting the 'quotes' property appropriately for the locales
and languages understood by the user are expected to be present.</p>

<p>In addition, rules setting the 'quotes' property appropriately
for the locales and languages understood by the user are expected to
be present.</p>
<p>User agents are expected to
support the 'clear' property on inline elements (in order to render
<code><a href=#the-br-element>br</a></code> elements with <code title=attr-br-clear><a href=#attr-br-clear>clear</a></code> attributes) in the manner
described in the non-normative note to this effect in CSS2.1.</p>
<!-- section 9.5.2 of CSS2.1 -->

<hr><p id=decohints>The following rules are also expected to apply, as
<a href=#presentational-hints>presentational hints</a>:</p>
Expand Down

0 comments on commit fd6901d

Please sign in to comment.