src/widgets/Annotation.js
changeset 982 cfcbac34d020
parent 965 eadb7290c325
child 983 97fef7a4b189
equal deleted inserted replaced
981:982d2226771c 982:cfcbac34d020
    13     fr: {
    13     fr: {
    14         watching: "Je regarde ",
    14         watching: "Je regarde ",
    15         on_site: " sur ",
    15         on_site: " sur ",
    16         tags_: "Mots-clés :",
    16         tags_: "Mots-clés :",
    17         description_: "Description :",
    17         description_: "Description :",
    18         excerpt_from: "Extrait de :"
    18         excerpt_from: "Extrait de :",
       
    19         untitled: "Segment sans titre"
    19     },
    20     },
    20     en: {
    21     en: {
    21         watching: "I'm watching ",
    22         watching: "I'm watching ",
    22         on_site: " on ",
    23         on_site: " on ",
    23         tags_: "Keywords:",
    24         tags_: "Keywords:",
    24         description_: "Description:",
    25         description_: "Description:",
    25         excerpt_from: "Excerpt from:"
    26         excerpt_from: "Excerpt from:",
       
    27         untitled: "Untitled segment"
    26     }
    28     }
    27 }
    29 }
    28 
    30 
    29 IriSP.Widgets.Annotation.prototype.template =
    31 IriSP.Widgets.Annotation.prototype.template =
    30     '{{#show_arrow}}<div class="Ldt-Annotation-Arrow"></div>{{/show_arrow}}'
    32     '{{#show_arrow}}<div class="Ldt-Annotation-Arrow"></div>{{/show_arrow}}'
    31     + '<div class="Ldt-Annotation-Widget {{^show_arrow}}Ldt-Annotation-ShowTop{{/show_arrow}}">'
    33     + '<div class="Ldt-Annotation-Widget {{^show_arrow}}Ldt-Annotation-ShowTop{{/show_arrow}}">'
    32     + '<div class="Ldt-Annotation-Inner Ldt-Annotation-Empty{{#start_minimized}} Ldt-Annotation-Minimized{{/start_minimized}}">'
    34     + '<div class="Ldt-Annotation-Inner Ldt-Annotation-Empty{{#start_minimized}} Ldt-Annotation-Minimized{{/start_minimized}}">'
    33     + '<div class="Ldt-Annotation-HiddenWhenEmpty Ldt-Annotation-MaxMinButton"></div>'
    35     + '<div class="Ldt-Annotation-HiddenWhenEmpty Ldt-Annotation-MaxMinButton"></div>'
    34     + '<div class="Ldt-Annotation-Social Ldt-Annotation-HiddenWhenMinimized Ldt-Annotation-HiddenWhenEmpty"></div>'
    36     + '{{#show_social}}<div class="Ldt-Annotation-Social Ldt-Annotation-HiddenWhenMinimized Ldt-Annotation-HiddenWhenEmpty"></div>{{/show_social}}'
    35     + '<h3 class="Ldt-Annotation-HiddenWhenEmpty"><span class="Ldt-Annotation-Title"></span> <span class="Ldt-Annotation-Time">'
    37     + '<h3 class="Ldt-Annotation-HiddenWhenEmpty">{{#show_annotation_type}}<span class="Ldt-Annotation-Type"></span> » {{/show_annotation_type}}<span class="Ldt-Annotation-Title"></span> <span class="Ldt-Annotation-Time Ldt-Annotation-HiddenWhenMinimized">'
    36     + '( <span class="Ldt-Annotation-Begin"></span> - <span class="Ldt-Annotation-End"></span> )</span></h3>'
    38     + '(<span class="Ldt-Annotation-Begin"></span> - <span class="Ldt-Annotation-End"></span>)</span></h3>'
    37     + '<h3 class="Ldt-Annotation-MashupOrigin Ldt-Annotation-HiddenWhenEmpty">{{l10n.excerpt_from}} <span class="Ldt-Annotation-MashupMedia"></span> <span class="Ldt-Annotation-Time">'
    39     + '<h3 class="Ldt-Annotation-MashupOrigin Ldt-Annotation-HiddenWhenEmpty">{{l10n.excerpt_from}} <span class="Ldt-Annotation-MashupMedia"></span> <span class="Ldt-Annotation-Time Ldt-Annotation-HiddenWhenMinimized">'
    38     + '( <span class="Ldt-Annotation-MashupBegin"></span> - <span class="Ldt-Annotation-MashupEnd"></span> )</span></h3>'
    40     + '(<span class="Ldt-Annotation-MashupBegin"></span> - <span class="Ldt-Annotation-MashupEnd"></span>)</span></h3>'
    39     + '<div class="Ldt-Annotation-Cleared Ldt-Annotation-HiddenWhenMinimized Ldt-Annotation-HiddenWhenEmpty Ldt-Annotation-Description-Block"><div class="Ldt-Annotation-Label">{{l10n.description_}}</div>'
    41     + '<div class="Ldt-Annotation-Cleared Ldt-Annotation-HiddenWhenMinimized Ldt-Annotation-HiddenWhenEmpty Ldt-Annotation-Description-Block"><div class="Ldt-Annotation-Label">{{l10n.description_}}</div>'
    40     + '<p class="Ldt-Annotation-Labelled Ldt-Annotation-Description"></p></div>'
    42     + '<p class="Ldt-Annotation-Labelled Ldt-Annotation-Description"></p></div>'
    41     + '<div class="Ldt-Annotation-Tags-Block Ldt-Annotation-HiddenWhenMinimized Ldt-Annotation-HiddenWhenEmpty Ldt-Annotation-Cleared">'
    43     + '<div class="Ldt-Annotation-Tags-Block Ldt-Annotation-HiddenWhenMinimized Ldt-Annotation-HiddenWhenEmpty Ldt-Annotation-Cleared">'
    42     + '<div class="Ldt-Annotation-Label">{{l10n.tags_}}</div><ul class="Ldt-Annotation-Labelled Ldt-Annotation-Tags"></ul>'
    44     + '<div class="Ldt-Annotation-Label">{{l10n.tags_}}</div><ul class="Ldt-Annotation-Labelled Ldt-Annotation-Tags"></ul>'
    43     + '</div></div></div></div>';
    45     + '</div></div></div></div>';
    45 IriSP.Widgets.Annotation.prototype.defaults = {
    47 IriSP.Widgets.Annotation.prototype.defaults = {
    46     annotation_type : "chap",
    48     annotation_type : "chap",
    47     start_minimized: false,
    49     start_minimized: false,
    48     show_arrow : true,
    50     show_arrow : true,
    49     site_name : "Lignes de Temps",
    51     site_name : "Lignes de Temps",
    50     search_on_tag_click: true
    52     search_on_tag_click: true,
       
    53     show_social: true,
       
    54     show_annotation_type: false
    51 }
    55 }
    52 
    56 
    53 IriSP.Widgets.Annotation.prototype.draw = function() {
    57 IriSP.Widgets.Annotation.prototype.draw = function() {
    54     
    58     
    55     var _this = this;
    59     var _this = this;
    89                 }
    93                 }
    90             });
    94             });
    91         } else {
    95         } else {
    92             _this.$.find(".Ldt-Annotation-Tags-Block").addClass("Ldt-Annotation-EmptyBlock");
    96             _this.$.find(".Ldt-Annotation-Tags-Block").addClass("Ldt-Annotation-EmptyBlock");
    93         }
    97         }
    94         _this.$.find(".Ldt-Annotation-Title").html(_annotation.title);
    98         _this.$.find(".Ldt-Annotation-Title").text(_annotation.title || "(" + _this.l10n.untitled + ")");
    95         var _desc = _annotation.description.replace(/(^\s+|\s+$)/g,'');
    99         var _desc = _annotation.description.replace(/(^\s+|\s+$)/g,'');
    96         if (_desc) {
   100         if (_desc) {
    97             _this.$.find(".Ldt-Annotation-Description-Block").removeClass("Ldt-Annotation-EmptyBlock");
   101             _this.$.find(".Ldt-Annotation-Description-Block").removeClass("Ldt-Annotation-EmptyBlock");
    98             _this.$.find(".Ldt-Annotation-Description").html(_desc);
   102             _this.$.find(".Ldt-Annotation-Description").html(_desc);
    99         } else {
   103         } else {
   100             _this.$.find(".Ldt-Annotation-Description-Block").addClass("Ldt-Annotation-EmptyBlock");
   104             _this.$.find(".Ldt-Annotation-Description-Block").addClass("Ldt-Annotation-EmptyBlock");
   101         }
   105         }
   102         _this.$.find(".Ldt-Annotation-Begin").html(_annotation.begin.toString());
   106         if (_this.show_annotation_type) {
   103         _this.$.find(".Ldt-Annotation-End").html(_annotation.end.toString());
   107             _this.$.find(".Ldt-Annotation-Type").text(_annotation.getAnnotationType().title)
       
   108         }
       
   109         _this.$.find(".Ldt-Annotation-Begin").text(_annotation.begin.toString());
       
   110         _this.$.find(".Ldt-Annotation-End").text(_annotation.end.toString());
   104         if (_annotation.elementType === "mashedAnnotation") {
   111         if (_annotation.elementType === "mashedAnnotation") {
   105             _this.$.find('.Ldt-Annotation-Inner').addClass("Ldt-Annotation-isMashup");
   112             _this.$.find('.Ldt-Annotation-Inner').addClass("Ldt-Annotation-isMashup");
   106             _this.$.find(".Ldt-Annotation-MashupMedia").html(_annotation.getMedia().title);
   113             _this.$.find(".Ldt-Annotation-MashupMedia").text(_annotation.getMedia().title);
   107             _this.$.find(".Ldt-Annotation-MashupBegin").html(_annotation.annotation.begin.toString());
   114             _this.$.find(".Ldt-Annotation-MashupBegin").text(_annotation.annotation.begin.toString());
   108             _this.$.find(".Ldt-Annotation-MashupEnd").html(_annotation.annotation.end.toString());
   115             _this.$.find(".Ldt-Annotation-MashupEnd").text(_annotation.annotation.end.toString());
   109         } else {
   116         } else {
   110             _this.$.find('.Ldt-Annotation-Inner').removeClass("Ldt-Annotation-isMashup");
   117             _this.$.find('.Ldt-Annotation-Inner').removeClass("Ldt-Annotation-isMashup");
   111         }
   118         }
   112         if (typeof _this.socialWidget !== "undefined") {
   119         if (typeof _this.socialWidget !== "undefined") {
   113             _this.socialWidget.updateUrls(_url, _text);
   120             _this.socialWidget.updateUrls(_url, _text);
   125         }
   132         }
   126         _this.sendBounds();
   133         _this.sendBounds();
   127     }
   134     }
   128     
   135     
   129     this.renderTemplate();
   136     this.renderTemplate();
   130     this.insertSubwidget(this.$.find(".Ldt-Annotation-Social"), { type: "Social" }, "socialWidget");
   137     
       
   138     if (_this.show_social) {
       
   139         this.insertSubwidget(this.$.find(".Ldt-Annotation-Social"), { type: "Social" }, "socialWidget");
       
   140     }
       
   141     
   131     this.insertSubwidget(this.$.find(".Ldt-Annotation-Arrow"), { type: "Arrow" }, "arrow");
   142     this.insertSubwidget(this.$.find(".Ldt-Annotation-Arrow"), { type: "Arrow" }, "arrow");
   132     this.onMediaEvent("timeupdate",timeupdate);
   143     this.onMediaEvent("timeupdate",timeupdate);
   133     this.onMdpEvent("Annotation.hide","hide");
   144     this.onMdpEvent("Annotation.hide","hide");
   134     this.onMdpEvent("Annotation.show","show");
   145     this.onMdpEvent("Annotation.show","show");
   135     this.onMdpEvent("Annotation.minimize","minimize");
   146     this.onMdpEvent("Annotation.minimize","minimize");