src/widgets/Annotation.js
branchnew-model
changeset 923 b3ee7d1b472a
parent 922 096c06aea8b5
child 924 64c2eaafe5e2
--- a/src/widgets/Annotation.js	Wed Jun 27 19:03:37 2012 +0200
+++ b/src/widgets/Annotation.js	Fri Jun 29 16:22:52 2012 +0200
@@ -3,42 +3,54 @@
 IriSP.Widgets.Annotation = function(player, config) {
     IriSP.Widgets.Widget.call(this, player, config);
     this.lastAnnotation = false;
+    this.minimized = this.start_minimized || false;
+    this.bounds = [ 0, 0 ];
 };
 
 IriSP.Widgets.Annotation.prototype = new IriSP.Widgets.Widget();
 
 IriSP.Widgets.Annotation.prototype.messages = {
-    "fr": {
+    fr: {
+        share_: "Partager :",
         share_on: "Partager sur",
         watching: "Je regarde ",
         on_site: " sur ",
-        tags: "Mots-clés :",
+        tags_: "Mots-clés :",
+        description_: "Description :",
         excerpt_from: "Extrait de :"
     },
-    "en": {
+    en: {
+        share_: "Share:",
         share_on: "Share on",
         watching: "I'm watching ",
         on_site: " on ",
-        tags: "Keywords:",
+        tags_: "Keywords:",
+        description_: "Description:",
         excerpt_from: "Excerpt from:"
     }
 }
 
 IriSP.Widgets.Annotation.prototype.template =
     '<div class="Ldt-Annotation-Widget {{#show_top_border}}Ldt-Annotation-ShowTop{{/show_top_border}}">'
-    + '<div class="Ldt-Annotation-Inner Ldt-Annotation-Empty"><div class="Ldt-Annotation-ShareIcons Ldt-Annotation-HiddenWhenMinimized Ldt-Annotation-HiddenWhenEmpty">'
+    + '<div class="Ldt-Annotation-Inner Ldt-Annotation-Empty{{#start_minimized}} Ldt-Annotation-Minimized{{/start_minimized}}">'
+    + '<div class="Ldt-Annotation-HiddenWhenEmpty Ldt-Annotation-MaxMinButton"></div>'
+    + '<h3 class="Ldt-Annotation-HiddenWhenEmpty"><span class="Ldt-Annotation-Title"></span> <span class="Ldt-Annotation-Time">'
+    + '( <span class="Ldt-Annotation-Begin"></span> - <span class="Ldt-Annotation-End"></span> )</span></h3>'
+    + '<h3 class="Ldt-Annotation-MashupOrigin Ldt-Annotation-HiddenWhenEmpty">{{l10n.excerpt_from}} <span class="Ldt-Annotation-MashupMedia"></span> <span class="Ldt-Annotation-Time">'
+    + '( <span class="Ldt-Annotation-MashupBegin"></span> - <span class="Ldt-Annotation-MashupEnd"></span> )</span></h3>'
+    + '<div class="Ldt-Annotation-Cleared Ldt-Annotation-HiddenWhenMinimized Ldt-Annotation-HiddenWhenEmpty Ldt-Annotation-Description-Block"><div class="Ldt-Annotation-Label">{{l10n.description_}}</div>'
+    + '<p class="Ldt-Annotation-Labelled Ldt-Annotation-Description"></p></div>'
+    + '<div class="Ldt-Annotation-Tags-Block Ldt-Annotation-HiddenWhenMinimized Ldt-Annotation-HiddenWhenEmpty Ldt-Annotation-Cleared">'
+    + '<div class="Ldt-Annotation-Label">{{l10n.tags_}}</div><ul class="Ldt-Annotation-Labelled Ldt-Annotation-Tags"></ul>'
+    + '</div><div class="Ldt-Annotation-Cleared Ldt-Annotation-HiddenWhenMinimized Ldt-Annotation-HiddenWhenEmpty"><div class="Ldt-Annotation-Label">{{l10n.share_}}</div><p class="Ldt-Annotation-Labelled">'
     + '<a href="#" target="_blank" class="Ldt-Annotation-Share Ldt-Annotation-Fb Ldt-TraceMe" title="{{l10n.share_on}} Facebook"></a>'
     + '<a href="#" target="_blank" class="Ldt-Annotation-Share Ldt-Annotation-Twitter Ldt-TraceMe" title="{{l10n.share_on}} Twitter"></a>'
     + '<a href="#" target="_blank" class="Ldt-Annotation-Share Ldt-Annotation-Gplus Ldt-TraceMe" title="{{l10n.share_on}} Google+"></a>'
-    + '</div><h3 class="Ldt-Annotation-HiddenWhenEmpty"><span class="Ldt-Annotation-Title"></span> <span class="Ldt-Annotation-Time">'
-    + '( <span class="Ldt-Annotation-Begin"></span> - <span class="Ldt-Annotation-End"></span> )</span></h3>'
-    + '<h3 class="Ldt-Annotation-MashupOrigin Ldt-Annotation-HiddenWhenEmpty">{{l10n.excerpt_from}} <span class="Ldt-Annotation-MashupMedia"></span> <span class="Ldt-Annotation-Time">'
-    + '( <span class="Ldt-Annotation-MashupBegin"></span> - <span class="Ldt-Annotation-MashupEnd"></span> )</span></h3>'
-    + '<p class="Ldt-Annotation-Description Ldt-Annotation-HiddenWhenMinimized Ldt-Annotation-HiddenWhenEmpty"></p>'
-    + '<div class="Ldt-Annotation-Tags-Block Ldt-Annotation-HiddenWhenMinimized Ldt-Annotation-HiddenWhenEmpty Ldt-Annotation-NoTags"><div class="Ldt-Annotation-TagTitle">{{l10n.tags}}</div><ul class="Ldt-Annotation-Tags"></ul></div></div></div>';
+    + '</p></div></div></div></div>';
 
 IriSP.Widgets.Annotation.prototype.defaults = {
     annotation_type : "chap",
+    start_minimized: false,
     show_top_border : false,
     site_name : "Lignes de Temps"
 }
@@ -50,6 +62,8 @@
     this.bindPopcorn("IriSP.Annotation.show","show");
     this.bindPopcorn("IriSP.Annotation.minimize","minimize");
     this.bindPopcorn("IriSP.Annotation.maximize","maximize");
+    this.bindPopcorn("IriSP.Annotation.getBounds","sendBounds");
+    this.$.find(".Ldt-Annotation-MaxMinButton").click(this.functionWrapper("toggleSize"));
     this.onTimeupdate();
 }
 
@@ -59,7 +73,7 @@
     if (_list.length) {
         if (_list[0].id !== this.lastAnnotation) {
             this.drawAnnotation(_list[0]);
-            this.player.popcorn.trigger("IriSP.Annotation.boundsChanged",[ _list[0].begin.valueOf(), _list[0].end.valueOf() ]);
+            this.bounds = [ _list[0].begin.valueOf(), _list[0].end.valueOf() ];
         }
         this.player.popcorn.trigger("IriSP.Arrow.updatePosition",{widget: this.type, time: ( _list[0].begin + _list[0].end ) / 2});
     }
@@ -67,8 +81,13 @@
         this.lastAnnotation = false;
         this.$.find(".Ldt-Annotation-Inner").addClass("Ldt-Annotation-Empty");
         this.player.popcorn.trigger("IriSP.Arrow.updatePosition",{widget: this.type, time: _time});
-        this.player.popcorn.trigger("IriSP.Annotation.boundsChanged",[ _time, _time ]);
+        this.bounds = [ _time, _time ];
     }
