XML Media Formats Robin Burke ECT 360

Outline Multiple XML documents SMIL HTML+TIME Break WML XHTML MP Final Project Presentation

Multiple XML documents Problem XSLT needs to access multiple XML documents Only has access to node-sets in document being processed Example curriculum designs course information

Solution document() function Retrieves document from URL can be used as part of an XPath expression <xsl:variable name="course-names" select="document('course-list.xml')/course- />

SMIL Synchronized Multimedia Integration Language Define Common Standards for multimedia documents. SMIL 1.0 (1998) SMIL 2.0 (2001)

The Idea General document format integrating different types of independent media objects. Promote the notion of time and synchronization as a core functionality. Bring together major industrial players to define a common standard. RealPlayer, Flash support

SMIL document A Set of “components” accessible via URLs. Components have different media types: audio, video, text, images and objects. Intra- and Inter-object synchronization. User interactions: media controls and hyper-links (random access).

Organization of a SMIL document Two parts : Head : contains information of document level Body : contains the temporal scenario, animations, transitions and the media objects

Structure of a document toto.smi head body seq switch par Layout Region 1 Media Audio Channel Media Transition Animation Transition

Example

Document Head META element: description of the document properties and metadata (RDF) Title, author, expiration date, keywords, summary, …

Spatial Aspect Layout element Hierarchical Model with hotspots (regPoints) Layers instead of text flow (text flow for text !) Simple Positioning close to the CSS Model (x, y, z-index, fit)

Spatial Aspect Region 1Region 2 Region 3 b c a Time flow Regions and sub-regions for the spatial placement of media objects

Document Body: Synchronization Contains the temporal scenario of the document A scenario is defined recursively : Schedule elements Schedule = Parallel | Seq | Switch

Basic Media Objects Media Objects marked-up with: Audio, Video, Text, Img, Textstream, Animation, Ref, Param, et … Prefetch Attributes : Src : identifies the basic media object file (URL) rtsp://rtsp.example.org/video.mpg Type : mime type (eg. video/mpeg) Region : identifies the drawing surface Dur : duration of the media object

Synchronization Attributes The Dur (duration) attribute: “intrinsic”: the duration corresponds to the duration of the external file. “explicit”: the duration is specified in the document (dur= “15 s”) The repeat attribute: RepeatCount=“3” repeats the simple duration of the media. RepeatDur=“12 s” :

Synchronization Attributes The begin, end attributes: Value (begin= “13 s”) : offset relative to the parent element. Reference to another clock : (begin= “e2.end + 5 s ”) Reference to the absolute time reference: (begin= “wallclock( Z)” Reference to an asynchronous event (interactivity): (begin= “button.click”)

Media Clipping Spatial Clipping using regions and sub-regions Temporal Clipping using clip-begin et clip-end attributes (media objects are external files) <video id="a" src=“video.mpg" clip-begin=“smpte=00:01:45" clip-end=“smpte=00:01:55" … /> MediaSlice

Semantics : play in sequence a set of media objects Attributes Fill : used to make the object « persist » on the screen Remove : removes the object at end time Freeze : keeps the last frame at end time The sequential element

The parallel element Semantics : Play in parallel a set of media objects End time : maximum duration of child objects

Synchronization Arcs and Events a cb d... <text id="c" src="text" begin="id(d)" end=id(a)(end) />... Triggering of objects on events :... <video id="b" src="video.mpg” begin=“a.activateEvent" end=“a.activateEvent />... a c b

Switch element An element to choose from a set of content equivalent objects Choice is based on attribute values language, screen size, depth, bitrate, systemRequired …and user preferences

Animations Definition : A set of attributes are target of the animation A function (calc mode) makes these attributes evolve A control on the instants where the changes are applied Syntax animateMotion : graphical movements of elements animate : generic animation applied to element attributes from/to/by/calcMode set : discrete change of an attribute value at a given instant animateColor : animation in the color space

Animations <animate begin= "5s" dur="10s" attributeName="top" by="100" repeatCount="2.5" fill="freeze" calcMode="linear"/> Calc Mode : discrete, list of values with linear, log interpolation

Transitions Element : transition Type and Subtype (transition repository + variant) transIn and transOut attributes <img src="wolf.jpg" dur="5s" fill="transition" transIn="wipe2" transOut=“wipe1”... /> Transition

Hypermedia time-based links Compatible with (Xlink/Xpointer) Extension to the semantics of URLs or)) Two types (a: whole object, area: part of it) Jump over time and space !! Attribute show Replace (default value) New (fork) Pause (procedure call)

Links with spatial and temporal anchors Anchor on a sub-surface of an object Anchor on a sub-duration of an object time

Example

HTML+TIME A set of extensions to HTML for building in animation Will eventually be replaced by XHTML + SMIL Usable now

Example

Break

Wireless Web Content WAP Wireless Application Protocol defines interaction style, not content WML older standard based on "card" metaphor supported by most phones XHTML MP MP = "mobile profile" regular HTML with restricted element set cHTML "compact" HTML used for iMode (Japan) migrating to XHTML MP

WAP 1.0 Gateway

WAP 2.0 Gateway

WML Wireless Markup Language content for cell phone display “microbrowser” Special characteristics small size multiple “pages” per download cards

WML Elements card a chunk of screen content title, id multiple cards in one WML document "deck" do link to built-in "options" and "accept" softkeys p text content a links wtai protocols for phone functions dial number, save in phone book img only wbmp supported

Example

Variable example

XHTML MP Different

Differences Multi-page vs deck can use multi-part message Some functionality gone variables softkeys Browser / device-dependence more important image formats table support CSS support

Example

Handling device differences Basic problem want the best display for each device device capabilities vary widely CSS not widely implemented CSS not enough Solution dynamic server-side page generation based on device profiles can be done with XSLT

Device-specific information WURFL Wireless Universal Resource File XML application

WURFL example...

Final Project Presentation 10% Previous milestones 10% Presentation 20% Design 25% Schema 35% XSLT

Presentation Whole team should be here Plan to stay to see all the projects Group assessment exercise