Patrick Schmitz

1
Presentation Dynamism in XML

• Patrick Schmitz
• Simon Thompson
• Peter King
• www.cs.kent.ac.uk/sjt/PDXML/

2
Declarative style

• What do we mean when we say that we use a
  declarative approach?
• Declarative programming encompasses logic and
  functional programming.

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

4
Examples from SMIL / SVG

• Examples from SMIL / SVG animation
• ltanimateMotion from0,0 to 60,30 dur4sgt
• ltanimateMotion pathM50,125 C 100,25 150,225 gt
• Can also include attributes controlling
• repeatCount rotate accelerate
• fill end

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.

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.

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.

8
Disadvantages of extension

• Its still a closed world
• one analogy is with Turing (in)completeness
• another is with a language like the LaTeX
  macros.

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?).

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.

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 cant 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, .

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?

13
Examples

• ltanimate attributeName"width" dur"5s"
  to"calc(main.width0.8)" .../gt
• ltanimateMotion dur"5s" from"calc(btn.xbtn.wid
  th),calc(btn.y)" to"calc(content.x),calc(conten
  t.y)" /gt
• lttset attributeName"innerHtml"
• to"calc((main.mouseYgt(main.height/2))?
  LowerUpper)"/gt

14
When to calculate?

• ltanimateMotion to"calc(target.x),
  calc(target.y)" /gt
• 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.

15
When to calculate?

• Four options
• parse-time for static constants
• after layout complete for values that depend
  upon styles
• each time animation begins
• each sampling point.
• All but 3 recalculate lazily when and only when
  the value has (potentially) changed signal this
  case (only).

16
Implementation

• Require the implementation to keep track of
  inter-value dependencies, and to propagate
  through effects of changing values.

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.
• ltevent target"img1" type"enterView"
  predicate"(img1.top img1.height) lt
  (main.scrollTop main.scrollHeight)" /gt

18
Event implementation

• Fits straight into the model of calculation
  recalculate at each point (where the expression
  might have changed).

19
Templates and parameters

• lttemplate idbubblegt
• ltparam namexOrigin /gt
• ltparam namesize /gt
• ltcircle cx xOrigin rsize gt
• ltanimate attributeNamecy
• from100 to10
• durcalc((10-(size/2)),atStart)
  /gt
• lt/circlegt
• lt/templategt

20
Instances

• ltinstance xlinkhrefbubblegt
• ltparam namexOrigin
• valuecalc(rand(0,100), atStart) /gt
• ltparam namesize /gt
• lt/instancegt

21
Commentary

• Theres a mechanism like this in SVG, but it
  doesnt implement instantiation fully.
• A shadow DOM gives access to children of
  instances, but doesnt instantiate them properly
  e.g. these cant 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!

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!

23
Further work

• Integration with SMIL timing.
• Extend the scope of expression use.
• Templates and the object model.