diff -r 7e5174fe9816 -r 5b7d7ab6baff web/res/metadataplayer/AnnotationsList.js
--- a/web/res/metadataplayer/AnnotationsList.js	Mon May 21 18:53:02 2012 +0200
+++ b/web/res/metadataplayer/AnnotationsList.js	Tue May 22 16:47:35 2012 +0200
@@ -6,6 +6,7 @@
     this.throttledRefresh = IriSP._.throttle(function() {
         _this.refresh(false);
     }, 1500);
+    this.mashupMode = (this.source.currentMedia.elementType === "mashup");
 };
 
 IriSP.Widgets.AnnotationsList.prototype = new IriSP.Widgets.Widget();
@@ -23,7 +24,6 @@
      * e.g. http://ldt.iri.centrepompidou.fr/ldtplatform/ldt/front/player/{{media}}/{{project}}/{{annotationType}}#id={{annotation}}
      */
     foreign_url : "",
-    cinecast_version : false,
     annotation_type : false,
     refresh_interval : 0,
     limit_count : 10,
@@ -34,7 +34,7 @@
     '<div class="Ldt-AnnotationsListWidget">'
     + '<ul class="Ldt-AnnotationsList-ul">'
     + '{{#annotations}}'
-    + '<li id="Ldt-Annotation-li-{{id}}" class="Ldt-AnnotationsList-li Ldt-TraceMe">'
+    + '<li class="Ldt-AnnotationsList-li Ldt-TraceMe" trace-info="annotation-id:{{id}}">'
     + '<div class="Ldt-AnnotationsList-ThumbContainer">'
     + '<a href="{{url}}">'
     + '<img class="Ldt-AnnotationsList-Thumbnail" src="{{thumbnail}}" />'
@@ -50,7 +50,7 @@
     + '{{#tags}}'
     + '{{#.}}'
     + '<li class="Ldt-AnnotationsList-Tag-Li">'
-    + '<div class="Ldt-AnnotationsList-Tag-Div">{{.}}</div>'
+    + '<span>{{.}}</span>'
     + '</li>'
     + '{{/.}}'
     + '{{/tags}}'
@@ -61,12 +61,6 @@
     + '</ul>'
     + '</div>';
 
-IriSP.Widgets.AnnotationsList.prototype.clear = function() {
-};
-
-IriSP.Widgets.AnnotationsList.prototype.clearWidget = function() {
-};
-
 IriSP.Widgets.AnnotationsList.prototype.onSearch = function(searchString) {
     this.searchString = typeof searchString !== "undefined" ? searchString : '';
     var _n = this.refresh(true);
@@ -99,6 +93,27 @@
     }, this.metadata));
 }
 
+IriSP.Widgets.AnnotationsList.prototype.ajaxMashup = function() {
+    var _currentTime = this.player.popcorn.currentTime();
+    if (typeof _currentTime == "undefined") {
+        _currentTime = 0;
+    }
+    var _currentAnnotation = this.source.currentMedia.getAnnotationAtTime(_currentTime * 1000);
+    if (typeof _currentAnnotation !== "undefined" && _currentAnnotation.namespacedId.name !== this.lastMashupAnnotation) {
+        this.lastMashupAnnotation = _currentAnnotation.namespacedId.name;
+        var _currentMedia = _currentAnnotation.getMedia(),
+            _url = Mustache.to_html(this.ajax_url, {
+                media : _currentMedia.namespacedId.name,
+                begin : Math.max(0, _currentAnnotation.annotation.begin.milliseconds - this.ajax_granularity),
+                end : Math.min(_currentMedia.duration.milliseconds, _currentAnnotation.annotation.end.milliseconds + this.ajax_granularity)
+            });
+        console.log("Getting", _url);
+        this.currentSource = this.player.loadMetadata(IriSP._.defaults({
+            "url" : _url
+        }, this.metadata));
+    }
+}
+
 IriSP.Widgets.AnnotationsList.prototype.refresh = function(_forceRedraw) {
     _forceRedraw = (typeof _forceRedraw !== "undefined" && _forceRedraw);
     if (this.currentSource.status !== IriSP.Model._SOURCE_STATUS_READY) {
@@ -109,7 +124,17 @@
     if (typeof _currentTime == "undefined") {
         _currentTime = 0;
     }
-    var _list = this.annotation_type ? this.currentSource.getAnnotationsByTypeTitle(this.annotation_type, true) : this.currentSource.getAnnotations();
+    var _list = this.annotation_type ? this.currentSource.getAnnotationsByTypeTitle(this.annotation_type) : this.currentSource.getAnnotations();
+    if (this.mashupMode) {
+        var _currentAnnotation = this.source.currentMedia.getAnnotationAtTime(_currentTime * 1000);
+        if (typeof _currentAnnotation !== "undefined") {
+            _currentTime = _currentTime - _currentAnnotation.begin.getSeconds() + _currentAnnotation.annotation.begin.getSeconds();
+            var _mediaId = _currentAnnotation.getMedia().namespacedId.name;
+            _list = _list.filter(function(_annotation) {
+                return _annotation.getMedia().namespacedId.name === _mediaId;
+            });
+        }
+    }
     if (this.searchString) {
         _list = _list.searchByTextFields(this.searchString);
     }
@@ -152,7 +177,7 @@
                             )
                     );
                     var _res = {
-                        id : _annotation.id,
+                        id : _annotation.namespacedId.name,
                         title : _annotation.title.replace(_annotation.description,''),
                         description : _annotation.description,
                         begin : _annotation.begin.toString(),
@@ -170,6 +195,14 @@
                 });
     
         this.$.html(_html);
+        
+        /* Correct the empty tag bug */
+        this.$.find('.Ldt-AnnotationsList-Tag-Li').each(function() {
+            var _el = IriSP.jQuery(this);
+            if (!_el.text().replace(/(^\s+|\s+$)/g,'')) {
+                _el.detach();
+            }
+        });
     
         this.$.find('.Ldt-AnnotationsList-Tag-Li').click(function() {
             _this.player.popcorn.trigger("IriSP.search.triggeredSearch", IriSP.jQuery(this).text().replace(/(^\s+|\s+$)/g,''));
@@ -184,9 +217,13 @@
         }
     }
     
-    if (this.ajax_url && this.ajax_granularity) {
-        if (Math.abs(_currentTime - this.lastAjaxQuery) > (this.ajax_granularity / 2000)) {
-            this.ajaxSource();
+    if (this.ajax_url) {
+        if (this.mashupMode) {
+            this.ajaxMashup();
+        } else {
+            if (Math.abs(_currentTime - this.lastAjaxQuery) > (this.ajax_granularity / 2000)) {
+                this.ajaxSource();
+            }
         }
     }
     return _list.length;
@@ -200,8 +237,12 @@
     
     var _this = this;
     
-    if (this.ajax_url && this.ajax_granularity) {
-        this.ajaxSource();
+    if (this.ajax_url) {
+        if (this.mashupMode) {
+            this.ajaxMashup();
+        } else {
+            this.ajaxSource();
+        }
     } else {
         this.currentSource = this.source;
     }