- From: SVG Working Group repository <cam@mcc.id.au>
- Date: Tue, 21 Aug 2012 00:32:53 -0700
- To: public-svg-wg@w3.org
details: https://svgwg.org/hg/svg2/rev/08ec4a483a84
branches:
changeset: 336:08ec4a483a84
user: Cameron McCormack <cam@mcc.id.au>
date: Tue Aug 21 17:28:12 2012 +1000
description:
Experiment with element summary box formatting for 'svg' and 'rect'.
diffstat:
master/definitions.xml | 1 -
master/intro.html | 18 +-----
master/shapes.html | 54 ++++++++++++++++++++++
master/struct.html | 104 +++++++++++++++++++++++++++++++++++++++++++
master/style/default_svg.css | 5 ++
5 files changed, 167 insertions(+), 15 deletions(-)
diffs (291 lines):
diff --git a/master/definitions.xml b/master/definitions.xml
--- a/master/definitions.xml
+++ b/master/definitions.xml
@@ -760,17 +760,16 @@
href='fonts.html#VKernElement'
attributecategories='core'
attributes='u1, g1, u2, g2, k'
interfaces='SVGVKernElement'/>
<!-- ... element categories ............................................ -->
<elementcategory name='animation' href='intro.html#TermAnimationElement' elements='animate, animateColor, animateMotion, animateTransform, set'/>
- <elementcategory name='basic shape' href='intro.html#TermBasicShapeElement' elements='circle, ellipse, line, polygon, polyline, rect'/>
<elementcategory name='container' href='intro.html#TermContainerElement' elements='svg, g, defs, symbol, mask, pattern, marker, a, switch, glyph, missing-glyph'/>
<elementcategory name='descriptive' href='intro.html#TermDescriptiveElement' elements='desc, title, metadata'/>
<elementcategory name='gradient' href='intro.html#TermGradientElement' elements='linearGradient, radialGradient, meshGradient'/>
<elementcategory name='graphics' href='intro.html#TermGraphicsElement' elements='path, text, rect, circle, ellipse, line, polyline, polygon, image, use'/>
<elementcategory name='graphics referencing' href='intro.html#TermGraphicsReferencingElement' elements='use, image'/>
<elementcategory name='light source' href='intro.html#TermLightSourceElement' elements='feDistantLight, fePointLight, feSpotLight'/>
<elementcategory name='markable' href='intro.html#TermMarkableElement' elements='path, line, polyline, polygon'/>
<elementcategory name='shape' href='intro.html#TermShapeElement' elements='circle, ellipse, line, path, polygon, polyline, rect'/>
diff --git a/master/intro.html b/master/intro.html
--- a/master/intro.html
+++ b/master/intro.html
@@ -226,19 +226,20 @@ expression "We recommend ...", "This spe
<dt id="TermAnimationEventAttribute">animation event attribute</dt>
<dd>An animation event attribute is an <a>event attribute</a> that specifies
script to run for a particular animation-related event. See
<a href="script.html#AnimationEvents">Animation event attributes</a>.
The animation event attributes are <edit:attributecategory name='animation event'/>.</dd>
<dt id="TermBasicShapeElement">basic shape</dt>
- <dd>Standard shapes which are predefined in SVG as a
- convenience for common graphical operations. Specifically:
- <edit:elementcategory name='basic shape'/>.</dd>
+ <dt id="TermShapeElement">shape</dt>
+ <dd>A graphics element that is defined by some combination of
+ straight lines and curves. Specifically:
+ <edit:elementcategory name='shape'/>.</dd>
<dt id="TermBoundingBox">bounding box</dt>
<dd>
<p class="issue">Need a definition, which can probably be ported over
from SVG Tiny 1.2.</p>
</dd>
<dt id="TermCanvas">canvas</dt>
@@ -502,27 +503,16 @@ expression "We recommend ...", "This spe
<a href="styling.html">Styling</a>.</dd>
<dt id="TermRootmostSVGElement">rootmost <span class="element-name">'svg'</span> element</dt>
<dd>The rootmost <a>'svg'</a> element is the furthest
<a>'svg'</a> ancestor element that does not exit an
<a>SVG context</a>.
See also <a>SVG document fragment</a>.</dd>
- <dt id="TermShapeElement">shape</dt>
- <dd>A graphics element that is defined by some combination of
- straight lines and curves. Specifically:
- <a>'path'</a>,
- <a>'rect'</a>,
- <a>'circle'</a>,
- <a>'ellipse'</a>,
- <a>'line'</a>,
- <a>'polyline'</a> and
- <a>'polygon'</a>.</dd>
-
<dt id="TermStroke">stroke</dt>
<dd>The operation of <a>painting</a> the outline
of a <a>shape</a> or the outline of
character glyphs in a text string.</dd>
<dt id="TermStructuralElement">structural element</dt>
<dd>The structural elements are those which define the primary
structure of an SVG document. Specifically, the following
diff --git a/master/shapes.html b/master/shapes.html
--- a/master/shapes.html
+++ b/master/shapes.html
@@ -43,16 +43,70 @@ that it is clear for example where dashi
<h2 id="RectElement">The <span class="element-name">'rect'</span> element</h2>
<edit:with element='rect'>
<p>The <a>'rect'</a> element defines a rectangle which is axis-aligned
with the current <a>user coordinate system</a>. Rounded rectangles can be achieved by setting
appropriate values for attributes <a>'rx'</a> and <a>'ry'</a>.</p>
+<table class="propdef eltdef">
+ <tr>
+ <th>Name:</th>
+ <td><span class="element-name" style="font-size: inherit">rect</span></td>
+ </tr>
+ <tr>
+ <th>Categories:</th>
+ <td><a href="intro.html#TermGraphicsElement">Graphics element</a>, <a href="intro.html#TermShapeElement">shape element</a></td>
+ </tr>
+ <tr>
+ <th>Content model:</th>
+ <td>
+ <p>Any number of the following elements, in any order:</p>
+ <p>
+ <a href="intro.html#TermAnimationElement">animation elements</a>,
+ <a href="intro.html#TermDescriptiveElement">descriptive elements</a>,
+ <span class="element-name"><a href="masking.html#MaskElement"><span>mask</span></a></span>
+ </p>
+ </td>
+ </tr>
+ <tr>
+ <th>Common attributes:</th>
+ <td>
+ <a href="intro.html#TermConditionalProcessingAttribute">conditional processing attributes</a>,
+ <a href="intro.html#TermCoreAttribute">core attributes</a>,
+ <a href="intro.html#TermGraphicalEventAttribute">graphical event attributes</a>,
+ <a href="intro.html#TermPresentationAttribute">presentation attributes</a>
+ </td>
+ </tr>
+ <tr>
+ <th>Specific attributes:</th>
+ <td>
+ <span class="attr-name"><a href="#RectElementXAttribute"><span>x</span></a></span>,
+ <span class="attr-name"><a href="#RectElementYAttribute"><span>y</span></a></span>,
+ <span class="attr-name"><a href="#RectElementWidthAttribute"><span>width</span></a></span>,
+ <span class="attr-name"><a href="#RectElementHeightAttribute"><span>height</span></a></span>,
+ <span class="attr-name"><a href="#RectElementRXAttribute"><span>rx</span></a></span>,
+ <span class="attr-name"><a href="#RectElementRYAttribute"><span>ry</span></a></span>
+ </td>
+ </tr>
+ <tr>
+ <th>DOM Interface:</th>
+ <td>
+<pre class="idl">interface <b>SVGRectElement</b> : <a>SVGGraphicsElement</a> {
+ readonly attribute <a class="idlinterface" href="types.html#InterfaceSVGAnimatedLength">SVGAnimatedLength</a> <a href="shapes.html#__svg__SVGRectElement__x">x</a>;
+ readonly attribute <a class="idlinterface" href="types.html#InterfaceSVGAnimatedLength">SVGAnimatedLength</a> <a href="shapes.html#__svg__SVGRectElement__y">y</a>;
+ readonly attribute <a class="idlinterface" href="types.html#InterfaceSVGAnimatedLength">SVGAnimatedLength</a> <a href="shapes.html#__svg__SVGRectElement__width">width</a>;
+ readonly attribute <a class="idlinterface" href="types.html#InterfaceSVGAnimatedLength">SVGAnimatedLength</a> <a href="shapes.html#__svg__SVGRectElement__height">height</a>;
+ readonly attribute <a class="idlinterface" href="types.html#InterfaceSVGAnimatedLength">SVGAnimatedLength</a> <a href="shapes.html#__svg__SVGRectElement__rx">rx</a>;
+ readonly attribute <a class="idlinterface" href="types.html#InterfaceSVGAnimatedLength">SVGAnimatedLength</a> <a href="shapes.html#__svg__SVGRectElement__ry">ry</a>;
+};</pre>
+ </td>
+ </tr>
+</table>
<edit:elementsummary name='rect'/>
<div class="adef-list">
<p><em>Attribute definitions:</em></p>
<dl>
<dt id="RectElementXAttribute"><span
class="adef">x</span> = "<span class="attr-value"><a
href="types.html#DataTypeCoordinate"><coordinate></a></span>"</dt>
diff --git a/master/struct.html b/master/struct.html
--- a/master/struct.html
+++ b/master/struct.html
@@ -97,16 +97,120 @@ explicit namespace prefix must be assign
<p>Namespace prefixes can be specified on ancestor elements (illustrated
in the <a href="#EmbeddedSVGExample">above example</a>). For more
information, refer to the <a href="http://www.w3.org/TR/2006/REC-xml-names-20060816/"><cite>Namespaces in XML</cite></a> Recommendation
[<a href="refs.html#ref-XML-NS">XML-NS</a>].</p>
<h3 id="SVGElement">The <span class='element-name'>'svg'</span> element</h3>
+<table class="propdef eltdef">
+ <tr>
+ <th>Name:</th>
+ <td><span class="element-name" style="font-size: inherit">svg</span></td>
+ </tr>
+ <tr>
+ <th>Categories:</th>
+ <td><a href="intro.html#TermContainerElement">Container element</a>, <a href="intro.html#TermStructuralElement">structural element</a></td>
+ </tr>
+ <tr>
+ <th>Content model:</th>
+ <td>
+ <p>Any number of the following elements, in any order:</p>
+ <p>
+ <a href="intro.html#TermAnimationElement">animation elements</a>,
+ <a href="intro.html#TermDescriptiveElement">descriptive elements</a>,
+ <a href="intro.html#TermGradientElement">gradient elements</a>,
+ <a href="intro.html#TermShapeElement">shape elements</a>,
+ <a href="intro.html#TermStructuralElement">structural elements</a>,
+ <span class="element-name"><a href="linking.html#AElement"><span>a</span></a></span>, <span class="element-name"><a href="text.html#AltGlyphDefElement"><span>altGlyphDef</span></a></span>, <span class="element-name"><a href="masking.html#ClipPathElement"><span>clipPath</span></a></span>, <span class="element-name"><a href="color.html#ColorProfileElement"><span>color-profile</span></a></span>, <span class="element-name"><a href="interact.html#CursorElement"><span>cursor</span></a></span>, <span class="element-name"><a href="https://dvcs.w3.org/hg/FXTF/raw-file/tip/filters/index.html#FilterElement"><span>filter</span></a></span>, <span class="element-name"><a href="fonts.html#FontElement"><span>font</span></a></span>, <span class="element-name"><a href="fonts.html#FontFaceElement"><span>font-face</span></a></span>, <span class="element-name"><a href="extend.html#ForeignObjectElement"><span>foreignObject</span></a></span>, <span class="element-name"><a href="struct.html
#ImageElement"><span>image</span></a></span>, <span class="element-name"><a href="painting.html#MarkerElement"><span>marker</span></a></span>, <span class="element-name"><a href="masking.html#MaskElement"><span>mask</span></a></span>, <span class="element-name"><a href="pservers.html#PatternElement"><span>pattern</span></a></span>, <span class="element-name"><a href="script.html#ScriptElement"><span>script</span></a></span>, <span class="element-name"><a href="styling.html#StyleElement"><span>style</span></a></span>, <span class="element-name"><a href="struct.html#SwitchElement"><span>switch</span></a></span>, <span class="element-name"><a href="text.html#TextElement"><span>text</span></a></span>, <span class="element-name"><a href="linking.html#ViewElement"><span>view</span></a></span>
+ </p>
+ </td>
+ </tr>
+ <tr>
+ <th>Common attributes:</th>
+ <td>
+ <a href="intro.html#TermConditionalProcessingAttribute">conditional processing attributes</a>,
+ <a href="intro.html#TermCoreAttribute">core attributes</a>,
+ <a href="intro.html#TermDocumentEventAttribute">document event attributes</a>,
+ <a href="intro.html#TermGraphicalEventAttribute">graphical event attributes</a>,
+ <a href="intro.html#TermPresentationAttribute">presentation attributes</a>,
+ <span class="attr-name"><a href="coords.html#ViewBoxAttribute"><span>viewBox</span></a></span>,
+ <span class="attr-name"><a href="coords.html#PreserveAspectRatioAttribute"><span>preserveAspectRatio</span></a></span>
+ </td>
+ </tr>
+ <tr>
+ <th>Specific attributes:</th>
+ <td>
+ <span class="attr-name"><a href="struct.html#SVGElementXAttribute"><span>x</span></a></span>,
+ <span class="attr-name"><a href="struct.html#SVGElementYAttribute"><span>y</span></a></span>,
+ <span class="attr-name"><a href="struct.html#SVGElementWidthAttribute"><span>width</span></a></span>,
+ <span class="attr-name"><a href="struct.html#SVGElementHeightAttribute"><span>height</span></a></span>,
+ <span class="attr-name"><a href="struct.html#SVGElementVersionAttribute"><span>version</span></a></span>,
+ <span class="attr-name"><a href="struct.html#SVGElementBaseProfileAttribute"><span>baseProfile</span></a></span>,
+ <span class="attr-name"><a href="struct.html#SVGElementPlaybackOrderAttribute"><span>playbackOrder</span></a></span>,
+ <span class="attr-name"><a href="struct.html#SVGElementTimelineBeginAttribute"><span>timelineBegin</span></a></span>,
+ <span class="attr-name"><a href="interact.html#ZoomAndPanAttribute"><span>zoomAndPan</span></a></span>
+ </td>
+ </tr>
+ <tr>
+ <th>DOM Interface:</th>
+ <td>
+<pre class="idl">interface <b>SVGSVGElement</b> : <a>SVGGraphicsElement</a> {
+
+ readonly attribute <a class="idlinterface" href="types.html#InterfaceSVGAnimatedLength">SVGAnimatedLength</a> <a href="struct.html#__svg__SVGSVGElement__x">x</a>;
+ readonly attribute <a class="idlinterface" href="types.html#InterfaceSVGAnimatedLength">SVGAnimatedLength</a> <a href="struct.html#__svg__SVGSVGElement__y">y</a>;
+ readonly attribute <a class="idlinterface" href="types.html#InterfaceSVGAnimatedLength">SVGAnimatedLength</a> <a href="struct.html#__svg__SVGSVGElement__width">width</a>;
+ readonly attribute <a class="idlinterface" href="types.html#InterfaceSVGAnimatedLength">SVGAnimatedLength</a> <a href="struct.html#__svg__SVGSVGElement__height">height</a>;
+ readonly attribute <a class="idlinterface" href="types.html#InterfaceSVGRect">SVGRect</a> <a href="struct.html#__svg__SVGSVGElement__viewport">viewport</a>;
+ readonly attribute float <a href="struct.html#__svg__SVGSVGElement__pixelUnitToMillimeterX">pixelUnitToMillimeterX</a>;
+ readonly attribute float <a href="struct.html#__svg__SVGSVGElement__pixelUnitToMillimeterY">pixelUnitToMillimeterY</a>;
+ readonly attribute float <a href="struct.html#__svg__SVGSVGElement__screenPixelToMillimeterX">screenPixelToMillimeterX</a>;
+ readonly attribute float <a href="struct.html#__svg__SVGSVGElement__screenPixelToMillimeterY">screenPixelToMillimeterY</a>;
+ readonly attribute boolean <a href="struct.html#__svg__SVGSVGElement__useCurrentView">useCurrentView</a>;
+ readonly attribute <a class="idlinterface" href="types.html#InterfaceSVGViewSpec">SVGViewSpec</a> <a href="struct.html#__svg__SVGSVGElement__currentView">currentView</a>;
+ attribute float <a href="struct.html#__svg__SVGSVGElement__currentScale">currentScale</a>;
+ readonly attribute <a class="idlinterface" href="coords.html#InterfaceSVGPoint">SVGPoint</a> <a href="struct.html#__svg__SVGSVGElement__currentTranslate">currentTranslate</a>;
+
+ unsigned long <a href="struct.html#__svg__SVGSVGElement__suspendRedraw">suspendRedraw</a>(unsigned long maxWaitMilliseconds);
+ void <a href="struct.html#__svg__SVGSVGElement__unsuspendRedraw">unsuspendRedraw</a>(unsigned long suspendHandleID);
+ void <a href="struct.html#__svg__SVGSVGElement__unsuspendRedrawAll">unsuspendRedrawAll</a>();
+ void <a href="struct.html#__svg__SVGSVGElement__forceRedraw">forceRedraw</a>();
+ void <a href="struct.html#__svg__SVGSVGElement__pauseAnimations">pauseAnimations</a>();
+ void <a href="struct.html#__svg__SVGSVGElement__unpauseAnimations">unpauseAnimations</a>();
+ boolean <a href="struct.html#__svg__SVGSVGElement__animationsPaused">animationsPaused</a>();
+ float <a href="struct.html#__svg__SVGSVGElement__getCurrentTime">getCurrentTime</a>();
+ void <a href="struct.html#__svg__SVGSVGElement__setCurrentTime">setCurrentTime</a>(float seconds);
+ <a class="idlinterface"
+ href="http://www.w3.org/TR/DOM-Level-2-Core/core.html#ID-536297177">NodeList</a> <a href="struct.html#__svg__SVGSVGElement__getIntersectionList">getIntersectionList</a>(<a class="idlinterface" href="types.html#InterfaceSVGRect">SVGRect</a> rect, <a class="idlinterface" href="types.html#InterfaceSVGElement">SVGElement</a> referenceElement);
+ <a class="idlinterface"
+ href="http://www.w3.org/TR/DOM-Level-2-Core/core.html#ID-536297177">NodeList</a> <a href="struct.html#__svg__SVGSVGElement__getEnclosureList">getEnclosureList</a>(<a class="idlinterface" href="types.html#InterfaceSVGRect">SVGRect</a> rect, <a class="idlinterface" href="types.html#InterfaceSVGElement">SVGElement</a> referenceElement);
+ boolean <a href="struct.html#__svg__SVGSVGElement__checkIntersection">checkIntersection</a>(<a class="idlinterface" href="types.html#InterfaceSVGElement">SVGElement</a> element, <a class="idlinterface" href="types.html#InterfaceSVGRect">SVGRect</a> rect);
+ boolean <a href="struct.html#__svg__SVGSVGElement__checkEnclosure">checkEnclosure</a>(<a class="idlinterface" href="types.html#InterfaceSVGElement">SVGElement</a> element, <a class="idlinterface" href="types.html#InterfaceSVGRect">SVGRect</a> rect);
+ void <a href="struct.html#__svg__SVGSVGElement__deselectAll">deselectAll</a>();
+ <a class="idlinterface" href="types.html#InterfaceSVGNumber">SVGNumber</a> <a href="struct.html#__svg__SVGSVGElement__createSVGNumber">createSVGNumber</a>();
+ <a class="idlinterface" href="types.html#InterfaceSVGLength">SVGLength</a> <a href="struct.html#__svg__SVGSVGElement__createSVGLength">createSVGLength</a>();
+ <a class="idlinterface" href="types.html#InterfaceSVGAngle">SVGAngle</a> <a href="struct.html#__svg__SVGSVGElement__createSVGAngle">createSVGAngle</a>();
+ <a class="idlinterface" href="coords.html#InterfaceSVGPoint">SVGPoint</a> <a href="struct.html#__svg__SVGSVGElement__createSVGPoint">createSVGPoint</a>();
+ <a class="idlinterface" href="coords.html#InterfaceSVGMatrix">SVGMatrix</a> <a href="struct.html#__svg__SVGSVGElement__createSVGMatrix">createSVGMatrix</a>();
+ <a class="idlinterface" href="types.html#InterfaceSVGRect">SVGRect</a> <a href="struct.html#__svg__SVGSVGElement__createSVGRect">createSVGRect</a>();
+ <a class="idlinterface" href="coords.html#InterfaceSVGTransform">SVGTransform</a> <a href="struct.html#__svg__SVGSVGElement__createSVGTransform">createSVGTransform</a>();
+ <a class="idlinterface" href="coords.html#InterfaceSVGTransform">SVGTransform</a> <a href="struct.html#__svg__SVGSVGElement__createSVGTransformFromMatrix">createSVGTransformFromMatrix</a>(<a class="idlinterface" href="coords.html#InterfaceSVGMatrix">SVGMatrix</a> matrix);
+ <a class="idlinterface"
+ href="http://www.w3.org/TR/DOM-Level-2-Core/core.html#ID-745549614">Element</a> <a href="struct.html#__svg__SVGSVGElement__getElementById">getElementById</a>(DOMString elementId);
+};
+
+<a>SVGSVGElement</a> implements <a>ViewCSS</a>;
+<a>SVGSVGElement</a> implements <a>DocumentCSS</a>;
+<a>SVGSVGElement</a> implements <a>SVGFitToViewBox</a>;
+<a>SVGSVGElement</a> implements <a>SVGZoomAndPan</a>;</pre>
+ </td>
+ </tr>
+</table>
+
<edit:elementsummary name='svg'/>
<div class="annotation requirement">
<table>
<tr>
<th>SVG 2 Requirement:</th>
<td>Support transforming <a>'svg'</a> elements.</td>
</tr>
diff --git a/master/style/default_svg.css b/master/style/default_svg.css
--- a/master/style/default_svg.css
+++ b/master/style/default_svg.css
@@ -326,8 +326,13 @@ table.attrtable tbody td:first-child { w
table > caption { caption-side: bottom }
table.PathDataTable { border-spacing: 2px; border-style: outset; border-width: 1px }
table.PathDataTable td,
table.PathDataTable th { padding: 5px; border-style: inset; border-width: 1px }
.colorpatch { width: 14px; height: 14px; border: 1px solid black; }
+
+.eltdef { border-left: 0.5em solid #52A7E0 !important; background: #E9F4FB !important; }
+.eltdef td > p:first-child { margin-top: 0 }
+.eltdef th { white-space: nowrap }
+.eltdef pre.idl { margin: 0; padding: 0; background: none }
Received on Tuesday, 21 August 2012 07:34:33 UTC