Binary file crea/integration/img/phylactere.png has changed

--- a/crea/integration/metadataplayer/MusitagAnnotations.css	Thu May 31 18:10:27 2012 +0200
+++ b/crea/integration/metadataplayer/MusitagAnnotations.css	Fri Jun 01 11:34:56 2012 +0200
@@ -4,46 +4,56 @@
 }
 
 .Musitag-Annotations-tag {
-    margin: 8px 0 0;
+    margin: 8px 0 0; position: relative;
 }
 
-.Musitag-Annotations-tag:first-child {
+.Musitag-Annotations-Balloon {
+    position: absolute; background: url(../img/phylactere.png);
+    width: 66px; height: 45px; top: 8px; left: 30px;
+    z-index: 25; display: none; cursor: pointer;
+}
+
+.Musitag-Annotations-Balloon:hover {
+    background-position: 0 -45px;
+}
+
+.Musitag-Annotations-tag:first-child .Musitag-container-50 {
     z-index: 20;
 }
 
-.Musitag-Annotations-tag:nth-child(2) {
+.Musitag-Annotations-tag:nth-child(2) .Musitag-container-50 {
     z-index: 19;
 }
 
-.Musitag-Annotations-tag:nth-child(3) {
+.Musitag-Annotations-tag:nth-child(3) .Musitag-container-50 {
     z-index: 18;
 }
 
-.Musitag-Annotations-tag:nth-child(4) {
+.Musitag-Annotations-tag:nth-child(4) .Musitag-container-50 {
     z-index: 17;
 }
 
-.Musitag-Annotations-tag:nth-child(5) {
+.Musitag-Annotations-tag:nth-child(5) .Musitag-container-50 {
     z-index: 16;
 }
 
-.Musitag-Annotations-tag:nth-child(6) {
+.Musitag-Annotations-tag:nth-child(6) .Musitag-container-50 {
     z-index: 15;
 }
 
-.Musitag-Annotations-tag:nth-child(7) {
+.Musitag-Annotations-tag:nth-child(7) .Musitag-container-50 {
     z-index: 14;
 }
 
-.Musitag-Annotations-tag:nth-child(8) {
+.Musitag-Annotations-tag:nth-child(8) .Musitag-container-50 {
     z-index: 13;
 }
 
-.Musitag-Annotations-tag:nth-child(9) {
+.Musitag-Annotations-tag:nth-child(9) .Musitag-container-50 {
     z-index: 12;
 }
 
-.Musitag-Annotations-tag:nth-child(10) {
+.Musitag-Annotations-tag:nth-child(10) .Musitag-container-50 {
     z-index: 11;
 }
 

--- a/crea/integration/metadataplayer/MusitagAnnotations.js	Thu May 31 18:10:27 2012 +0200
+++ b/crea/integration/metadataplayer/MusitagAnnotations.js	Fri Jun 01 11:34:56 2012 +0200
@@ -47,17 +47,23 @@
         }
         _html += '<div class="Musitag-Annotations-column">';
         _html += _column.map(function(_annotation) {
-            return '<div class="Musitag-container-50 Musitag-Annotations-tag" begin-time="' + _annotation.begin + '">'
-                   + '<div class="Musitag-shadow"></div>'
-                   + '<div class="Musitag-color Musitag-' + _annotation.color_tag + '"></div>'
-                   + '<div class="Musitag-emoticon Musitag-' + _annotation.emoticon_tag + '"></div>'
-                   + '</div>';
+            return '<div class="Musitag-Annotations-tag" begin-time="' + _annotation.begin + '">'
+                + '<div class="Musitag-container-50">'
+                + '<div class="Musitag-shadow"></div>'
+                + '<div class="Musitag-color Musitag-' + _annotation.color_tag + '"></div>'
+                + '<div class="Musitag-emoticon Musitag-' + _annotation.emoticon_tag + '"></div>'
+                + '</div><div class="Musitag-Annotations-Balloon"></div></div>';
         }).join('');
         _html += '</div>';
     }
     this.$.html(_html);
-    this.$.find('.Musitag-Annotations-tag').click(function() {
-        var _el = IriSP.jQuery(this);
+    this.$.find('.Musitag-Annotations-tag .Musitag-container-50').click(function() {
+        var _el = IriSP.jQuery(this).parent();
         _this.player.popcorn.currentTime(_el.attr("begin-time") / 1000);
     });
+    this.$.find('.Musitag-Annotations-tag').mouseover(function() {
+        var _el = IriSP.jQuery(this);
+        _this.$.find('.Musitag-Annotations-Balloon').hide();
+        _el.find('.Musitag-Annotations-Balloon').show();
+    });
 }
\ No newline at end of file