1 // TODO: Migrate Timeupdate functions to Extract

     2 

     3 IriSP.Widgets.Annotation = function(player, config) {

     4     IriSP.Widgets.Widget.call(this, player, config);

     5     this.lastAnnotation = false;

     6     this.minimized = this.start_minimized || false;

     7     this.bounds = [ 0, 0 ];

     8 };

     9 

    10 IriSP.Widgets.Annotation.prototype = new IriSP.Widgets.Widget();

    11 

    12 IriSP.Widgets.Annotation.prototype.messages = {

    13     fr: {

    14         watching: "Je regarde ",

    15         on_site: " sur ",

    16         tags_: "Mots-clés :",

    17         description_: "Description :",

    18         excerpt_from: "Extrait de :"

    19     },

    20     en: {

    21         watching: "I'm watching ",

    22         on_site: " on ",

    23         tags_: "Keywords:",

    24         description_: "Description:",

    25         excerpt_from: "Excerpt from:"

    26     }

    27 }

    28 

    29 IriSP.Widgets.Annotation.prototype.template =

    30     '<div class="Ldt-Annotation-Widget {{#show_top_border}}Ldt-Annotation-ShowTop{{/show_top_border}}">'

    31     + '<div class="Ldt-Annotation-Inner Ldt-Annotation-Empty{{#start_minimized}} Ldt-Annotation-Minimized{{/start_minimized}}">'

    32     + '<div class="Ldt-Annotation-HiddenWhenEmpty Ldt-Annotation-MaxMinButton"></div>'

    33     + '<div class="Ldt-Annotation-Social Ldt-Annotation-HiddenWhenMinimized Ldt-Annotation-HiddenWhenEmpty"></div>'

    34     + '<h3 class="Ldt-Annotation-HiddenWhenEmpty"><span class="Ldt-Annotation-Title"></span> <span class="Ldt-Annotation-Time">'

    35     + '( <span class="Ldt-Annotation-Begin"></span> - <span class="Ldt-Annotation-End"></span> )</span></h3>'

    36     + '<h3 class="Ldt-Annotation-MashupOrigin Ldt-Annotation-HiddenWhenEmpty">{{l10n.excerpt_from}} <span class="Ldt-Annotation-MashupMedia"></span> <span class="Ldt-Annotation-Time">'

    37     + '( <span class="Ldt-Annotation-MashupBegin"></span> - <span class="Ldt-Annotation-MashupEnd"></span> )</span></h3>'

    38     + '<div class="Ldt-Annotation-Cleared Ldt-Annotation-HiddenWhenMinimized Ldt-Annotation-HiddenWhenEmpty Ldt-Annotation-Description-Block"><div class="Ldt-Annotation-Label">{{l10n.description_}}</div>'

    39     + '<p class="Ldt-Annotation-Labelled Ldt-Annotation-Description"></p></div>'

    40     + '<div class="Ldt-Annotation-Tags-Block Ldt-Annotation-HiddenWhenMinimized Ldt-Annotation-HiddenWhenEmpty Ldt-Annotation-Cleared">'

    41     + '<div class="Ldt-Annotation-Label">{{l10n.tags_}}</div><ul class="Ldt-Annotation-Labelled Ldt-Annotation-Tags"></ul>'

    42     + '</div></div></div></div>';

    43 

    44 IriSP.Widgets.Annotation.prototype.defaults = {

    45     annotation_type : "chap",

    46     start_minimized: true,

    47     show_top_border : false,

    48     site_name : "Lignes de Temps"

    49 }

    50 

    51 IriSP.Widgets.Annotation.prototype.draw = function() {

    52     this.renderTemplate();

    53     this.insertSubwidget(this.$.find(".Ldt-Annotation-Social"), "socialWidget", { type: "Social" });

    54     this.bindPopcorn("timeupdate","onTimeupdate");

    55     this.bindPopcorn("IriSP.Annotation.hide","hide");

    56     this.bindPopcorn("IriSP.Annotation.show","show");

    57     this.bindPopcorn("IriSP.Annotation.minimize","minimize");

    58     this.bindPopcorn("IriSP.Annotation.maximize","maximize");

    59     this.bindPopcorn("IriSP.Annotation.getBounds","sendBounds");

    60     this.$.find(".Ldt-Annotation-MaxMinButton").click(this.functionWrapper("toggleSize"));

    61     this.onTimeupdate();

    62 }

    63 

    64 IriSP.Widgets.Annotation.prototype.onTimeupdate = function() {

    65     var _time = Math.floor(this.player.popcorn.currentTime() * 1000),

    66         _list = this.getWidgetAnnotationsAtTime();

    67     if (_list.length) {

    68         if (_list[0].id !== this.lastAnnotation) {

    69             this.drawAnnotation(_list[0]);

    70             this.bounds = [ _list[0].begin.valueOf(), _list[0].end.valueOf() ];

    71         }

    72         this.player.popcorn.trigger("IriSP.Arrow.updatePosition",{widget: this.type, time: ( _list[0].begin + _list[0].end ) / 2});

    73     }

    74     else {

    75         this.lastAnnotation = false;

    76         this.$.find(".Ldt-Annotation-Inner").addClass("Ldt-Annotation-Empty");

    77         this.player.popcorn.trigger("IriSP.Arrow.updatePosition",{widget: this.type, time: _time});

    78         this.bounds = [ _time, _time ];

    79     }

    80     this.sendBounds();

    81 }

    82 

    83 IriSP.Widgets.Annotation.prototype.sendBounds = function() {

    84     this.player.popcorn.trigger("IriSP.Annotation.boundsChanged",this.bounds);

    85 }

    86 

    87 IriSP.Widgets.Annotation.prototype.drawAnnotation = function(_annotation) {

    88     this.lastAnnotation = _annotation.id;

    89     var _url = (typeof _annotation.url !== "undefined" 

    90             ? _annotation.url

    91             : (document.location.href.replace(/#.*$/,'') + '#id='  + _annotation.id));

    92     var _text = this.l10n.watching + _annotation.title + (this.site_name ? this.l10n.on_site + this.site_name : '');

    93     var _tags = _annotation.getTagTexts();

    94     if (_tags.length) {

    95         var _html = IriSP._(_tags).map(function(_tag) {

    96             return '<li class="Ldt-Annotation-TagLabel"><span>' + _tag + '</span></li>';

    97         }).join("");

    98         this.$.find(".Ldt-Annotation-Tags").html(_html);

    99         this.$.find(".Ldt-Annotation-Tags-Block").removeClass("Ldt-Annotation-EmptyBlock");

   100         

   101         /* Correct the empty tag bug */

   102         this.$.find('.Ldt-Annotation-TagLabel').each(function() {

   103             var _el = IriSP.jQuery(this);

   104             if (!_el.text().replace(/(^\s+|\s+$)/g,'')) {

   105                 _el.detach();

   106             }

   107         });

   108     

   109         this.$.find('.Ldt-Annotation-TagLabel').click(function() {

   110             _this.player.popcorn.trigger("IriSP.search.triggeredSearch", IriSP.jQuery(this).text().replace(/(^\s+|\s+$)/g,''));

   111         });

   112     } else {

   113         this.$.find(".Ldt-Annotation-Tags-Block").addClass("Ldt-Annotation-EmptyBlock");

   114     }

   115     this.$.find(".Ldt-Annotation-Title").html(_annotation.title);

   116     var _desc = _annotation.description.replace(/(^\s+|\s+$)/g,'');

   117     if (_desc) {

   118         this.$.find(".Ldt-Annotation-Description-Block").removeClass("Ldt-Annotation-EmptyBlock");

   119         this.$.find(".Ldt-Annotation-Description").html(_desc);

   120     } else {

   121         this.$.find(".Ldt-Annotation-Description-Block").addClass("Ldt-Annotation-EmptyBlock");

   122     }

   123     this.$.find(".Ldt-Annotation-Begin").html(_annotation.begin.toString());

   124     this.$.find(".Ldt-Annotation-End").html(_annotation.end.toString());

   125     if (_annotation.elementType === "mashedAnnotation") {

   126         this.$.find('.Ldt-Annotation-Inner').addClass("Ldt-Annotation-isMashup");

   127         this.$.find(".Ldt-Annotation-MashupMedia").html(_annotation.getMedia().title);

   128         this.$.find(".Ldt-Annotation-MashupBegin").html(_annotation.annotation.begin.toString());

   129         this.$.find(".Ldt-Annotation-MashupEnd").html(_annotation.annotation.end.toString());

   130     } else {

   131         this.$.find('.Ldt-Annotation-Inner').removeClass("Ldt-Annotation-isMashup");

   132     }

   133     if (typeof this.socialWidget !== "undefined") {

   134         this.socialWidget.updateUrls(_url, _text);

   135     } else {

   136         var _this = this;

   137         setTimeout(function() {

   138             if (typeof _this.socialWidget !== "undefined") {

   139                 _this.socialWidget.updateUrls(_url, _text);

   140             }

   141         },800);

   142     }

   143     this.$.find(".Ldt-Annotation-Inner").removeClass("Ldt-Annotation-Empty");

   144 }

   145 

   146 IriSP.Widgets.Annotation.prototype.hide = function() {

   147     this.$.slideUp();

   148 }

   149 

   150 IriSP.Widgets.Annotation.prototype.show = function() {

   151     this.$.slideDown();

   152 }

   153 

   154 IriSP.Widgets.Annotation.prototype.toggleSize = function() {

   155     if (this.minimized) {

   156         this.maximize();

   157     } else {

   158         this.minimize();

   159     }

   160 }

   161 

   162 IriSP.Widgets.Annotation.prototype.minimize = function() {

   163     this.minimized = true;

   164     this.$.find('.Ldt-Annotation-Inner').addClass("Ldt-Annotation-Minimized");

   165 }

   166 

   167 IriSP.Widgets.Annotation.prototype.maximize = function() {

   168     this.minimized = false;

   169     this.$.find('.Ldt-Annotation-Inner').removeClass("Ldt-Annotation-Minimized");

   170 }