--- a/autoimplementation.html Fri Mar 25 16:08:52 2011 -0600
+++ b/autoimplementation.html Sun Mar 27 17:59:22 2011 -0600
@@ -128,8 +128,8 @@
<button onclick="runTests('subscript')">Run tests</button>
-<p><strong>Note:</strong> No spec has yet been written, so the spec column does
-nothing.
+<p><strong>Note:</strong> The subscript spec is still buggy and unstable, so
+don't pay much attention to what's in the spec column.
<table border=1><tr><th>Input <th>Spec <th>Browser <th>Same?</table>
<table border=1><tr><th>Input <th>Spec <th>Browser <th>Same?</table>
--- a/editcommands.html Fri Mar 25 16:08:52 2011 -0600
+++ b/editcommands.html Sun Mar 27 17:59:22 2011 -0600
@@ -27,7 +27,7 @@
<body class=draft>
<div class=head id=head>
<h1>HTML Editing Commands</h1>
-<h2 class="no-num no-toc" id=work-in-progress-—-last-update-25-march-2011>Work in Progress — Last Update 25 March 2011</h2>
+<h2 class="no-num no-toc" id=work-in-progress-—-last-update-27-march-2011>Work in Progress — Last Update 27 March 2011</h2>
<dl>
<dt>Editor
<dd>Aryeh Gregor <ayg+spec@aryeh.name>
@@ -236,7 +236,7 @@
<p>The <dfn id=effective-style>effective style</dfn> of a <a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#node><code class=external data-anolis-spec=domcore>Node</code></a> <var title="">node</var> for a given
<var title="">property</var> is returned by the following algorithm, which will return
-either a CSS value or null:
+either a string or null:
<ol>
<li>If <var title="">node</var> is neither an <a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#element><code class=external data-anolis-spec=domcore>Element</code></a> nor a <a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#text><code class=external data-anolis-spec=domcore>Text</code></a> node, return
@@ -248,14 +248,6 @@
<li>If <var title="">node</var> is a <a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#text><code class=external data-anolis-spec=domcore>Text</code></a> node, return the <a href=#effective-style>effective
style</a> of its <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-parent title=concept-tree-parent>parent</a> for <var title="">property</var>.
- <li>If <var title="">property</var> is "text-decoration", and the "text-decoration"
- property of <var title="">node</var> or any of its <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-ancestor title=concept-tree-ancestor>ancestors</a> computes to
- "underline", return "underline". Otherwise, return "none".
-
- <p class=XXX>We ignore the possibility of text-decorations other than
- underline for now, so we pretend that there are only two possible values:
- "underline" and "none".
-
<li>If <var title="">property</var> is "background-color":
<ol>
@@ -270,6 +262,49 @@
<var title="">node</var>.
</ol>
+ <li>If <var title="">property</var> is "text-decoration", and the "text-decoration"
+ property of <var title="">node</var> or any of its <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-ancestor title=concept-tree-ancestor>ancestors</a> computes to
+ "underline", return "underline". Otherwise, return "none".
+
+ <p class=XXX>We ignore the possibility of text-decorations other than
+ underline for now, so we pretend that there are only two possible values:
+ "underline" and "none".
+
+ <li>If <var title="">property</var> is "vertical-align":
+
+ <p class=XXX>We massively abuse this property. Maybe we shouldn't be using
+ the CSS names here.
+
+ <ol>
+ <li>Let <var title="">affected by subscript</var> and <var title="">affected by
+ superscript</var> be two boolean variables, both initially false.
+
+ <li>While <var title="">node</var> is an <a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#element><code class=external data-anolis-spec=domcore>Element</code></a> whose "display" property
+ computes to "inline":
+
+ <ol>
+ <li>If <var title="">node</var>'s "vertical-align" property computes to "sub", set
+ <var title="">affected by subscript</var> to true.
+
+ <li>Otherwise, if <var title="">node</var>'s "vertical-align" property computes to
+ "super", set <var title="">affected by superscript</var> to true.
+
+ <li>Otherwise, if <var title="">node</var>'s "vertical-align" property computes to
+ some value other than "baseline", return the string "mixed".
+
+ <li>Set <var title="">node</var> to its <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-parent title=concept-tree-parent>parent</a>.
+ </ol>
+
+ <li>If <var title="">affected by subscript</var> and <var title="">affected by
+ superscript</var> are both true, return the string "mixed".
+
+ <li>If <var title="">affected by subscript</var> is true, return "sub".
+
+ <li>If <var title="">affected by superscript</var> is true, return "super".
+
+ <li>Return "baseline".
+ </ol>
+
<li>Return the computed style of <var title="">property</var> for <var title="">node</var>.
</ol>
@@ -287,6 +322,23 @@
non-inline background-colors. Maybe the name "specified style" is
misleading, though. -->
+ <li>If <var title="">property</var> is "vertical-align":
+
+ <ol>
+ <li>If the computed value of the <a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#element><code class=external data-anolis-spec=domcore>Element</code></a>'s "display" property is
+ neither "inline" nor "inline-block" nor "inline-table", return null.
+
+ <li>If the <a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#element><code class=external data-anolis-spec=domcore>Element</code></a> has a <a href=http://www.whatwg.org/html/#the-style-attribute><code class=external data-anolis-spec=html title="the style attribute">style</code></a> attribute set, and that attribute
+ has the effect of setting "vertical-align", return the value that it sets
+ "vertical-align" to.
+
+ <li>If the <a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#element><code class=external data-anolis-spec=domcore>Element</code></a> is a <a href=http://www.whatwg.org/html/#the-sub-and-sup-elements><code class=external data-anolis-spec=html title="the sub and sup elements">sup</code></a>, return "super".
+
+ <li>If the <a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#element><code class=external data-anolis-spec=domcore>Element</code></a> is a <a href=http://www.whatwg.org/html/#the-sub-and-sup-elements><code class=external data-anolis-spec=html title="the sub and sup elements">sub</code></a>, return "sub".
+
+ <li>Return null.
+ </ol>
+
<li>If the <a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#element><code class=external data-anolis-spec=domcore>Element</code></a> has a <a href=http://www.whatwg.org/html/#the-style-attribute><code class=external data-anolis-spec=html title="the style attribute">style</code></a> attribute set, and that attribute has
the effect of setting <var title="">property</var>, return the value that it sets
<var title="">property</var> to.
@@ -317,9 +369,9 @@
</ol>
<p>A <dfn id=styling-element>styling element</dfn> is a <a href=http://www.whatwg.org/html/#the-b-element><code class=external data-anolis-spec=html title="the b element">b</code></a>, <a href=http://www.whatwg.org/html/#the-em-element><code class=external data-anolis-spec=html title="the em element">em</code></a>, <a href=http://www.whatwg.org/html/#the-i-element><code class=external data-anolis-spec=html title="the i element">i</code></a>, <a href=http://www.whatwg.org/html/#the-span-element><code class=external data-anolis-spec=html title="the span element">span</code></a>,
-<a href=http://www.whatwg.org/html/#the-strong-element><code class=external data-anolis-spec=html title="the strong element">strong</code></a>, or <a href=http://www.whatwg.org/html/#the-u-element><code class=external data-anolis-spec=html title="the u element">u</code></a> element with no attributes except possibly <a href=http://www.whatwg.org/html/#the-style-attribute><code class=external data-anolis-spec=html title="the style attribute">style</code></a>, or
-a <a href=http://www.whatwg.org/html/#font><code class=external data-anolis-spec=html title=font>font</code></a> element with no attributes except possibly <a href=http://www.whatwg.org/html/#the-style-attribute><code class=external data-anolis-spec=html title="the style attribute">style</code></a>, <a href=http://www.whatwg.org/html/#dom-font-color><code class=external data-anolis-spec=html title=dom-font-color>color</code></a>,
-<a href=http://www.whatwg.org/html/#dom-font-face><code class=external data-anolis-spec=html title=dom-font-face>face</code></a>, and/or <a href=http://www.whatwg.org/html/#dom-font-size><code class=external data-anolis-spec=html title=dom-font-size>size</code></a>.
+<a href=http://www.whatwg.org/html/#the-strong-element><code class=external data-anolis-spec=html title="the strong element">strong</code></a>, <a href=http://www.whatwg.org/html/#the-sub-and-sup-elements><code class=external data-anolis-spec=html title="the sub and sup elements">sub</code></a>, <a href=http://www.whatwg.org/html/#the-sub-and-sup-elements><code class=external data-anolis-spec=html title="the sub and sup elements">sup</code></a>, or <a href=http://www.whatwg.org/html/#the-u-element><code class=external data-anolis-spec=html title="the u element">u</code></a> element with no attributes except
+possibly <a href=http://www.whatwg.org/html/#the-style-attribute><code class=external data-anolis-spec=html title="the style attribute">style</code></a>, or a <a href=http://www.whatwg.org/html/#font><code class=external data-anolis-spec=html title=font>font</code></a> element with no attributes except possibly
+<a href=http://www.whatwg.org/html/#the-style-attribute><code class=external data-anolis-spec=html title="the style attribute">style</code></a>, <a href=http://www.whatwg.org/html/#dom-font-color><code class=external data-anolis-spec=html title=dom-font-color>color</code></a>, <a href=http://www.whatwg.org/html/#dom-font-face><code class=external data-anolis-spec=html title=dom-font-face>face</code></a>, and/or <a href=http://www.whatwg.org/html/#dom-font-size><code class=external data-anolis-spec=html title=dom-font-size>size</code></a>.
<p class=note>Conceptually, a <a href=#styling-element>styling element</a> is a phrasing
element whose only purpose is to style text. Thus changing around styling
@@ -332,13 +384,13 @@
<p>A <dfn id=simple-styling-element>simple styling element</dfn> is an <a href=#html-element>HTML element</a> for
which at least one of the following holds:
-<ol>
- <li>It is a <a href=http://www.whatwg.org/html/#the-b-element><code class=external data-anolis-spec=html title="the b element">b</code></a>, <a href=http://www.whatwg.org/html/#the-em-element><code class=external data-anolis-spec=html title="the em element">em</code></a>, <a href=http://www.whatwg.org/html/#font><code class=external data-anolis-spec=html title=font>font</code></a>, <a href=http://www.whatwg.org/html/#the-i-element><code class=external data-anolis-spec=html title="the i element">i</code></a>, <a href=http://www.whatwg.org/html/#the-span-element><code class=external data-anolis-spec=html title="the span element">span</code></a>, <a href=http://www.whatwg.org/html/#the-strong-element><code class=external data-anolis-spec=html title="the strong element">strong</code></a>, or <a href=http://www.whatwg.org/html/#the-u-element><code class=external data-anolis-spec=html title="the u element">u</code></a>
- element with no attributes.
+<ul>
+ <li>It is a <a href=http://www.whatwg.org/html/#the-b-element><code class=external data-anolis-spec=html title="the b element">b</code></a>, <a href=http://www.whatwg.org/html/#the-em-element><code class=external data-anolis-spec=html title="the em element">em</code></a>, <a href=http://www.whatwg.org/html/#font><code class=external data-anolis-spec=html title=font>font</code></a>, <a href=http://www.whatwg.org/html/#the-i-element><code class=external data-anolis-spec=html title="the i element">i</code></a>, <a href=http://www.whatwg.org/html/#the-span-element><code class=external data-anolis-spec=html title="the span element">span</code></a>, <a href=http://www.whatwg.org/html/#the-strong-element><code class=external data-anolis-spec=html title="the strong element">strong</code></a>, <a href=http://www.whatwg.org/html/#the-sub-and-sup-elements><code class=external data-anolis-spec=html title="the sub and sup elements">sub</code></a>,
+ <a href=http://www.whatwg.org/html/#the-sub-and-sup-elements><code class=external data-anolis-spec=html title="the sub and sup elements">sup</code></a>, or <a href=http://www.whatwg.org/html/#the-u-element><code class=external data-anolis-spec=html title="the u element">u</code></a> element with no attributes.
- <li>It is a <a href=http://www.whatwg.org/html/#the-b-element><code class=external data-anolis-spec=html title="the b element">b</code></a>, <a href=http://www.whatwg.org/html/#the-em-element><code class=external data-anolis-spec=html title="the em element">em</code></a>, <a href=http://www.whatwg.org/html/#font><code class=external data-anolis-spec=html title=font>font</code></a>, <a href=http://www.whatwg.org/html/#the-i-element><code class=external data-anolis-spec=html title="the i element">i</code></a>, <a href=http://www.whatwg.org/html/#the-span-element><code class=external data-anolis-spec=html title="the span element">span</code></a>, <a href=http://www.whatwg.org/html/#the-strong-element><code class=external data-anolis-spec=html title="the strong element">strong</code></a>, or <a href=http://www.whatwg.org/html/#the-u-element><code class=external data-anolis-spec=html title="the u element">u</code></a>
- element with exactly one attribute, which is <a href=http://www.whatwg.org/html/#the-style-attribute><code class=external data-anolis-spec=html title="the style attribute">style</code></a>, which sets no CSS
- properties (including invalid or unrecognized properties).
+ <li>It is a <a href=http://www.whatwg.org/html/#the-b-element><code class=external data-anolis-spec=html title="the b element">b</code></a>, <a href=http://www.whatwg.org/html/#the-em-element><code class=external data-anolis-spec=html title="the em element">em</code></a>, <a href=http://www.whatwg.org/html/#font><code class=external data-anolis-spec=html title=font>font</code></a>, <a href=http://www.whatwg.org/html/#the-i-element><code class=external data-anolis-spec=html title="the i element">i</code></a>, <a href=http://www.whatwg.org/html/#the-span-element><code class=external data-anolis-spec=html title="the span element">span</code></a>, <a href=http://www.whatwg.org/html/#the-strong-element><code class=external data-anolis-spec=html title="the strong element">strong</code></a>, <a href=http://www.whatwg.org/html/#the-sub-and-sup-elements><code class=external data-anolis-spec=html title="the sub and sup elements">sub</code></a>,
+ <a href=http://www.whatwg.org/html/#the-sub-and-sup-elements><code class=external data-anolis-spec=html title="the sub and sup elements">sup</code></a>, or <a href=http://www.whatwg.org/html/#the-u-element><code class=external data-anolis-spec=html title="the u element">u</code></a> element with exactly one attribute, which is <a href=http://www.whatwg.org/html/#the-style-attribute><code class=external data-anolis-spec=html title="the style attribute">style</code></a>,
+ which sets no CSS properties (including invalid or unrecognized properties).
<li>It is a <a href=http://www.whatwg.org/html/#font><code class=external data-anolis-spec=html title=font>font</code></a> element with exactly one attribute, which is either
<a href=http://www.whatwg.org/html/#dom-font-color><code class=external data-anolis-spec=html title=dom-font-color>color</code></a>, <a href=http://www.whatwg.org/html/#dom-font-face><code class=external data-anolis-spec=html title=dom-font-face>face</code></a>, or <a href=http://www.whatwg.org/html/#dom-font-size><code class=external data-anolis-spec=html title=dom-font-size>size</code></a>.
@@ -356,10 +408,14 @@
unrecognized properties), which is "text-decoration", which is set to
"underline" or "none".
+ <li>It is a <a href=http://www.whatwg.org/html/#the-sub-and-sup-elements><code class=external data-anolis-spec=html title="the sub and sup elements">sub</code></a> or <a href=http://www.whatwg.org/html/#the-sub-and-sup-elements><code class=external data-anolis-spec=html title="the sub and sup elements">sub</code></a> element with exactly one attribute, which is
+ <a href=http://www.whatwg.org/html/#the-style-attribute><code class=external data-anolis-spec=html title="the style attribute">style</code></a>, and the <a href=http://www.whatwg.org/html/#the-style-attribute><code class=external data-anolis-spec=html title="the style attribute">style</code></a> attribute sets exactly one CSS property
+ (including invalid or unrecognized properties), which is "vertical-align".
+
<li>It is a <a href=http://www.whatwg.org/html/#font><code class=external data-anolis-spec=html title=font>font</code></a> or <a href=http://www.whatwg.org/html/#the-span-element><code class=external data-anolis-spec=html title="the span element">span</code></a> element with exactly one attribute, which is
<a href=http://www.whatwg.org/html/#the-style-attribute><code class=external data-anolis-spec=html title="the style attribute">style</code></a>, and the <a href=http://www.whatwg.org/html/#the-style-attribute><code class=external data-anolis-spec=html title="the style attribute">style</code></a> attribute sets exactly one CSS property
(including invalid or unrecognized properties).
-</ol>
+</ul>
<p class=note>Conceptually, a <a href=#simple-styling-element>simple styling element</a> is a
<a href=#styling-element>styling element</a> which <a href=#specified-style title="specified
@@ -828,6 +884,18 @@
of <var title="">new parent</var> to <var title="">new value</var>.
</ol>
+ <!-- We always use sup/sub elements, even in CSS mode, following Gecko and
+ contradicting WebKit. This is because <span style="vertical-align:
+ sub/super">, the obvious equivalent (and what WebKit uses), behaves quite
+ differently: it doesn't reduce font-size, which is ugly. -->
+ <li>If <var title="">property</var> is "vertical-align" and <var title="">new value</var> is
+ "sub", let <var title="">new parent</var> be the result of calling <a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-document-createelement><code class=external data-anolis-spec=domcore title=dom-Document-createElement>createElement("sub")</code></a> on the
+ <a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-node-ownerdocument><code class=external data-anolis-spec=domcore title=dom-Node-ownerDocument>ownerDocument</code></a> of <var title="">node</var>.
+
+ <li>If <var title="">property</var> is "vertical-align" and <var title="">new value</var> is
+ "super", let <var title="">new parent</var> be the result of calling <a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-document-createelement><code class=external data-anolis-spec=domcore title=dom-Document-createElement>createElement("sup")</code></a> on the
+ <a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-node-ownerdocument><code class=external data-anolis-spec=domcore title=dom-Node-ownerDocument>ownerDocument</code></a> of <var title="">node</var>.
+
<li>If <var title="">new parent</var> is null, let <var title="">new parent</var> be the result
of calling <a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-document-createelement><code class=external data-anolis-spec=domcore title=dom-Document-createElement>createElement("span")</code></a> on the
<a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-node-ownerdocument><code class=external data-anolis-spec=domcore title=dom-Node-ownerDocument>ownerDocument</code></a> of <var title="">node</var>.
@@ -1370,6 +1438,42 @@
<dd><strong>Value</strong>:
+<dt><code title=""><dfn id=command-subscript title=command-subscript>subscript</dfn></code>
+
+<dd><strong>Action</strong>: <a href=#decompose>Decompose</a> the <a href=http://html5.org/specs/dom-range.html#range><code class=external data-anolis-spec=domrange>Range</code></a>. If the
+state of the <a href=http://html5.org/specs/dom-range.html#range><code class=external data-anolis-spec=domrange>Range</code></a> for this command is then true, <a href=#style>style</a> each
+returned <a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#node><code class=external data-anolis-spec=domcore>Node</code></a> with <var title="">property</var> "vertical-align" and <var title="">new
+value</var> "baseline". Otherwise, <a href=#style>style</a> them with <var title="">new
+value</var> "baseline", then <a href=#style>style</a> them again with <var title="">new
+value</var> "sub".
+
+<p class=XXX>This doesn't work, because we'll have removed some of the things
+that we want to style in some cases. Need to define what happens to a range
+when you style its nodes, then re-decompose the same range before re-styling.
+
+<dd><strong>State</strong>: True if every <a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#text><code class=external data-anolis-spec=domcore>Text</code></a> node that is
+<a href=#effectively-contained>effectively contained</a> in the <a href=http://html5.org/specs/dom-range.html#range><code class=external data-anolis-spec=domrange>Range</code></a> has <a href=#effective-style>effective
+style</a> either null or "sub" for "vertical-align". Otherwise false.
+
+<dd><strong>Value</strong>:
+
+
+<dt><code title=""><dfn id=command-superscript title=command-superscript>superscript</dfn></code>
+
+<dd><strong>Action</strong>: <a href=#decompose>Decompose</a> the <a href=http://html5.org/specs/dom-range.html#range><code class=external data-anolis-spec=domrange>Range</code></a>. If the
+state of the <a href=http://html5.org/specs/dom-range.html#range><code class=external data-anolis-spec=domrange>Range</code></a> for this command is then true, <a href=#style>style</a> each
+returned <a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#node><code class=external data-anolis-spec=domcore>Node</code></a> with <var title="">property</var> "vertical-align" and <var title="">new
+value</var> "baseline". Otherwise, <a href=#style>style</a> them with <var title="">new
+value</var> "baseline", then <a href=#style>style</a> them again with <var title="">new
+value</var> "super".
+
+<dd><strong>State</strong>: True if every <a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#text><code class=external data-anolis-spec=domcore>Text</code></a> node that is
+<a href=#effectively-contained>effectively contained</a> in the <a href=http://html5.org/specs/dom-range.html#range><code class=external data-anolis-spec=domrange>Range</code></a> has <a href=#effective-style>effective
+style</a> either null or "super" for "vertical-align". Otherwise false.
+
+<dd><strong>Value</strong>:
+
+
<dt><code title=""><dfn id=command-underline title=command-underline>underline</dfn></code>
<dd><strong>Action</strong>: <a href=#decompose>Decompose</a> the <a href=http://html5.org/specs/dom-range.html#range><code class=external data-anolis-spec=domrange>Range</code></a>. If the
--- a/implementation.js Fri Mar 25 16:08:52 2011 -0600
+++ b/implementation.js Sun Mar 27 17:59:22 2011 -0600
@@ -58,6 +58,13 @@
return val1 === val2;
}
+ if (property == "verticalAlign") {
+ // Fake property values
+ if (val1 == "mixed" || val2 == "mixed") {
+ return val1 === val2;
+ }
+ }
+
if (property == "fontWeight") {
return val1 == val2
|| (val1.toLowerCase() == "bold" && val2 == "700")
@@ -314,19 +321,6 @@
return getEffectiveStyle(node.parentNode, property);
}
- // "If property is "text-decoration", and the "text-decoration" property of
- // node or any of its ancestors computes to "underline", return
- // "underline". Otherwise, return "none"."
- if (property == "textDecoration") {
- do {
- if (getComputedStyle(node).textDecoration == "underline") {
- return "underline";
- }
- node = node.parentNode;
- } while (node && node.nodeType == Node.ELEMENT_NODE);
- return "none";
- }
-
// "If property is "background-color":"
if (property == "backgroundColor") {
// "While the computed style of "background-color" on node is any
@@ -355,6 +349,71 @@
return getComputedStyle(node).backgroundColor;
}
+ // "If property is "text-decoration", and the "text-decoration" property of
+ // node or any of its ancestors computes to "underline", return
+ // "underline". Otherwise, return "none"."
+ if (property == "textDecoration") {
+ do {
+ if (getComputedStyle(node).textDecoration == "underline") {
+ return "underline";
+ }
+ node = node.parentNode;
+ } while (node && node.nodeType == Node.ELEMENT_NODE);
+ return "none";
+ }
+
+ // "If property is "vertical-align":"
+ if (property == "verticalAlign") {
+ // "Let affected by subscript and affected by superscript be two
+ // boolean variables, both initially false."
+ var affectedBySubscript = false;
+ var affectedBySuperscript = false;
+
+ // "While node is an Element whose "display" property computes to
+ // "inline":"
+ while (node
+ && node.nodeType == Node.ELEMENT_NODE
+ && getComputedStyle(node).display == "inline") {
+ var verticalAlign = getComputedStyle(node).verticalAlign;
+
+ // "If node's "vertical-align" property computes to "sub", set
+ // affected by subscript to true."
+ if (verticalAlign == "sub") {
+ affectedBySubscript = true;
+ // "Otherwise, if node's "vertical-align" property computes to
+ // "super", set affected by superscript to true."
+ } else if (verticalAlign == "super") {
+ affectedBySuperscript = true;
+ // "Otherwise, if node's "vertical-align" property computes to some
+ // value other than "baseline", return the string "mixed"."
+ } else if (verticalAlign != "baseline") {
+ return "mixed";
+ }
+
+ // "Set node to its parent."
+ node = node.parentNode;
+ }
+
+ // "If affected by subscript and affected by superscript are both true,
+ // return the string "mixed"."
+ if (affectedBySubscript && affectedBySuperscript) {
+ return "mixed";
+ }
+
+ // "If affected by subscript is true, return "sub"."
+ if (affectedBySubscript) {
+ return "sub";
+ }
+
+ // "If affected by superscript is true, return "super"."
+ if (affectedBySuperscript) {
+ return "super";
+ }
+
+ // "Return "baseline"."
+ return "baseline";
+ }
+
// "Return the computed style of property for node."
return getComputedStyle(node)[property];
}
@@ -370,6 +429,39 @@
return null;
}
+ // "If property is "vertical-align":"
+ if (property == "verticalAlign") {
+ // "If the computed value of the Element's "display" property is
+ // neither "inline" nor "inline-block" nor "inline-table", return
+ // null."
+ var style = getComputedStyle(element);
+ if (style.display != "inline"
+ && style.display != "inline-block"
+ && style.display != "inline-table") {
+ return null;
+ }
+
+ // "If the Element has a style attribute set, and that attribute has
+ // the effect of setting "vertical-align", return the value that it
+ // sets "vertical-align" to."
+ if (element.style.verticalAlign != "") {
+ return element.style.verticalAlign;
+ }
+
+ // "If the Element is a sup, return "super"."
+ if (isHtmlElement(element) && element.tagName == "SUP") {
+ return "super";
+ }
+
+ // "If the Element is a sub, return "sub"."
+ if (isHtmlElement(element) && element.tagName == "SUB") {
+ return "sub";
+ }
+
+ // "Return null."
+ return null;
+ }
+
// "If the Element has a style attribute set, and that attribute has the
// effect of setting property, return the value that it sets property to."
if (element.style[property] != "") {
@@ -416,15 +508,15 @@
return null;
}
-// "A styling element is a b, em, i, span, strong, or u element with no
-// attributes except possibly style, or a font element with no attributes
+// "A styling element is a b, em, i, span, strong, sub, sup, or u element with
+// no attributes except possibly style, or a font element with no attributes
// except possibly style, color, face, and/or size."
function isStylingElement(node) {
if (!isHtmlElement(node)) {
return false;
}
- if (["B", "EM", "I", "SPAN", "STRONG", "U"].indexOf(node.tagName) != -1) {
+ if (["B", "EM", "I", "SPAN", "STRONG", "SUB", "SUP", "U"].indexOf(node.tagName) != -1) {
if (node.attributes.length == 0) {
return true;
}
@@ -470,11 +562,12 @@
}
// Only these elements can possibly be a simple styling element.
- if (["B", "EM", "FONT", "I", "SPAN", "STRONG", "U"].indexOf(node.tagName) == -1) {
+ if (["B", "EM", "FONT", "I", "SPAN", "STRONG", "SUB", "SUP", "U"].indexOf(node.tagName) == -1) {
return false;
}
- // "It is a b, em, font, i, span, strong, or u element with no attributes."
+ // "It is a b, em, font, i, span, strong, sub, sup, or u element with no
+ // attributes."
if (node.attributes.length == 0) {
return true;
}
@@ -484,9 +577,9 @@
return false;
}
- // "It is a b, em, font, i, span, strong, or u element with exactly one
- // attribute, which is style, which sets no CSS properties (including
- // invalid or unrecognized properties)."
+ // "It is a b, em, font, i, span, strong, sub, sup, or u element with
+ // exactly one attribute, which is style, which sets no CSS properties
+ // (including invalid or unrecognized properties)."
//
// Not gonna try for invalid or unrecognized.
if (node.hasAttribute("style")
@@ -531,7 +624,18 @@
if (node.tagName == "U"
&& node.hasAttribute("style")
&& node.style.length == 1
- && node.style.textDecoration != "") {
+ && (node.style.textDecoration == "underline"
+ || node.style.textDecoration == "none")) {
+ return true;
+ }
+
+ // "It is a sub or sub element with exactly one attribute, which is style,
+ // and the style attribute sets exactly one CSS property (including invalid
+ // or unrecognized properties), which is "vertical-align"."
+ if ((node.tagName == "SUB" || node.tagName == "SUP")
+ && node.hasAttribute("style")
+ && node.style.length == 1
+ && node.style.verticalAlign != "") {
return true;
}
@@ -1061,6 +1165,20 @@
}
}
+ // "If property is "vertical-align" and new value is "sub", let new parent
+ // be the result of calling createElement("sub") on the ownerDocument of
+ // node."
+ if (property == "verticalAlign" && newValue == "sub") {
+ newParent = node.ownerDocument.createElement("sub");
+ }
+
+ // "If property is "vertical-align" and new value is "super", let new
+ // parent be the result of calling createElement("sup") on the
+ // ownerDocument of node."
+ if (property == "verticalAlign" && newValue == "super") {
+ newParent = node.ownerDocument.createElement("sup");
+ }
+
// "If new parent is null, let new parent be the result of calling
// createElement("span") on the ownerDocument of node."
if (!newParent) {
@@ -1343,6 +1461,46 @@
cssStylingFlag = Boolean(value);
break;
+ case "subscript":
+ // "Decompose the Range. If the state of the Range for this command is
+ // then true, style each returned Node with property "vertical-align"
+ // and new value "baseline". Otherwise, style them with new value
+ // "baseline", then style them again with new value "sub"."
+ var nodeList = decomposeRange(range);
+ if (getState(commandId, range)) {
+ for (var i = 0; i < nodeList.length; i++) {
+ styleNode(nodeList[i], "verticalAlign", "baseline");
+ }
+ } else {
+ for (var i = 0; i < nodeList.length; i++) {
+ styleNode(nodeList[i], "verticalAlign", "baseline");
+ }
+ for (var i = 0; i < nodeList.length; i++) {
+ styleNode(nodeList[i], "verticalAlign", "sub");
+ }
+ }
+ break;
+
+ case "superscript":
+ // "Decompose the Range. If the state of the Range for this command is
+ // then true, style each returned Node with property "vertical-align"
+ // and new value "baseline". Otherwise, style them with new value
+ // "baseline", then style them again with new value "super"."
+ var nodeList = decomposeRange(range);
+ if (getState(commandId, range)) {
+ for (var i = 0; i < nodeList.length; i++) {
+ styleNode(nodeList[i], "verticalAlign", "baseline");
+ }
+ } else {
+ for (var i = 0; i < nodeList.length; i++) {
+ styleNode(nodeList[i], "verticalAlign", "baseline");
+ }
+ for (var i = 0; i < nodeList.length; i++) {
+ styleNode(nodeList[i], "verticalAlign", "super");
+ }
+ }
+ break;
+
case "underline":
// "Decompose the Range. If the state of the Range for this command is
// then true, style each returned Node with property "text-decoration"
@@ -1384,7 +1542,9 @@
if (commandId != "bold"
&& commandId != "italic"
- && commandId != "underline") {
+ && commandId != "underline"
+ && commandId != "subscript"
+ && commandId != "superscript") {
return false;
}
@@ -1435,6 +1595,22 @@
if (decoration !== null && decoration !== "underline") {
return false;
}
+ } else if (commandId == "subscript") {
+ // "True if every Text node that is effectively contained in the
+ // Range has effective style either null or "sub" for
+ // "vertical-align". Otherwise false."
+ var verticalAlign = getEffectiveStyle(node, "verticalAlign");
+ if (verticalAlign !== null && verticalAlign !== "sub") {
+ return false;
+ }
+ } else if (commandId == "superscript") {
+ // "True if every Text node that is effectively contained in the
+ // Range has effective style either null or "super" for
+ // "vertical-align". Otherwise false."
+ var verticalAlign = getEffectiveStyle(node, "verticalAlign");
+ if (verticalAlign !== null && verticalAlign !== "super") {
+ return false;
+ }
}
}
--- a/preprocess Fri Mar 25 16:08:52 2011 -0600
+++ b/preprocess Sun Mar 27 17:59:22 2011 -0600
@@ -53,6 +53,8 @@
'span': '<code data-anolis-spec=html title="the span element">span</code>',
'strong': '<code data-anolis-spec=html title="the strong element">strong</code>',
'style': '<code data-anolis-spec=html title="the style attribute">style</code>',
+ 'sub': '<code data-anolis-spec=html title="the sub and sup elements">sub</code>',
+ 'sup': '<code data-anolis-spec=html title="the sub and sup elements">sup</code>',
'text': '<code data-anolis-spec=domcore>Text</code>',
'treeorder': '<span data-anolis-spec=domcore>tree order</span>',
'u': '<code data-anolis-spec=html title="the u element">u</code>',
--- a/source.html Fri Mar 25 16:08:52 2011 -0600
+++ b/source.html Sun Mar 27 17:59:22 2011 -0600
@@ -226,7 +226,7 @@
<p>The <dfn>effective style</dfn> of a [[node]] <var>node</var> for a given
<var>property</var> is returned by the following algorithm, which will return
-either a CSS value or null:
+either a string or null:
<ol>
<li>If <var>node</var> is neither an [[element]] nor a [[text]] node, return
@@ -238,14 +238,6 @@
<li>If <var>node</var> is a [[text]] node, return the <span>effective
style</span> of its [[parent]] for <var>property</var>.
- <li>If <var>property</var> is "text-decoration", and the "text-decoration"
- property of <var>node</var> or any of its [[ancestors]] computes to
- "underline", return "underline". Otherwise, return "none".
-
- <p class=XXX>We ignore the possibility of text-decorations other than
- underline for now, so we pretend that there are only two possible values:
- "underline" and "none".
-
<li>If <var>property</var> is "background-color":
<ol>
@@ -260,6 +252,49 @@
<var>node</var>.
</ol>
+ <li>If <var>property</var> is "text-decoration", and the "text-decoration"
+ property of <var>node</var> or any of its [[ancestors]] computes to
+ "underline", return "underline". Otherwise, return "none".
+
+ <p class=XXX>We ignore the possibility of text-decorations other than
+ underline for now, so we pretend that there are only two possible values:
+ "underline" and "none".
+
+ <li>If <var>property</var> is "vertical-align":
+
+ <p class=XXX>We massively abuse this property. Maybe we shouldn't be using
+ the CSS names here.
+
+ <ol>
+ <li>Let <var>affected by subscript</var> and <var>affected by
+ superscript</var> be two boolean variables, both initially false.
+
+ <li>While <var>node</var> is an [[element]] whose "display" property
+ computes to "inline":
+
+ <ol>
+ <li>If <var>node</var>'s "vertical-align" property computes to "sub", set
+ <var>affected by subscript</var> to true.
+
+ <li>Otherwise, if <var>node</var>'s "vertical-align" property computes to
+ "super", set <var>affected by superscript</var> to true.
+
+ <li>Otherwise, if <var>node</var>'s "vertical-align" property computes to
+ some value other than "baseline", return the string "mixed".
+
+ <li>Set <var>node</var> to its [[parent]].
+ </ol>
+
+ <li>If <var>affected by subscript</var> and <var>affected by
+ superscript</var> are both true, return the string "mixed".
+
+ <li>If <var>affected by subscript</var> is true, return "sub".
+
+ <li>If <var>affected by superscript</var> is true, return "super".
+
+ <li>Return "baseline".
+ </ol>
+
<li>Return the computed style of <var>property</var> for <var>node</var>.
</ol>
@@ -277,6 +312,23 @@
non-inline background-colors. Maybe the name "specified style" is
misleading, though. -->
+ <li>If <var>property</var> is "vertical-align":
+
+ <ol>
+ <li>If the computed value of the [[element]]'s "display" property is
+ neither "inline" nor "inline-block" nor "inline-table", return null.
+
+ <li>If the [[element]] has a [[style]] attribute set, and that attribute
+ has the effect of setting "vertical-align", return the value that it sets
+ "vertical-align" to.
+
+ <li>If the [[element]] is a [[sup]], return "super".
+
+ <li>If the [[element]] is a [[sub]], return "sub".
+
+ <li>Return null.
+ </ol>
+
<li>If the [[element]] has a <code data-anolis-spec=html
title="the style attribute">style</code> attribute set, and that attribute has
the effect of setting <var>property</var>, return the value that it sets
@@ -308,9 +360,9 @@
</ol>
<p>A <dfn>styling element</dfn> is a [[b]], [[em]], [[i]], [[span]],
-[[strong]], or [[u]] element with no attributes except possibly [[style]], or
-a [[font]] element with no attributes except possibly [[style]], [[fontcolor]],
-[[fontface]], and/or [[fontsize]].
+[[strong]], [[sub]], [[sup]], or [[u]] element with no attributes except
+possibly [[style]], or a [[font]] element with no attributes except possibly
+[[style]], [[fontcolor]], [[fontface]], and/or [[fontsize]].
<p class=note>Conceptually, a <span>styling element</span> is a phrasing
element whose only purpose is to style text. Thus changing around styling
@@ -323,13 +375,13 @@
<p>A <dfn>simple styling element</dfn> is an <span>HTML element</span> for
which at least one of the following holds:
-<ol>
- <li>It is a [[b]], [[em]], [[font]], [[i]], [[span]], [[strong]], or [[u]]
- element with no attributes.
+<ul>
+ <li>It is a [[b]], [[em]], [[font]], [[i]], [[span]], [[strong]], [[sub]],
+ [[sup]], or [[u]] element with no attributes.
- <li>It is a [[b]], [[em]], [[font]], [[i]], [[span]], [[strong]], or [[u]]
- element with exactly one attribute, which is [[style]], which sets no CSS
- properties (including invalid or unrecognized properties).
+ <li>It is a [[b]], [[em]], [[font]], [[i]], [[span]], [[strong]], [[sub]],
+ [[sup]], or [[u]] element with exactly one attribute, which is [[style]],
+ which sets no CSS properties (including invalid or unrecognized properties).
<li>It is a [[font]] element with exactly one attribute, which is either
[[fontcolor]], [[fontface]], or [[fontsize]].
@@ -347,10 +399,14 @@
unrecognized properties), which is "text-decoration", which is set to
"underline" or "none".
+ <li>It is a [[sub]] or [[sub]] element with exactly one attribute, which is
+ [[style]], and the [[style]] attribute sets exactly one CSS property
+ (including invalid or unrecognized properties), which is "vertical-align".
+
<li>It is a [[font]] or [[span]] element with exactly one attribute, which is
[[style]], and the [[style]] attribute sets exactly one CSS property
(including invalid or unrecognized properties).
-</ol>
+</ul>
<p class=note>Conceptually, a <span>simple styling element</span> is a
<span>styling element</span> which <span title="specified
@@ -833,6 +889,22 @@
of <var>new parent</var> to <var>new value</var>.
</ol>
+ <!-- We always use sup/sub elements, even in CSS mode, following Gecko and
+ contradicting WebKit. This is because <span style="vertical-align:
+ sub/super">, the obvious equivalent (and what WebKit uses), behaves quite
+ differently: it doesn't reduce font-size, which is ugly. -->
+ <li>If <var>property</var> is "vertical-align" and <var>new value</var> is
+ "sub", let <var>new parent</var> be the result of calling <code
+ data-anolis-spec=domcore
+ title=dom-Document-createElement>createElement("sub")</code> on the
+ [[ownerdocument]] of <var>node</var>.
+
+ <li>If <var>property</var> is "vertical-align" and <var>new value</var> is
+ "super", let <var>new parent</var> be the result of calling <code
+ data-anolis-spec=domcore
+ title=dom-Document-createElement>createElement("sup")</code> on the
+ [[ownerdocument]] of <var>node</var>.
+
<li>If <var>new parent</var> is null, let <var>new parent</var> be the result
of calling <code data-anolis-spec=domcore
title=dom-Document-createElement>createElement("span")</code> on the
@@ -1390,6 +1462,42 @@
<dd><strong>Value</strong>:
+<dt><code title><dfn title=command-subscript>subscript</dfn></code>
+
+<dd><strong>Action</strong>: <span>Decompose</span> the [[range]]. If the
+state of the [[range]] for this command is then true, <span>style</span> each
+returned [[node]] with <var>property</var> "vertical-align" and <var>new
+value</var> "baseline". Otherwise, <span>style</span> them with <var>new
+value</var> "baseline", then <span>style</span> them again with <var>new
+value</var> "sub".
+
+<p class=XXX>This doesn't work, because we'll have removed some of the things
+that we want to style in some cases. Need to define what happens to a range
+when you style its nodes, then re-decompose the same range before re-styling.
+
+<dd><strong>State</strong>: True if every [[text]] node that is
+<span>effectively contained</span> in the [[range]] has <span>effective
+style</span> either null or "sub" for "vertical-align". Otherwise false.
+
+<dd><strong>Value</strong>:
+
+
+<dt><code title><dfn title=command-superscript>superscript</dfn></code>
+
+<dd><strong>Action</strong>: <span>Decompose</span> the [[range]]. If the
+state of the [[range]] for this command is then true, <span>style</span> each
+returned [[node]] with <var>property</var> "vertical-align" and <var>new
+value</var> "baseline". Otherwise, <span>style</span> them with <var>new
+value</var> "baseline", then <span>style</span> them again with <var>new
+value</var> "super".
+
+<dd><strong>State</strong>: True if every [[text]] node that is
+<span>effectively contained</span> in the [[range]] has <span>effective
+style</span> either null or "super" for "vertical-align". Otherwise false.
+
+<dd><strong>Value</strong>:
+
+
<dt><code title><dfn title=command-underline>underline</dfn></code>
<dd><strong>Action</strong>: <span>Decompose</span> the [[range]]. If the