--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/doc/widget_tutorial/tutorial.htm Fri Feb 17 10:22:39 2012 +0100
@@ -0,0 +1,94 @@
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html dir="ltr" xml:lang="fr" xmlns="http://www.w3.org/1999/xhtml" lang="fr">
+
+<head>
+<title>Metadataplayer - Widget tutorial</title>
+</head>
+
+<body>
+
+ <div style="width:650px;font-family: 'Trebuchet MS', 'Helvetica', 'Arial', 'Verdana', 'sans-serif';">
+ <h1>MetaDataPlayer</h1>
+ </div>
+
+ If you're seeing nothing, it's because you've probably forgotten to run the build script.
+ Run sbin/build/compil.sh to compile the files together.
+ <!-- load the player file, and then our tutorial widget -->
+ <script type="text/javascript" src="../../build/LdtPlayer-release.js" type="text/javascript"></script>
+ <script type="text/javascript" src="LdtPlayer-tutorial.js" type="text/javascript"></script>
+
+ <!-- this is the div the player will instantiate itself-->
+ <div id="LdtPlayer"></div>
+
+ <script type="text/javascript">
+ var file = "../../test/integration/polemic_fr.json";
+
+ /* This is the player configuration */
+ var config = {
+ /* The first part of the config, config.gui, describes the gui options and the widgets. */
+ gui:{
+ width:650,
+ container:'LdtPlayer', /* container div where the player will instantiate itself */
+ css:'../../src/css/LdtPlayer.css', /* where to get the css from */
+
+ /* default options for the widgets, to keep things DRY.
+ We put the metadata config there because the widgets often get their data from the same sources,
+ Also not that re-defining a field that was defined in default_options overrides its value.
+ */
+ default_options : {
+ metadata:{
+ src:file,
+ type:'json' /* determines how the data will be loaded */
+ }
+ },
+ /* this is the list of the widget that are going to be instantiated
+ We're going for a minimal player here, so we're only going to instantiate
+ a basic gui, a seekbar and our tutorial widget.
+ */
+ widgets: [
+ /* the type of the widget corresponds to the name of its constructor.
+ For instance, type: "SliderWidget" means to instantiate IriSP.SliderWidget
+ */
+ {type: "SliderWidget"},
+ {type: "PlayerWidget"},
+ {type: "TutorialWidget"},
+ ]
+ },
+ /* second part of the config - player options */
+ player:{
+ /* type of the player to instantiate - available values are
+ jwplayer, html5, youtube, etc.
+ */
+ type:'jwplayer',
+ /* the rest are options for the jwplayer */
+ live: true,
+ height: 300,
+ width: 640,
+ provider: "rtmp",
+ file: "video/ldtplatform/museologie_inaugurale_20111018_flat.f4v",
+ streamer: "rtmp://media.iri.centrepompidou.fr/ddc_player/"
+ },
+ /* modules - modules are things similar to widgets, except that they
+ don't live in a div.
+ */
+ modules: [
+ /* the mediafragment module updates the url of the video to allow
+ sharing a specific moment in a video
+ */
+ { type: "MediaFragment",
+ metadata:{
+ format:'cinelab',
+ src:file,
+ type:'json'}
+ }]
+
+ };
+
+ // init the player, specifying the config and a basic config file
+ // for media autoconfig.
+ IriSP.initPlayer(config, file);
+ </script>
+
+
+ </body>
+ </html>