+    this.sendBounds();
+}
+
+IriSP.Widgets.Annotation.prototype.sendBounds = function() {
+    this.player.popcorn.trigger("IriSP.Annotation.boundsChanged",this.bounds);
 }
 
 IriSP.Widgets.Annotation.prototype.drawAnnotation = function(_annotation) {
@@ -97,10 +116,16 @@
             _this.player.popcorn.trigger("IriSP.search.triggeredSearch", IriSP.jQuery(this).text().replace(/(^\s+|\s+$)/g,''));
         });
     } else {
-        this.$.find(".Ldt-Annotation-Tags-Block").addClass("Ldt-Annotation-NoTags");
+        this.$.find(".Ldt-Annotation-Tags-Block").hide();
     }
     this.$.find(".Ldt-Annotation-Title").html(_annotation.title);
-    this.$.find(".Ldt-Annotation-Description").html(_annotation.description);
+    var _desc = _annotation.description.replace(/(^\s+|\s+$)/g,'');
+    if (_desc) {
+        this.$.find(".Ldt-Annotation-Description-Block").show();
+        this.$.find(".Ldt-Annotation-Description").html(_desc);
+    } else {
+        this.$.find(".Ldt-Annotation-Description-Block").hide();
+    }
     this.$.find(".Ldt-Annotation-Begin").html(_annotation.begin.toString());
     this.$.find(".Ldt-Annotation-End").html(_annotation.end.toString());
     if (_annotation.elementType === "mashedAnnotation") {
@@ -125,10 +150,20 @@
     this.$.slideDown();
 }
 
+IriSP.Widgets.Annotation.prototype.toggleSize = function() {
+    if (this.minimized) {
+        this.maximize();
+    } else {
+        this.minimize();
+    }
+}
+
 IriSP.Widgets.Annotation.prototype.minimize = function() {
+    this.minimized = true;
     this.$.find('.Ldt-Annotation-Inner').addClass("Ldt-Annotation-Minimized");
 }
 
 IriSP.Widgets.Annotation.prototype.maximize = function() {
+    this.minimized = false;
     this.$.find('.Ldt-Annotation-Inner').removeClass("Ldt-Annotation-Minimized");
 }
\ No newline at end of file