Skip to content

Commit 1f4f871

Browse files
committed
sketch cssvalue interfaces
1 parent 4153ad0 commit 1f4f871

2 files changed

Lines changed: 240 additions & 63 deletions

File tree

cssom/Overview.html

Lines changed: 133 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -8,8 +8,8 @@
88
pre.idl { border:solid thin; background:#eee; color:#000; padding:0.5em }
99
pre.idl :link, pre.idl :visited { color:inherit; background:transparent }
1010
dfn { font-weight:bold; font-style:normal }
11-
div.example { margin-left:1em; padding-left:1em; border-left:double; color:#222; background:#fcfcfc }
12-
div.example table code { color:inherit }
11+
.example { margin-left:1em; padding-left:1em; border-left:double; color:#222; background:#fcfcfc }
12+
.example table code { color:inherit }
1313
td, th { padding:.1em }
1414
.note { margin-left:2em; color:green; font-style:italic; font-weight:bold }
1515
p.note::before { content:"Note: " }
@@ -28,13 +28,13 @@
2828
<div class=head>
2929
<h1 id=cssom>CSSOM</h1>
3030

31-
<h2 class="no-num no-toc" id="">Editor's Draft 19 March 2010</h2>
31+
<h2 class="no-num no-toc" id="">Editor's Draft 24 March 2010</h2>
3232

3333
<dl>
3434
<dt>This Version:
3535

3636
<dd><a
37-
href="http://www.w3.org/TR/2010/ED-cssom-20100319/">http://www.w3.org/TR/2010/ED-cssom-20100319/</a>
37+
href="http://www.w3.org/TR/2010/ED-cssom-20100324/">http://www.w3.org/TR/2010/ED-cssom-20100324/</a>
3838

3939
<dt>Latest Version:
4040

@@ -220,6 +220,10 @@ <h2 class="no-num no-toc" id=toc>Table of Contents</h2>
220220
<li><a href="#the-cssstyledeclaration-interface"><span
221221
class=secno>5.5.1. </span>The <code
222222
title="">CSSStyleDeclaration</code> Interface</a>
223+
224+
<li><a href="#the-cssstyledeclarationvalue-interface"><span
225+
class=secno>5.5.2. </span>The <code
226+
title="">CSSStyleDeclarationValue</code> Interface</a>
223227
</ul>
224228

225229
<li><a href="#css-values"><span class=secno>5.6. </span>CSS Values</a>
@@ -233,6 +237,22 @@ <h2 class="no-num no-toc" id=toc>Table of Contents</h2>
233237
<li><a href="#examples0"><span class=secno>5.6.2.1.
234238
</span>Examples</a>
235239
</ul>
240+
241+
<li><a href="#the-cssvalue-interface"><span class=secno>5.6.3.
242+
</span>The <code title="">CSSValue</code> Interface</a>
243+
244+
<li><a href="#the-csscolorvalue-interface"><span class=secno>5.6.4.
245+
</span>The <code title="">CSSColorValue</code> Interface</a>
246+
247+
<li><a href="#the-csslengthvalue-interface"><span class=secno>5.6.5.
248+
</span>The <code title="">CSSLengthValue</code> Interface</a>
249+
250+
<li><a href="#the-csspercentagevalue-interface"><span
251+
class=secno>5.6.6. </span>The <code
252+
title="">CSSPercentageValue</code> Interface</a>
253+
254+
<li><a href="#the-cssurlvalue-interface"><span class=secno>5.6.7.
255+
</span>The <code title="">CSSURLValue</code> Interface</a>
236256
</ul>
237257
</ul>
238258

@@ -2405,13 +2425,18 @@ <h4 id=the-cssstyledeclaration-interface><span class=secno>5.5.1.
24052425
<pre
24062426
class=idl>interface <dfn id=cssstyledeclaration>CSSStyleDeclaration</dfn> {
24072427
attribute DOMString <a href="#dom-cssstyledeclaration-csstext" title=dom-CSSStyleDeclaration-cssText>cssText</a>;
2428+
2429+
readonly attribute unsigned long <a href="#dom-cssstyledeclaration-length" title=dom-CSSStyleDeclaration-length>length</a>;
2430+
DOMString <a href="#dom-cssstyledeclaration-item" title=dom-CSSStyleDeclaration-item>item</a>(unsigned long <var title="">index</var>);
2431+
24082432
DOMString <a href="#dom-cssstyledeclaration-getpropertyvalue" title=dom-CSSStyleDeclaration-getPropertyValue>getPropertyValue</a>(DOMString <var title="">property</var>);
24092433
DOMString <a href="#dom-cssstyledeclaration-getpropertypriority" title=dom-CSSStyleDeclaration-getPropertyPriority>getPropertyPriority</a>(DOMString <var title="">property</var>);
2410-
DOMString <a href="#dom-cssstyledeclaration-removeproperty" title=dom-CSSStyleDeclaration-removeProperty>removeProperty</a>(DOMString <var title="">property</var>);
24112434
void <a href="#dom-cssstyledeclaration-setproperty" title=dom-CSSStyleDeclaration-setProperty>setProperty</a>(DOMString? <var title="">property</var>, DOMString? <var title="">value</var>);
24122435
void <a href="#dom-cssstyledeclaration-setproperty" title=dom-CSSStyleDeclaration-setProperty>setProperty</a>(DOMString? <var title="">property</var>, DOMString? <var title="">value</var>, DOMString? <var title="">priority</var>);
2413-
readonly attribute unsigned long <a href="#dom-cssstyledeclaration-length" title=dom-CSSStyleDeclaration-length>length</a>;
2414-
DOMString <a href="#dom-cssstyledeclaration-item" title=dom-CSSStyleDeclaration-item>item</a>(unsigned long <var title="">index</var>);
2436+
DOMString <a href="#dom-cssstyledeclaration-removeproperty" title=dom-CSSStyleDeclaration-removeProperty>removeProperty</a>(DOMString <var title="">property</var>);
2437+
2438+
readonly attribute <a href="#cssstyledeclarationvalue">CSSStyleDeclarationValue</a> <a href="#dom-cssstyledeclaration-values" title=dom-CSSStyleDeclaration-values>values</a>;
2439+
24152440
readonly attribute <a href="#cssrule">CSSRule</a> <a href="#dom-cssstyledeclaration-parentrule" title=dom-CSSStyleDeclaration-parentRule>parentRule</a>;
24162441

24172442
// CSS Properties
@@ -2567,6 +2592,18 @@ <h4 id=the-cssstyledeclaration-interface><span class=secno>5.5.1.
25672592
href="#css-declaration-block-declarations">CSS declaration block
25682593
declarations</a>.
25692594
</ol>
2595+
<!-- XXX WebIDL work -->
2596+
2597+
<p>The <dfn id=dom-cssstyledeclaration-length
2598+
title=dom-CSSStyleDeclaration-length><code>length</code></dfn> attribute
2599+
<em class=ct>must</em> return the number of declarations in the
2600+
<span>collection of CSS declarations</span>.
2601+
2602+
<p>The <dfn id=dom-cssstyledeclaration-item
2603+
title=dom-CSSStyleDeclaration-item><code>item(<var
2604+
title="">index</var>)</code></dfn> method, when invoked, <span
2605+
class=XXX>...</span>.</p>
2606+
<!-- returns the name of property at position index. -->
25702607

25712608
<p>The <dfn id=dom-cssstyledeclaration-getpropertyvalue
25722609
title=dom-CSSStyleDeclaration-getPropertyValue><code>getPropertyValue(<var
@@ -2587,24 +2624,6 @@ <h4 id=the-cssstyledeclaration-interface><span class=secno>5.5.1.
25872624
<p class=example>E.g. for <code>background-color:lime !IMPORTANT</code> the
25882625
return value would be "<code title="">important</code>".
25892626

2590-
<p>When the <dfn id=dom-cssstyledeclaration-removeproperty
2591-
title=dom-CSSStyleDeclaration-removeProperty><code>removeProperty(<var
2592-
title="">property</var>)</code></dfn> method is invoked these steps <em
2593-
class=ct>must</em> be run:
2594-
2595-
<ol>
2596-
<li>
2597-
<p>If the <a href="#css-declaration-block-readonly-flag">CSS declaration
2598-
block readonly flag</a> is true raise a
2599-
<code>NO_MODIFICATION_ALLOWED_ERR</code> and terminate this algorithm.
2600-
2601-
<li>
2602-
<p>If <var title="">property</var> is an <a
2603-
href="#ascii-case-insensitive">ASCII case-insensitive</a> match for a
2604-
property of a declaration in the <span>collection of CSS
2605-
declarations</span> remove the declaration.</p>
2606-
</ol>
2607-
26082627
<p>When the <dfn id=dom-cssstyledeclaration-setproperty
26092628
title=dom-CSSStyleDeclaration-setProperty><code>setProperty(<var
26102629
title="">property</var>, <var title="">value</var>, <var
@@ -2651,18 +2670,28 @@ <h4 id=the-cssstyledeclaration-interface><span class=secno>5.5.1.
26512670
title="">priority</var> is not the empty string. Otherwise set <var
26522671
title="">property</var> to <var title="">value</var>.
26532672
</ol>
2654-
<!-- XXX WebIDL work -->
26552673

2656-
<p>The <dfn id=dom-cssstyledeclaration-length
2657-
title=dom-CSSStyleDeclaration-length><code>length</code></dfn> attribute
2658-
<em class=ct>must</em> return the number of declarations in the
2659-
<span>collection of CSS declarations</span>.
2674+
<p>When the <dfn id=dom-cssstyledeclaration-removeproperty
2675+
title=dom-CSSStyleDeclaration-removeProperty><code>removeProperty(<var
2676+
title="">property</var>)</code></dfn> method is invoked these steps <em
2677+
class=ct>must</em> be run:
26602678

2661-
<p>The <dfn id=dom-cssstyledeclaration-item
2662-
title=dom-CSSStyleDeclaration-item><code>item(<var
2663-
title="">index</var>)</code></dfn> method, when invoked, <span
2664-
class=XXX>...</span>.</p>
2665-
<!-- returns the name of property at position index. -->
2679+
<ol>
2680+
<li>
2681+
<p>If the <a href="#css-declaration-block-readonly-flag">CSS declaration
2682+
block readonly flag</a> is true raise a
2683+
<code>NO_MODIFICATION_ALLOWED_ERR</code> and terminate this algorithm.
2684+
2685+
<li>
2686+
<p>If <var title="">property</var> is an <a
2687+
href="#ascii-case-insensitive">ASCII case-insensitive</a> match for a
2688+
property of a declaration in the <span>collection of CSS
2689+
declarations</span> remove the declaration.</p>
2690+
</ol>
2691+
2692+
<p>The <dfn id=dom-cssstyledeclaration-values
2693+
title=dom-CSSStyleDeclaration-values><code>values</code></dfn> attribute
2694+
<em class=ct>must</em> return <span class=XXX>...</span>
26662695

26672696
<p>The <dfn id=dom-cssstyledeclaration-parentrule
26682697
title=dom-CSSStyleDeclaration-parentRule><code>parentRule</code></dfn>
@@ -3453,6 +3482,22 @@ <h4>CSS Properties</h4>
34533482
for instance.</p>
34543483
-->
34553484

3485+
<h4 id=the-cssstyledeclarationvalue-interface><span class=secno>5.5.2.
3486+
</span>The <code title="">CSSStyleDeclarationValue</code> Interface</h4>
3487+
3488+
<pre
3489+
class=idl>interface <dfn id=cssstyledeclarationvalue>CSSStyleDeclarationValue</dfn> {
3490+
<span class=XXX>// ...</span>
3491+
};</pre>
3492+
3493+
<p class=XXX>The rought idea is that this interface exposes the full list
3494+
of supported properties as well that each return a <code><a
3495+
href="#cssvalue">CSSValue</a></code> object. That object can implement
3496+
other objects depending on the property involved. E.g. for
3497+
'<code>width</code>' the object would implement <code><a
3498+
href="#csslengthvalue">CSSLengthValue</a></code> and <code><a
3499+
href="#csspercentagevalue">CSSPercentageValue</a></code>.
3500+
34563501
<h3 id=css-values><span class=secno>5.6. </span>CSS Values</h3>
34573502

34583503
<h4 id=parsing-css-values><span class=secno>5.6.1. </span>Parsing CSS
@@ -3771,6 +3816,59 @@ <h5 id=examples0><span class=secno>5.6.2.1. </span>Examples</h5>
37713816
<p class=XXX>Some of these need to be updated per the new rules.</p>
37723817
</div>
37733818

3819+
<h4 id=the-cssvalue-interface><span class=secno>5.6.3. </span>The <code
3820+
title="">CSSValue</code> Interface</h4>
3821+
3822+
<pre class=idl>interface <dfn id=cssvalue>CSSValue</dfn> {
3823+
readonly attribute DOMString <span title=dom-CSSValue-cssText>cssText</span>;
3824+
};</pre>
3825+
3826+
<p class=XXX>...
3827+
3828+
<h4 id=the-csscolorvalue-interface><span class=secno>5.6.4. </span>The
3829+
<code title="">CSSColorValue</code> Interface</h4>
3830+
3831+
<pre class=idl>interface <dfn id=csscolorvalue>CSSColorValue</dfn> {
3832+
attribute short <span title=dom-CSSColorValue-red>red</span>;
3833+
attribute short <span title=dom-CSSColorValue-green>green</span>;
3834+
attribute short <span title=dom-CSSColorValue-blue>blue</span>;
3835+
3836+
attribute float <span title=dom-CSSColorValue-alpha>alpha</span>;
3837+
};</pre>
3838+
3839+
<p class=XXX>...
3840+
3841+
<h4 id=the-csslengthvalue-interface><span class=secno>5.6.5. </span>The
3842+
<code title="">CSSLengthValue</code> Interface</h4>
3843+
3844+
<pre class=idl>interface <dfn id=csslengthvalue>CSSLengthValue</dfn> {
3845+
attribute float <span title=dom-CSSLengthValue-em>em</span>;
3846+
attribute float <span title=dom-CSSLengthValue-ex>ex</span>;
3847+
attribute float <span title=dom-CSSLengthValue-px>px</span>;
3848+
<span class=XXX>// figure out what to do with absolute lengths</span>
3849+
};</pre>
3850+
3851+
<p class=XXX>...
3852+
3853+
<h4 id=the-csspercentagevalue-interface><span class=secno>5.6.6. </span>The
3854+
<code title="">CSSPercentageValue</code> Interface</h4>
3855+
3856+
<pre
3857+
class=idl>interface <dfn id=csspercentagevalue>CSSPercentageValue</dfn> {
3858+
attribute float <span title=dom-CSSPercentageValue>percent</span>;
3859+
};</pre>
3860+
3861+
<p class=XXX>...
3862+
3863+
<h4 id=the-cssurlvalue-interface><span class=secno>5.6.7. </span>The <code
3864+
title="">CSSURLValue</code> Interface</h4>
3865+
3866+
<pre class=idl>interface <dfn id=cssurlvalue>CSSURLValue</dfn> {
3867+
attribute DOMString <span title=dom-CSSURLValue-url>url</span>;
3868+
};</pre>
3869+
3870+
<p class=XXX>...
3871+
37743872
<h2 id=dom-access-to-css-declaration-blocks><span class=secno>6. </span>DOM
37753873
Access to CSS Declaration Blocks</h2>
37763874

0 commit comments

Comments
 (0)