XForms, Slideshow

Motivation

You want to have a region of your page that changes images when the user selects a button.

Method

Store a list of links to the slide images in an instance. Use another instance variable to store the state of the images is currently selected. Use a trigger to update the image number.

Link to XForms Application

Load XForms Application

Sample Source Code

xmlns="http://www.w3.org/1999/xhtml"
xmlns:xf="http://www.w3.org/2002/xforms"
xmlns:xs="http://www.w3.org/2001/XMLSchema"
xmlns:ev="http://www.w3.org/2001/xml-events">;

Slide Show
id="data-model">
id="data" xmlns="">

href="http://www.bav-astro.de/sterne/monv838/monv838-hubble-20040304.jpg">Image 1
href="http://aether.lbl.gov/Images/resizenowmap.jpg">Image 2
href="http://www.nasa.gov/images/content/143744main_hubble_spiral_2006.jpg">Image 3
href="http://www.space.gc.ca/asc/img/sci_core-hubble.jpg">Image 4

nodeset="instance('data')/link/@href" type="xs:anyURI"/>
id="state" xmlns="">

0

ev:event="cycle-next">
ref="instance('state')/cycle" value="(. + 1) mod 4"/>
name="update-model" target="data-model"/>

ev:event="update-model">

Next
ev:event="DOMActivate">
name="cycle-next" target="data-model"/>

ref="instance('state')/cycle"/>) ref="instance('data')/link[1 + instance('state')/cycle]"/>

ref="instance('data')/link[1 + instance('state')/cycle]/@href" mediatype="image/*"/>

Discussion

This program has the Next trigger calls the "cycle-next" named event when it is pressed. This event, which is defined in the model, updates the cycle and resets it back to one after the slides are done. After that it instructs the form to recalculate its dependency graph. This updates the visible image.

Note that the output must have a the mediatype set to be image/* for the browser to render the link as an image correctly.

Attribution

This example was created by Chris Wallace and the University of Western England.

Where this page came from

This page was imported from Wikibooks. From “XForms” on Wikibooks, by its contributors, under CC BY-SA 4.0. Changed here: set as a page; navigation and edit links left out; each image under its own licence, credited in its caption.

Nobody has written it yet — it is the source material at a new address, which is why search engines are asked to skip it and why no one earns from it. It is up for grabs: take it on, and it is yours to rewrite and to earn from.