back to Samples

Hypervideo Timelines



Hypervideo timelines present the document story meaningful events and features in a graphical manner. The widget chm:timeline instanciates such representation and has as attributes the data query and eventually some other parameters that allow the definition of the chosen graphical aspect such as figures and animations.

We first declare the needed data reader. The data is stored following a json format in the Nosferatu.json file.

<div chm:component="jsonreader" id="data" chm:src="Nosferatu.json" >

The video is displayed by the CHM media player provided the URI of the file.

<div chm:component="videoplayer" id="tm" chm:src="http://advene.org/video/nosferatuVCD_256kb.ogv" >

A timeline is associated with the displayed video. Two types of tracks are presented: the emotional scenes (in green), mainly fear and joy ones, and the actor appearences (in red) are presented within the timeline.

<div chm:component="timeline"> <div chm:component="track" chm:src="data" chm:filter="type=='Joy'||type=='Fear'" chm:timelineref="tm" ></div>
<div chm:component="track" chm:src="data" chm:filter="type=='actor'" chm:timelineref="tm" ></div></div>
x

Source Code of the Sample


Press ESCAPE, Click on X (right-top) or Click Out from the popup to close the popup!