# HG changeset patch
# User veltr
# Date 1336668489 -7200
# Node ID 6a04bd37da0a74b861ceb904c460d638e9571e05
# Parent  10233337f6dad2d802435c7afe6cfde0cc6717b2
Corrected lib loading function so several instances of the Metadataplayer can be called

diff -r 10233337f6da -r 6a04bd37da0a sbin/build/compil.sh
--- a/sbin/build/compil.sh	Mon May 07 15:25:52 2012 +0200
+++ b/sbin/build/compil.sh	Thu May 10 18:48:09 2012 +0200
@@ -1,2 +1,4 @@
 #!/bin/sh
-sh ../res/ant/bin/ant -f client.xml
\ No newline at end of file
+sh ../res/ant/bin/ant -f client.xml
+cp ../../build/LdtPlayer-core.js ../../test/metadataplayer/LdtPlayer-core.js
+cp ../../src/widgets/* ../../test/metadataplayer
\ No newline at end of file
diff -r 10233337f6da -r 6a04bd37da0a src/js/init.js
--- a/src/js/init.js	Mon May 07 15:25:52 2012 +0200
+++ b/src/js/init.js	Thu May 10 18:48:09 2012 +0200
@@ -8,6 +8,7 @@
 /* The Metadataplayer Object, single point of entry, replaces IriSP.init_player */
 
 IriSP.Metadataplayer = function(config, video_metadata) {
+    IriSP.log("IriSP.Metadataplayer constructor");
     for (var key in IriSP.guiDefaults) {
         if (IriSP.guiDefaults.hasOwnProperty(key) && !config.gui.hasOwnProperty(key)) {
             config.gui[key] = IriSP.guiDefaults[key]
@@ -26,7 +27,7 @@
 }
 
 IriSP.Metadataplayer.prototype.loadLibs = function() {
-    
+    IriSP.log("IriSP.Metadataplayer.prototype.loadLibs");
     var $L = $LAB
         .script(IriSP.getLib("underscore"))
         .script(IriSP.getLib("Mustache"))
@@ -52,20 +53,23 @@
     }
     
     var _this = this;
-    
+    IriSP.log($L);
     $L.wait(function() {
-        IriSP.jQuery = window.jQuery.noConflict();
-        IriSP._ = window._.noConflict();
-        
-        IriSP.loadCss(IriSP.getLib("cssjQueryUI"))
-        IriSP.loadCss(_this.config.gui.css);
-        
         _this.onLibsLoaded();
-        
     });
 }
 
 IriSP.Metadataplayer.prototype.onLibsLoaded = function() {
+    IriSP.log("IriSP.Metadataplayer.prototype.onLibsLoaded");
+    if (typeof IriSP.jQuery === "undefined" && typeof window.jQuery !== "undefined") {
+        IriSP.jQuery = window.jQuery.noConflict();
+    }
+    if (typeof IriSP._ === "undefined" && typeof window._ !== "undefined") {
+        IriSP._ = window._.noConflict();
+    }
+    IriSP.loadCss(IriSP.getLib("cssjQueryUI"));
+    IriSP.loadCss(this.config.gui.css);
+    
     this.videoData = this.loadMetadata(this.video_metadata);
     this.$ = IriSP.jQuery('#' + this.config.gui.container);
     this.$.css({
@@ -145,13 +149,14 @@
 }
 
 IriSP.Metadataplayer.prototype.configurePopcorn = function() {
+    IriSP.log("IriSP.Metadataplayer.prototype.configurePopcorn");
     var pop,
         ret = this.layoutDivs("video"),
         containerDiv = ret[0],
         spacerDiv = ret[1],
         _this = this,
         _types = {
-            "html5" : /\.(ogv|webm|mp4)$/,
+            "html5" : /\.(ogg|ogv|webm|mp4)$/,
             "youtube" : /^(https?:\/\/)?(www\.)?youtube\.com/,
             "dailymotion" : /^(https?:\/\/)?(www\.)?dailymotion\.com/
         };
@@ -171,15 +176,22 @@
          will contain the video.
          */
         case "html5":
-            var tmpId = Popcorn.guid("video");
-            IriSP.jQuery("#" + containerDiv).append("<video src='" + this.config.player.video + "' id='" + tmpId + "'></video>");
+            var _tmpId = Popcorn.guid("video"),
+                _videoEl = IriSP.jQuery('<video>');
+            
+            _videoEl.attr({
+                "src" : this.config.player.video,
+                "id" : _tmpId
+            })
 
-            if(options.hasOwnProperty("width"))
-                IriSP.jQuery("#" + containerDiv).css("width", this.config.player.width);
-
-            if(options.hasOwnProperty("height"))
-                IriSP.jQuery("#" + containerDiv).css("height", this.config.player.height);
-            pop = Popcorn("#" + tmpId);
+            if(this.config.player.hasOwnProperty("width")) {
+                _videoEl.attr("width", this.config.player.width);
+            }
+            if(this.config.player.hasOwnProperty("height")) {
+                _videoEl.attr("height", this.config.player.height);
+            }
+            IriSP.jQuery("#" + containerDiv).append(_videoEl);
+            pop = Popcorn("#" + _tmpId);
             break;
 
         case "jwplayer":
diff -r 10233337f6da -r 6a04bd37da0a src/js/model.js
--- a/src/js/model.js	Mon May 07 15:25:52 2012 +0200
+++ b/src/js/model.js	Thu May 10 18:48:09 2012 +0200
@@ -241,7 +241,22 @@
  */
 
 IriSP.Model.Time = function(_milliseconds) {
-    this.milliseconds = parseInt(typeof _milliseconds !== "undefined" ? _milliseconds : 0);
+    switch(typeof _milliseconds) {
+        case "string":
+            this.milliseconds = parseFloat(_milliseconds);
+            break;
+        case "number":
+            this.milliseconds = _milliseconds;
+            break;
+        case "object":
+            this.milliseconds = parseFloat(_milliseconds.valueOf());
+            break;
+        default:
+            this.milliseconds = 0;
+    }
+    if (this.milliseconds === NaN) {
+        this.milliseconds = 0;
+    }
 }
 
 IriSP.Model.Time.prototype.setSeconds = function(_seconds) {
@@ -261,6 +276,10 @@
     } 
 }
 
+IriSP.Model.Time.prototype.add = function(_milliseconds) {
+    this.milliseconds += new IriSP.Model.Time(_milliseconds).milliseconds;
+}
+
 IriSP.Model.Time.prototype.valueOf = function() {
     return this.milliseconds;
 }
@@ -460,6 +479,61 @@
 
 /* */
 
+IriSP.Model.MashedAnnotation = function(_annotation, _offset) {
+    IriSP.Model.Element.call(this, IriSP.Model.getUID(), _annotation.source);
+    this.elementType = 'mashedAnnotation';
+    this.annotation = _annotation;
+    this.begin = new IriSP.Model.Time(_offset);
+    var _duration = (this.annotation.end - this.annotation.begin);
+    this.end = new IriSP.Model.Time(_offset + _duration)
+    this.title = this.annotation.title;
+    this.description = this.annotation.description;
+}
+
+IriSP.Model.MashedAnnotation.prototype = new IriSP.Model.Element(null);
+
+IriSP.Model.MashedAnnotation.prototype.getMedia = function() {
+    return this.annotation.getReference("media");
+}
+
+IriSP.Model.MashedAnnotation.prototype.getAnnotationType = function() {
+    return this.annotation.getReference("annotationType");
+}
+
+IriSP.Model.MashedAnnotation.prototype.getTags = function() {
+    return this.annotation.getReference("tag");
+}
+
+IriSP.Model.MashedAnnotation.prototype.getTagTexts = function() {
+    return this.annotation.getTags().getTitles();
+}
+
+/* */
+
+IriSP.Model.Mashup = function(_id, _source) {
+    IriSP.Model.Element.call(this, _id, _source);
+    this.elementType = 'mashup';
+    this.duration = new IriSP.Model.Time();
+    this.segments = new IriSP.Model.List();
+    this.medias = new IriSP.Model.List();
+}
+
+IriSP.Model.Mashup.prototype = new IriSP.Model.Element();
+
+IriSP.Model.Mashup.prototype.addSegment = function(_annotation) {
+    this.segments.push(new IriSP.Model.MashedAnnotation(_annotation));
+    this.medias.addElement(_annotation.getMedia());
+}
+
+IriSP.Model.Mashup.prototype.getAnnotations = function() {
+    return this.segments;
+}
+
+IriSP.Model.Mashup.prototype.getMedias = function() {
+    return this.medias;
+}
+/* */
+
 IriSP.Model.Source = function(_config) {
     this.status = IriSP.Model._SOURCE_STATUS_EMPTY;
     if (typeof _config !== "undefined") {
diff -r 10233337f6da -r 6a04bd37da0a src/js/utils.js
--- a/src/js/utils.js	Mon May 07 15:25:52 2012 +0200
+++ b/src/js/utils.js	Thu May 10 18:48:09 2012 +0200
@@ -16,10 +16,21 @@
     }
 }
 
+IriSP._cssCache = [];
+
 IriSP.loadCss = function(_cssFile) {
-    IriSP.jQuery("<link>", {
-        rel : "stylesheet",
-        type : "text/css",
-        href : _cssFile
-    }).appendTo('head');
-}
\ No newline at end of file
+    if (IriSP._(IriSP._cssCache).indexOf(_cssFile) === -1) {
+        IriSP.jQuery("<link>", {
+            rel : "stylesheet",
+            type : "text/css",
+            href : _cssFile
+        }).appendTo('head');
+        IriSP._cssCache.push(_cssFile);
+    }
+}
+
+IriSP.log = function() {
+    if (typeof console !== "undefined" && typeof IriSP.logging !== "undefined" && IriSP.logging) {
+        console.log.apply(console, arguments);
+    }
+}
diff -r 10233337f6da -r 6a04bd37da0a src/widgets/CreateAnnotation.js
--- a/src/widgets/CreateAnnotation.js	Mon May 07 15:25:52 2012 +0200
+++ b/src/widgets/CreateAnnotation.js	Thu May 10 18:48:09 2012 +0200
@@ -102,10 +102,14 @@
     + ' <span class="Ldt-CreateAnnotation-Times">{{#single_time_mode}}{{l10n.at_time}}{{/single_time_mode}}'
     + '{{^single_time_mode}}{{l10n.from_time}}{{/single_time_mode}} <span class="Ldt-CreateAnnotation-Begin"></span>'
     + ' {{^single_time_mode}}{{l10n.to_time}} <span class="Ldt-CreateAnnotation-End"></span>{{/single_time_mode}}</span></h3>'
-    + ''
+    + '<textarea class="Ldt-CreateAnnotation-Description" placeholder="{{type_description}}"></textarea>'
+    + '<input type="submit" class="Ldt-CreateAnnotation-Submit" />'
+    + '</form>'
+    + '</div></div>';
     
-    + '</form>'
-    + '</div></div>'
+IriSP.Widgets.CreateAnnotation.prototype.draw = function() {
+    this.renderTemplate();
+}
     
 /*    
     + '        <div class="Ldt-CreateAnnotation-Screen Ldt-createAnnotation-startScreen">'
diff -r 10233337f6da -r 6a04bd37da0a src/widgets/Slider.js
--- a/src/widgets/Slider.js	Mon May 07 15:25:52 2012 +0200
+++ b/src/widgets/Slider.js	Thu May 10 18:48:09 2012 +0200
@@ -31,9 +31,9 @@
         range: "min",
         value: 0,
         min: 0,
-        max: this.source.getDuration().getSeconds(),
+        max: this.source.getDuration().milliseconds,
         slide: function(event, ui) {
-            _this.player.popcorn.currentTime(ui.value);
+            _this.player.popcorn.currentTime(ui.value / 1000);
             _this.player.popcorn.trigger("IriSP.Mediafragment.setHashToTime");
         }
     });
@@ -51,9 +51,9 @@
 };
 
 IriSP.Widgets.Slider.prototype.onTimeupdate = function() {
-    var _time = this.player.popcorn.currentTime();
+    var _time = 1000 * this.player.popcorn.currentTime();
     this.$slider.slider("value",_time);
-    this.player.popcorn.trigger("IriSP.Arrow.updatePosition",{widget: this.type, time: 1000 * _time});
+    this.player.popcorn.trigger("IriSP.Arrow.updatePosition",{widget: this.type, time: _time});
 }
 
 IriSP.Widgets.Slider.prototype.onMouseover = function() {
diff -r 10233337f6da -r 6a04bd37da0a src/widgets/Trace.js
--- a/src/widgets/Trace.js	Mon May 07 15:25:52 2012 +0200
+++ b/src/widgets/Trace.js	Thu May 10 18:48:09 2012 +0200
@@ -55,7 +55,6 @@
         requestmode: this.requestmode,
         syncmode: this.syncmode
     });
-    this.tracer.set_default_subject("metadataplayer");
     this.tracer.trace("StartTracing", {});
     
     this.mouseLocation = '';
diff -r 10233337f6da -r 6a04bd37da0a test/dailymotion.htm
--- a/test/dailymotion.htm	Mon May 07 15:25:52 2012 +0200
+++ b/test/dailymotion.htm	Thu May 10 18:48:09 2012 +0200
@@ -5,7 +5,7 @@
         <title>Metadataplayer test with Dailymotion</title>
         <link href='http://fonts.googleapis.com/css?family=Open+Sans:400,700,400italic,700italic' rel='stylesheet' type='text/css'>
         <link href='test.css' rel='stylesheet' type='text/css'>
-        <script type="text/javascript" src="../build/LdtPlayer-core.js" type="text/javascript"></script>
+        <script type="text/javascript" src="metadataplayer/LdtPlayer-core.js" type="text/javascript"></script>
         <script type="text/javascript" src="test-config.js" type="text/javascript"></script>
     </head>
 
diff -r 10233337f6da -r 6a04bd37da0a test/index.htm
--- a/test/index.htm	Mon May 07 15:25:52 2012 +0200
+++ b/test/index.htm	Thu May 10 18:48:09 2012 +0200
@@ -5,7 +5,7 @@
         <title>Metadataplayer test configurations</title>
         <link href='http://fonts.googleapis.com/css?family=Open+Sans:400,700,400italic,700italic' rel='stylesheet' type='text/css'>
         <link href='test.css' rel='stylesheet' type='text/css'>
-        <script type="text/javascript" src="../build/LdtPlayer-core.js" type="text/javascript"></script>
+        <script type="text/javascript" src="metadataplayer/LdtPlayer-core.js" type="text/javascript"></script>
         <script type="text/javascript" src="test-config.js" type="text/javascript"></script>
     </head>
 
@@ -13,6 +13,7 @@
         <h1>Metadataplayer test configurations</h1>
         <ul class="pageindex">
             <li><h2><a href="jwplayer.htm">with JwPlayer (default on Ldt Platform, uses custom player functions)</a></h2></li>
+            <li><h2><a href="oggvideo.htm">with HTML5/OGG (uses Popcorn.js)</a></h2></li>
             <li><h2><a href="youtube.htm">with Youtube (uses Popcorn.js and the Popcorn Youtube plugin/player)</a></h2></li>
             <li><h2><a href="dailymotion.htm">with Dailymotion (uses custom player functions)</a></h2></li>
         </ul>
diff -r 10233337f6da -r 6a04bd37da0a test/json/ldt-ogv.json
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/test/json/ldt-ogv.json	Thu May 10 18:48:09 2012 +0200
@@ -0,0 +1,262 @@
+{
+    "views": [],
+    "tags": [],
+    "lists": [],
+    "medias": [
+        {
+            "origin": "0",
+            "url": "trailer.ogv",
+            "http://advene.liris.cnrs.fr/ns/frame_of_reference/ms": "o=0",
+            "meta": {
+                "dc:contributor": "IRI",
+                "item": {
+                    "name": "streamer",
+                    "value": "rtmp://media.iri.centrepompidou.fr/ddc_player/"
+                },
+                "dc:created": "2011-02-14T15:06:34.829919",
+                "dc:duration": 87000,
+                "dc:creator": "IRI",
+                "dc:created.contents": "2012-02-13",
+                "dc:title": "RSLN Clay Shirky",
+                "dc:creator.contents": "IRI",
+                "dc:modified": "2012-02-13T11:55:23.898905",
+                "dc:description": "RSLN Clay Shirky"
+            },
+            "id": "9a493932-3053-11e0-862b-00145ea49a02",
+            "unit": "ms"
+        }
+    ],
+    "meta": {
+        "dc:contributor": "admin",
+        "dc:created": "2011-02-14T15:15:52.602502",
+        "dc:creator": "admin",
+        "main_media": {
+            "id-ref": "9a493932-3053-11e0-862b-00145ea49a02"
+        },
+        "dc:description": "",
+        "dc:title": "RSLN Clay Shirky - Tweets",
+        "id": "13b0aa52-336b-11e0-b233-00145ea49a02",
+        "dc:modified": "2012-04-29T15:41:55.858453"
+    },
+    "annotations": [
+        {
+            "content": {
+                "mimetype": "application/x-ldt-structured",
+                "description": "",
+                "img": {
+                    "src": ""
+                },
+                "title": "Introduction",
+                "color": "3355443",
+                "polemics": [],
+                "audio": {
+                    "mimetype": "audio/mp3",
+                    "src": "",
+                    "href": null
+                }
+            },
+            "begin": 0,
+            "meta": {
+                "dc:contributor": "perso",
+                "id-ref": "c_E0FF6CF0-B8E9-8432-8B92-293EFFFFA827",
+                "dc:created": "2012-05-07T10:11:06.721324",
+                "dc:modified": "2012-05-07T10:11:06.721324",
+                "dc:creator": "perso"
+            },
+            "end": 87000,
+            "tags": null,
+            "color": "3355443",
+            "media": "9a493932-3053-11e0-862b-00145ea49a02",
+            "id": "s_294BB166-E5EE-4FCC-309B-293F3C4D5BD3"
+        }, {
+            "content": {
+                "mimetype": "application/x-ldt-structured",
+                "description": "#rsln commence 8h50",
+                "img": {
+                    "src": ""
+                },
+                "title": "tibo c: #rsln commence 8h50",
+                "color": "16763904",
+                "polemics": [],
+                "audio": {
+                    "mimetype": "audio/mp3",
+                    "src": "",
+                    "href": null
+                }
+            },
+            "begin": 0,
+            "meta": {
+                "dc:contributor": "perso",
+                "dc:source": {
+                    "mimetype": "application/json",
+                    "url": "http://dev.twitter.com",
+                    "content": "{\"favorited\": false, \"contributors\": null, \"entities\": {\"user_mentions\": [], \"hashtags\": [{\"indices\": [0, 5], \"text\": \"rsln\"}], \"urls\": []}, \"text\": \"#rsln commence 8h50\", \"created_at\": \"Mon Jan 31 07:50:56 +0000 2011\", \"truncated\": false, \"retweeted\": false, \"in_reply_to_status_id_str\": null, \"coordinates\": null, \"in_reply_to_user_id_str\": null, \"source\": \"<a href=\\\"http://www.echofon.com/\\\" rel=\\\"nofollow\\\">Echofon</a>\", \"in_reply_to_status_id\": null, \"in_reply_to_screen_name\": null, \"user\": {\"follow_request_sent\": null, \"profile_use_background_image\": true, \"id\": 226510471, \"verified\": false, \"profile_sidebar_fill_color\": \"DDEEF6\", \"is_translator\": false, \"profile_text_color\": \"333333\", \"followers_count\": 4, \"protected\": false, \"id_str\": \"226510471\", \"profile_background_color\": \"C0DEED\", \"location\": null, \"utc_offset\": 3600, \"statuses_count\": 26, \"description\": null, \"friends_count\": 12, \"profile_link_color\": \"0084B4\", \"profile_image_url\": \"http://a1.twimg.com/a/1294785484/images/default_profile_5_normal.png\", \"notifications\": null, \"show_all_inline_media\": false, \"geo_enabled\": false, \"profile_background_image_url\": \"http://a3.twimg.com/a/1294785484/images/themes/theme1/bg.png\", \"name\": \"tibo c\", \"lang\": \"fr\", \"profile_background_tile\": false, \"favourites_count\": 1, \"screen_name\": \"tibo_c\", \"url\": null, \"created_at\": \"Tue Dec 14 10:17:02 +0000 2010\", \"contributors_enabled\": false, \"time_zone\": \"Paris\", \"profile_sidebar_border_color\": \"C0DEED\", \"following\": null, \"listed_count\": 0}, \"id\": 31982750655324160, \"place\": null, \"retweet_count\": 0, \"geo\": null, \"id_str\": \"31982750655324160\", \"in_reply_to_user_id\": null}"
+                },
+                "dc:creator": "perso",
+                "id-ref": "16b010ab-9050-4d8d-8082-3803031b0499",
+                "dc:created": "2012-05-07T10:11:06.746777",
+                "dc:modified": "2012-05-07T10:11:06.746777"
+            },
+            "end": 0,
+            "tags": null,
+            "color": "16763904",
+            "media": "9a493932-3053-11e0-862b-00145ea49a02",
+            "id": "6906130e-0391-4dd4-8ad2-a1f5e6e303da-31982750655324160"
+        }, {
+            "content": {
+                "mimetype": "application/x-ldt-structured",
+                "description": "A la conference de @cshirky chez microsoft #RSLN sur le cognitive surplus. Ca va forcemt deborder sur le net et revoltes en Af. du nord",
+                "img": {
+                    "src": ""
+                },
+                "title": "Stanm: A la conference de @cshirky chez microsoft #RSLN sur le cognitive surplus. Ca va forcemt deborder sur le net et revoltes en Af. du nord",
+                "color": "16763904",
+                "polemics": [],
+                "audio": {
+                    "mimetype": "audio/mp3",
+                    "src": "",
+                    "href": null
+                }
+            },
+            "begin": 7000,
+            "meta": {
+                "dc:contributor": "perso",
+                "dc:source": {
+                    "mimetype": "application/json",
+                    "url": "http://dev.twitter.com",
+                    "content": "{\"favorited\": false, \"contributors\": null, \"entities\": {\"user_mentions\": [{\"indices\": [19, 27], \"id\": 6141832, \"screen_name\": \"cshirky\", \"name\": \"Clay Shirky\", \"id_str\": \"6141832\"}], \"hashtags\": [{\"indices\": [43, 48], \"text\": \"RSLN\"}], \"urls\": []}, \"text\": \"A la conference de @cshirky chez microsoft #RSLN sur le cognitive surplus. Ca va forcemt deborder sur le net et revoltes en Af. du nord\", \"created_at\": \"Mon Jan 31 07:51:03 +0000 2011\", \"truncated\": false, \"retweeted\": false, \"in_reply_to_status_id_str\": null, \"coordinates\": null, \"in_reply_to_user_id_str\": null, \"source\": \"<a href=\\\"http://www.tweetdeck.com\\\" rel=\\\"nofollow\\\">TweetDeck</a>\", \"in_reply_to_status_id\": null, \"in_reply_to_screen_name\": null, \"user\": {\"follow_request_sent\": null, \"profile_use_background_image\": true, \"id\": 7937452, \"verified\": false, \"profile_sidebar_fill_color\": \"e0ff92\", \"is_translator\": false, \"profile_text_color\": \"000000\", \"followers_count\": 537, \"protected\": false, \"id_str\": \"7937452\", \"profile_background_color\": \"9ae4e8\", \"listed_count\": 40, \"utc_offset\": 3600, \"statuses_count\": 903, \"description\": \"Social Media Analyst, Politigeek (netpolitique.net)\", \"friends_count\": 224, \"location\": \"Paris\", \"profile_link_color\": \"0000ff\", \"profile_image_url\": \"http://a2.twimg.com/profile_images/27737392/stansp2_normal.jpg\", \"notifications\": null, \"show_all_inline_media\": false, \"geo_enabled\": false, \"profile_background_image_url\": \"http://a3.twimg.com/a/1296173346/images/themes/theme1/bg.png\", \"name\": \"Stanm\", \"lang\": \"en\", \"profile_background_tile\": false, \"favourites_count\": 3, \"screen_name\": \"Stanm\", \"url\": null, \"created_at\": \"Fri Aug 03 17:51:17 +0000 2007\", \"contributors_enabled\": false, \"time_zone\": \"Paris\", \"profile_sidebar_border_color\": \"87bc44\", \"following\": null}, \"id\": 31982778090258432, \"place\": null, \"retweet_count\": 0, \"geo\": null, \"id_str\": \"31982778090258432\", \"in_reply_to_user_id\": null}"
+                },
+                "dc:creator": "perso",
+                "id-ref": "16b010ab-9050-4d8d-8082-3803031b0499",
+                "dc:created": "2012-05-07T10:11:06.746777",
+                "dc:modified": "2012-05-07T10:11:06.746777"
+            },
+            "end": 7000,
+            "tags": null,
+            "color": "16763904",
+            "media": "9a493932-3053-11e0-862b-00145ea49a02",
+            "id": "184cc091-a2d1-4c7d-bd0e-dad39c96d0f5-31982778090258432"
+        }, {
+            "content": {
+                "mimetype": "application/x-ldt-structured",
+                "description": "Brain breakfast chez Microsoft pour écouter Clay Shirky #rsln",
+                "img": {
+                    "src": ""
+                },
+                "title": "pepommier: Brain breakfast chez Microsoft pour écouter Clay Shirky #rsln",
+                "color": "16763904",
+                "polemics": [],
+                "audio": {
+                    "mimetype": "audio/mp3",
+                    "src": "",
+                    "href": null
+                }
+            },
+            "begin": 42000,
+            "meta": {
+                "dc:contributor": "perso",
+                "dc:source": {
+                    "mimetype": "application/json",
+                    "url": "http://dev.twitter.com",
+                    "content": "{\"favorited\": false, \"contributors\": null, \"entities\": {\"user_mentions\": [], \"hashtags\": [{\"indices\": [56, 61], \"text\": \"rsln\"}], \"urls\": []}, \"text\": \"Brain breakfast chez Microsoft pour \\u00e9couter Clay Shirky #rsln\", \"created_at\": \"Mon Jan 31 07:51:38 +0000 2011\", \"truncated\": false, \"retweeted\": false, \"in_reply_to_status_id_str\": null, \"coordinates\": {\"type\": \"Point\", \"coordinates\": [2.26552971, 48.834260710000002]}, \"in_reply_to_user_id_str\": null, \"source\": \"<a href=\\\"http://twitter.com/\\\" rel=\\\"nofollow\\\">Twitter for iPhone</a>\", \"in_reply_to_status_id\": null, \"in_reply_to_screen_name\": null, \"user\": {\"follow_request_sent\": null, \"profile_use_background_image\": true, \"id\": 7013462, \"verified\": false, \"profile_sidebar_fill_color\": \"7C8A8A\", \"is_translator\": false, \"profile_text_color\": \"000000\", \"followers_count\": 341, \"protected\": false, \"id_str\": \"7013462\", \"profile_background_color\": \"FFFFFF\", \"location\": \"Paris\", \"utc_offset\": -7200, \"statuses_count\": 278, \"description\": \"video web producer\", \"friends_count\": 138, \"profile_link_color\": \"1BBCE4\", \"profile_image_url\": \"http://a1.twimg.com/profile_images/1215645558/161264_536940419_386416_n_normal.jpg\", \"notifications\": null, \"show_all_inline_media\": false, \"geo_enabled\": true, \"profile_background_image_url\": \"http://a2.twimg.com/profile_background_images/308222/Nightscape-6.jpg\", \"name\": \"pepommier\", \"lang\": \"en\", \"profile_background_tile\": false, \"favourites_count\": 7, \"screen_name\": \"pepommier\", \"url\": \"http://bubble-prod.com\", \"created_at\": \"Fri Jun 22 12:32:06 +0000 2007\", \"contributors_enabled\": false, \"time_zone\": \"Mid-Atlantic\", \"profile_sidebar_border_color\": \"3F484E\", \"following\": null, \"listed_count\": 18}, \"id\": 31982927600422912, \"place\": {\"full_name\": \"Issy-les-Moulineaux, Paris\", \"name\": \"Issy-les-Moulineaux\", \"url\": \"http://api.twitter.com/1/geo/id/8d83cfde2e5ab759.json\", \"country\": \"France\", \"place_type\": \"neighborhood\", \"bounding_box\": {\"type\": \"Polygon\", \"coordinates\": [[[2.2484109999999999, 48.814176000000003], [2.2882250000000002, 48.814176000000003], [2.2882250000000002, 48.836477000000002], [2.2484109999999999, 48.836477000000002]]]}, \"country_code\": \"FR\", \"attributes\": {}, \"id\": \"8d83cfde2e5ab759\"}, \"retweet_count\": 0, \"geo\": {\"type\": \"Point\", \"coordinates\": [48.834260710000002, 2.26552971]}, \"id_str\": \"31982927600422912\", \"in_reply_to_user_id\": null}"
+                },
+                "dc:creator": "perso",
+                "id-ref": "16b010ab-9050-4d8d-8082-3803031b0499",
+                "dc:created": "2012-05-07T10:11:06.746777",
+                "dc:modified": "2012-05-07T10:11:06.746777"
+            },
+            "end": 42000,
+            "tags": null,
+            "color": "16763904",
+            "media": "9a493932-3053-11e0-862b-00145ea49a02",
+            "id": "da9b8e9a-b93e-4b07-8259-226acf8ccd9e-31982927600422912"
+        }, {
+            "content": {
+                "mimetype": "application/x-ldt-structured",
+                "description": "#RSLN avec les twittpics, on peut deviner où sont les gens ... marrant !",
+                "img": {
+                    "src": ""
+                },
+                "title": "Cyrille Fonvielle: #RSLN avec les twittpics, on peut deviner où sont les gens ... marrant !",
+                "color": "16763904",
+                "polemics": [],
+                "audio": {
+                    "mimetype": "audio/mp3",
+                    "src": "",
+                    "href": null
+                }
+            },
+            "begin": 55000,
+            "meta": {
+                "dc:contributor": "perso",
+                "dc:source": {
+                    "mimetype": "application/json",
+                    "url": "http://dev.twitter.com",
+                    "content": "{\"favorited\": false, \"contributors\": null, \"entities\": {\"user_mentions\": [], \"hashtags\": [{\"indices\": [0, 5], \"text\": \"RSLN\"}], \"urls\": []}, \"text\": \"#RSLN avec les twittpics, on peut deviner o\\u00f9 sont les gens ... marrant !\", \"created_at\": \"Mon Jan 31 07:51:51 +0000 2011\", \"truncated\": false, \"retweeted\": false, \"in_reply_to_status_id_str\": null, \"coordinates\": null, \"in_reply_to_user_id_str\": null, \"source\": \"<a href=\\\"http://seesmic.com/seesmic_desktop/sd2\\\" rel=\\\"nofollow\\\">Seesmic Desktop</a>\", \"in_reply_to_status_id\": null, \"in_reply_to_screen_name\": null, \"user\": {\"follow_request_sent\": null, \"profile_use_background_image\": true, \"id\": 36027828, \"verified\": false, \"profile_sidebar_fill_color\": \"DDEEF6\", \"is_translator\": false, \"profile_text_color\": \"333333\", \"followers_count\": 116, \"protected\": false, \"id_str\": \"36027828\", \"profile_background_color\": \"C0DEED\", \"listed_count\": 13, \"utc_offset\": 3600, \"statuses_count\": 864, \"description\": \"\", \"friends_count\": 107, \"location\": \"\", \"profile_link_color\": \"0084B4\", \"profile_image_url\": \"http://a2.twimg.com/profile_images/1118444241/Photo_14_normal.jpg\", \"notifications\": null, \"show_all_inline_media\": false, \"geo_enabled\": false, \"profile_background_image_url\": \"http://a3.twimg.com/a/1296179758/images/themes/theme1/bg.png\", \"name\": \"Cyrille Fonvielle\", \"lang\": \"fr\", \"profile_background_tile\": false, \"favourites_count\": 0, \"screen_name\": \"CyrilleF\", \"url\": \"http://www.cyrillef.fr\", \"created_at\": \"Tue Apr 28 09:27:21 +0000 2009\", \"contributors_enabled\": false, \"time_zone\": \"Paris\", \"profile_sidebar_border_color\": \"C0DEED\", \"following\": null}, \"id\": 31982982155739136, \"place\": null, \"retweet_count\": 0, \"geo\": null, \"id_str\": \"31982982155739136\", \"in_reply_to_user_id\": null}"
+                },
+                "dc:creator": "perso",
+                "id-ref": "16b010ab-9050-4d8d-8082-3803031b0499",
+                "dc:created": "2012-05-07T10:11:06.746777",
+                "dc:modified": "2012-05-07T10:11:06.746777"
+            },
+            "end": 55000,
+            "tags": null,
+            "color": "16763904",
+            "media": "9a493932-3053-11e0-862b-00145ea49a02",
+            "id": "7588026a-1e1d-46d3-91b7-3e94dd8913fa-31982982155739136"
+        }, {
+            "content": {
+                "mimetype": "application/x-ldt-structured",
+                "description": "Pour la rencontre #RSLN, pensez à noter vos tweets avec ++, ==, --, ??. nous expérimentons avec l'IRI une analyse des tweets. Thx !",
+                "img": {
+                    "src": ""
+                },
+                "title": "NicolasVanbremeersch: Pour la rencontre #RSLN, pensez à noter vos tweets avec ++, ==, --, ??. nous expérimentons avec l'IRI une analyse des tweets. Thx !",
+                "color": "16763904",
+                "polemics": ["Q", "REF", "OK", "KO"],
+                "audio": {
+                    "mimetype": "audio/mp3",
+                    "src": "",
+                    "href": null
+                }
+            },
+            "begin": 62000,
+            "meta": {
+                "dc:contributor": "perso",
+                "dc:source": {
+                    "mimetype": "application/json",
+                    "url": "http://dev.twitter.com",
+                    "content": "{\"favorited\": false, \"contributors\": null, \"entities\": {\"user_mentions\": [], \"hashtags\": [{\"indices\": [18, 23], \"text\": \"RSLN\"}], \"urls\": []}, \"text\": \"Pour la rencontre #RSLN, pensez \\u00e0 noter vos tweets avec ++, ==, --, ??. nous exp\\u00e9rimentons avec l'IRI une analyse des tweets. Thx !\", \"created_at\": \"Mon Jan 31 07:51:58 +0000 2011\", \"truncated\": false, \"retweeted\": false, \"in_reply_to_status_id_str\": null, \"coordinates\": null, \"in_reply_to_user_id_str\": null, \"source\": \"<a href=\\\"http://www.tweetdeck.com\\\" rel=\\\"nofollow\\\">TweetDeck</a>\", \"in_reply_to_status_id\": null, \"in_reply_to_screen_name\": null, \"user\": {\"follow_request_sent\": null, \"profile_use_background_image\": true, \"id\": 6284172, \"verified\": false, \"profile_sidebar_fill_color\": \"ffe224\", \"is_translator\": false, \"profile_text_color\": \"333333\", \"followers_count\": 32316, \"protected\": false, \"id_str\": \"6284172\", \"profile_background_color\": \"8c8c8c\", \"listed_count\": 586, \"utc_offset\": 3600, \"statuses_count\": 6849, \"description\": \"I believe in prolonged adolescence. Jay McInerney.\", \"friends_count\": 844, \"location\": \"Paris\", \"profile_link_color\": \"056385\", \"profile_image_url\": \"http://a3.twimg.com/profile_images/1212628880/42196_normal.jpg\", \"notifications\": null, \"show_all_inline_media\": false, \"geo_enabled\": false, \"profile_background_image_url\": \"http://a3.twimg.com/profile_background_images/168728872/door.jpg\", \"name\": \"NicolasVanbremeersch\", \"lang\": \"fr\", \"profile_background_tile\": true, \"favourites_count\": 1, \"screen_name\": \"versac\", \"url\": \"http://www.spintank.fr\", \"created_at\": \"Thu May 24 10:14:27 +0000 2007\", \"contributors_enabled\": false, \"time_zone\": \"Paris\", \"profile_sidebar_border_color\": \"757575\", \"following\": null}, \"id\": 31983008105897984, \"place\": null, \"retweet_count\": 0, \"geo\": null, \"id_str\": \"31983008105897984\", \"in_reply_to_user_id\": null}"
+                },
+                "dc:creator": "perso",
+                "id-ref": "16b010ab-9050-4d8d-8082-3803031b0499",
+                "dc:created": "2012-05-07T10:11:06.746777",
+                "dc:modified": "2012-05-07T10:11:06.746777"
+            },
+            "end": 62000,
+            "tags": null,
+            "color": "16763904",
+            "media": "9a493932-3053-11e0-862b-00145ea49a02",
+            "id": "a4dbb580-2c1d-4089-9e91-c65d3e71a1e3-31983008105897984"
+        }
+    ],
+    "annotation-types": [
+        {
+            "dc:contributor": "perso",
+            "dc:creator": "perso",
+            "dc:title": "chapitrage",
+            "id": "c_E0FF6CF0-B8E9-8432-8B92-293EFFFFA827",
+            "dc:created": "2012-05-07T10:11:06.721324",
+            "dc:description": "",
+            "dc:modified": "2012-05-07T10:11:06.721324"
+        }, {
+            "dc:contributor": "perso",
+            "dc:creator": "perso",
+            "dc:title": "Tweets",
+            "id": "16b010ab-9050-4d8d-8082-3803031b0499",
+            "dc:created": "2012-05-07T10:11:06.746777",
+            "dc:description": "Tweets",
+            "dc:modified": "2012-05-07T10:11:06.746777"
+        }
+    ]
+}
\ No newline at end of file
diff -r 10233337f6da -r 6a04bd37da0a test/jwplayer.htm
--- a/test/jwplayer.htm	Mon May 07 15:25:52 2012 +0200
+++ b/test/jwplayer.htm	Thu May 10 18:48:09 2012 +0200
@@ -5,7 +5,7 @@
         <title>Metadataplayer test with JwPlayer</title>
         <link href='http://fonts.googleapis.com/css?family=Open+Sans:400,700,400italic,700italic' rel='stylesheet' type='text/css'>
         <link href='test.css' rel='stylesheet' type='text/css'>
-        <script type="text/javascript" src="../build/LdtPlayer-core.js" type="text/javascript"></script>
+        <script type="text/javascript" src="metadataplayer/LdtPlayer-core.js" type="text/javascript"></script>
         <script type="text/javascript" src="test-config.js" type="text/javascript"></script>
     </head>
 
diff -r 10233337f6da -r 6a04bd37da0a test/mashup/img/background.png
Binary file test/mashup/img/background.png has changed
diff -r 10233337f6da -r 6a04bd37da0a test/mashup/img/barbg.png
Binary file test/mashup/img/barbg.png has changed
diff -r 10233337f6da -r 6a04bd37da0a test/mashup/img/mashupbar.png
Binary file test/mashup/img/mashupbar.png has changed
diff -r 10233337f6da -r 6a04bd37da0a test/mashup/img/title.png
Binary file test/mashup/img/title.png has changed
diff -r 10233337f6da -r 6a04bd37da0a test/mashup/player.htm
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/test/mashup/player.htm	Thu May 10 18:48:09 2012 +0200
@@ -0,0 +1,46 @@
+<!doctype html>
+<html>
+    <head>
+        <title>Preuve de concept Mashup</title>
+        <link rel="stylesheet" type="text/css" href="style.css" />
+        <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
+    </head>
+    <body>
+        <div class="main-container">
+            <div class="header">
+                <h1>Hash Cut #</h1>
+            </div>
+            <div class="steps">
+                <h2>Créer un Hash-cut en 3 étapes&nbsp;:</h2>
+                <div class="steps-frame">
+                    <div class="step">
+                        <div class="step-icon step-1"></div>
+                        <div class="step-title">S'inscrire et<br />créer un projet</div>
+                    </div>
+                    <div class="step-separator"></div>
+                    <div class="step">
+                        <div class="step-icon step-2"></div>
+                        <div class="step-title">Découper et<br />Assembler</div>
+                    </div>
+                    <div class="step-separator"></div>
+                    <div class="step active">
+                        <div class="step-icon step-3"></div>
+                        <div class="step-title">Partager et<br />regarder&nbsp;!</div>
+                    </div>
+                </div>
+            </div>
+            <div class="colgauche">
+                <h2>Mon HashCut</h2>
+                <hr />
+            </div>
+            <div class="coldroite">
+                <h2>Média en cours</h2>
+                <hr />
+            </div>
+            <div class="footer">
+                <hr />
+                <p style="text-align: right;">&copy; IRI 2012</p>
+            </div>
+        </div>
+    </body>
+</html>
\ No newline at end of file
diff -r 10233337f6da -r 6a04bd37da0a test/mashup/style.css
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/test/mashup/style.css	Thu May 10 18:48:09 2012 +0200
@@ -0,0 +1,105 @@
+html, body, div, span, applet, object, iframe,
+h1, h2, h3, h4, h5, h6, p, blockquote, pre,
+a, abbr, acronym, address, big, cite, code,
+del, dfn, em, img, ins, kbd, q, s, samp,
+small, strike, strong, sub, sup, tt, var,
+b, u, i, center,
+dl, dt, dd, ol, ul, li,
+fieldset, form, label, legend,
+table, caption, tbody, tfoot, thead, tr, th, td,
+article, aside, canvas, details, embed, 
+figure, figcaption, footer, header, hgroup, 
+menu, nav, output, ruby, section, summary,
+time, mark, audio, video {
+    margin: 0;
+    padding: 0;
+    border: 0;
+    font-size: 100%;
+    font: inherit;
+    vertical-align: baseline;
+}
+
+img a {
+    border: none;
+}
+
+body {
+    background: url(img/background.png) repeat-x top #f8f6f7;
+    font-family: 'DIN-Regular', Helvetica, Arial, sans-serif;
+}
+
+.main-container {
+    width: 960px; margin: 0 auto;
+}
+
+h1 {
+    width: 141px; height: 83px; text-indent: -999px; background: url(img/title.png);
+}
+
+h2 {
+    color: #30036d; margin: 5px 0 2px; font-size: 18px; font-weight: bold;
+}
+
+hr {
+    width: 100%; border: none; margin: 2px 0; background: #666666; height: 1px;
+}
+
+.steps-frame {
+    width: 960px; height: 70px; border-style: solid none; border-width: 1px; border-color: #666666; clear: both; background: url(img/barbg.png) #ffffff;
+}
+
+.step {
+    width: 256px; height: 70px; float: left;
+}
+
+.step-separator {
+    width: 96px; height: 70px; float: left; background: url(img/mashupbar.png);
+}
+
+.step-icon {
+    margin: 0 5px; height: 70px; float: left; background: url(img/mashupbar.png);
+}
+
+.step-1 {
+    background-position: -100px -70px; width: 58px;
+}
+
+.active .step-1, .step:hover .step-1 {
+    background-position: -100px 0; width: 58px;
+}
+
+.step-2 {
+    background-position: -159px -70px; width: 96px;
+}
+
+.active .step-2, .step:hover .step-2 {
+    background-position: -159px 0; width: 96px;
+}
+
+.step-3 {
+    background-position: -255px -70px; width: 115px;
+}
+
+.active .step-3, .step:hover .step-3 {
+    background-position: -255px 0; width: 115px;
+}
+
+.step-title {
+    margin: 5px 0; font-size: 18px; font-weight: bold; color: #808080;
+}
+
+.active .step-title, .step:hover .step-title {
+    color: #30036d;
+}
+
+.colgauche {
+    float: left; width: 630px; margin: 5px 10px 5px 0;
+}
+
+.coldroite {
+    float: left; width: 310px; margin: 5px 0 5px 10px;
+}
+
+.footer {
+    width: 100%; clear: both;
+}
diff -r 10233337f6da -r 6a04bd37da0a test/oggvideo.htm
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/test/oggvideo.htm	Thu May 10 18:48:09 2012 +0200
@@ -0,0 +1,20 @@
+<!doctype html>
+<html>
+
+    <head>
+        <title>Metadataplayer test with HTML5 / OGG Video</title>
+        <link href='http://fonts.googleapis.com/css?family=Open+Sans:400,700,400italic,700italic' rel='stylesheet' type='text/css'>
+        <link href='test.css' rel='stylesheet' type='text/css'>
+        <script type="text/javascript" src="metadataplayer/LdtPlayer-core.js" type="text/javascript"></script>
+        <script type="text/javascript" src="test-config.js" type="text/javascript"></script>
+    </head>
+
+    <body>
+        <h1>Metadataplayer test with HTML5 / OGG Video</h1>
+        <div id="LdtPlayer"></div>
+        <div id="AnnotationsListContainer"></div>
+        <script type="text/javascript">
+            testConfig('json/ldt-ogv.json', true);
+        </script>
+    </body>
+</html>
diff -r 10233337f6da -r 6a04bd37da0a test/test-config.js
--- a/test/test-config.js	Mon May 07 15:25:52 2012 +0200
+++ b/test/test-config.js	Thu May 10 18:48:09 2012 +0200
@@ -1,4 +1,5 @@
 function testConfig(_urlMetadata, _useLocalBuild) {
+    document.getElementById('LdtPlayer').innerHTML = '';
     _useLocalBuild = (typeof _useLocalBuild !== "undefined" && _useLocalBuild)
     IriSP.libFiles.defaultDir = _useLocalBuild ? "libs/" : "../src/js/libs/";
     IriSP.widgetsDir = _useLocalBuild ? "metadataplayer" : "../src/widgets";
@@ -42,4 +43,4 @@
     };
     
     return new IriSP.Metadataplayer(_config, _metadata);
-}
+}
\ No newline at end of file