Patrick Schmitz Simon Thompson Peter King sjt/PDXML/ Presentation Dynamism in XML.
-
date post
20-Dec-2015 -
Category
Documents
-
view
218 -
download
0
Transcript of Patrick Schmitz Simon Thompson Peter King sjt/PDXML/ Presentation Dynamism in XML.
PDXML 2
Declarative style
What do we mean when we say that we use a declarative approach?
• Declarative programming encompasses logic and functional programming.
PDXML 3
Authors vs. programmers
In WWW circles declarative means something different: a markup style which gives an explicit description of an artefact. More succinctly,
declarative = non-programmed
Another way of saying this is that:
authors are not programmers
PDXML 4
Examples from SMIL / SVG
Examples from SMIL / SVG animation
<animateMotion from=“0,0” to “60,30” dur=“4s”>
<animateMotion path=“M50,125 C 100,25 150,225 …”>
Can also include attributes controllingrepeatCount rotate accelerate
fill end …
PDXML 5
Domain specific languages
You can see SVG, SMIL (and many other XML-based languages) as domain specific languages.
They give a little language for describing, say, graphical objects in a scalable (vector) format.
PDXML 6
What if a DSL is not enough?
• Embed the DSL in a programming language.• Haskell is a common substrate.• Java implements the Batik SVG toolkit.• Requires an author to be a programmer.
• Script extensions to the DSL (in JavaScript, …).• Scripts can manipulate the underlying Document Object Model.• Declarative model lost completely (worse than 1st model)
• Extend the declarative model as far as possible.
PDXML 7
Advantages of extension
Description remains at the domain level: easier for authors.
Higher-level descriptions can be exchanged between different tools etc.
Descriptions can be rendered in appropriate ways in different environments.
PDXML 8
Disadvantages of extension
It’s still a closed world …
… one analogy is with Turing (in)completeness;
… another is with a language like the LaTeX macros.
PDXML 9
Why is this of interest (to me)?
Looking at ideas that we take for granted, from a completely different perspective: that of ‘Joe author’ not ‘Simon functional programmer’.
How to integrate these into a widely-used system: Internet Explorer (PLS).
Potential impact on emerging standards: it would be nice to get these ideas into SVG 1.2 (and SMIL 3.0?).
PDXML 10
What extensions do we propose?
Attribute values can be calculated dynamically
User-defined events
Parameterized templates for document content
The inspiration comes from FP and FPR.
PDXML 11
Use cases for the additions
• Bubbles which rise through water• created at random points, with random size, at random times;• their speed of ascent is a function of their size;• when the bubbles hit the surface, they disappear with an audible ‘pop’.
• An animation which begins when it is scrolled into view; this can’t be pre-defined.
• A message which is layout-dependent: CSS styling etc. makes is non-predictable.
• Animated menu buttons: make children targets for animation, e.g colour, text, … .
PDXML 12
Expressions
Typed: numbers, booleans, character strings.
Library of mathematical functions, environment functions (current time, mouse position, etc.)
No user-defined functions.
Is ‘no functions’ too harsh? Could or should we include simple (e.g. non recursive) functions?
PDXML 13
Examples
<animate attributeName="width" dur="5s"
to="calc(main.width*0.8)" .../>
<animateMotion dur="5s"
from="calc(btn.x+btn.width),calc(btn.y)"
to="calc(content.x),calc(content.y)" …/>
<t:set attributeName="innerHtml"
to="calc((main.mouseY>(main.height/2))?
‘Lower’:‘Upper’)"/>
PDXML 14
When to calculate?
<animateMotion to="calc(target.x),
calc(target.y)" …/>
If you calculate at the start of the animation, it is like an arrow from a bow …
… if you repeatedly recalculate, then it is like a guided missile.
PDXML 15
When to calculate?
Four options:
1. parse-time: for static constants2. after layout complete: for values that depend
upon styles3. each time animation begins4. each sampling point.
All but 3: recalculate lazily: when and only when the value has (potentially) changed: signal this case (only).
PDXML 16
Implementation
Require the implementation to keep track of inter-value dependencies, and to propagate through effects of changing values.
PDXML 17
Events
An event is defined by a boolean expression.
It occurs when the expression becomes True; it occurs again only after• the predicate has taken the value False, or• the animation has been reset.
<event target="img1" type="enterView"
predicate="(img1.top + img1.height) <=
(main.scrollTop + main.scrollHeight)" />
PDXML 18
Event implementation
Fits straight into the model of calculation: recalculate at each point (where the expression might have changed).
PDXML 19
Templates and parameters
<template id=“bubble”>
<param name=“xOrigin” />
<param name=“size” />
<circle cx=“$ xOrigin” r=“$size” … >
<animate attributeName=“cy”
from=“100%” to=“10%”
dur=“calc((10-($size/2)),atStart)” />
</circle>
</template>
PDXML 20
Instances
<instance xlink:href=“#bubble”>
<param name=“xOrigin”
value=“calc(rand(0,100), atStart) />
<param name=“size” … />
</instance>
PDXML 21
Commentary
There’s a mechanism like this in SVG, but it doesn’t implement instantiation fully.
A ‘shadow DOM’ gives access to children of instances, but doesn’t instantiate them properly: e.g. these can’t be animated.
Need to introduce a proper mechanism for naming components of instances.
• A full solution would need to be at XML/DOM tool level.• We use instance.attribute; this works!
PDXML 22
Implementation details
Uses Internet Explorer 6 support for XHTML + SMIL: in particular the behavior mechanism.
Find calc(…), use JavaScript engine to give the result and then set the appropriate DOM values.
Can use DOM property mutation events to control evaluation.
Would be better to do it properly!