src/widgets/Annotation.js
changeset 1072 ac1eacb3aa33
parent 1068 7623f9af9272
child 1073 687133dc13cf
equal deleted inserted replaced
1071:02c04d2c8fd8 1072:ac1eacb3aa33
     1 // TODO: Migrate Timeupdate functions to Extract
     1 // TODO: Migrate Timeupdate functions to Extract
     2 
     2 import annotationStyles from "./Annotation.module.css";
     3 IriSP.Widgets.Annotation = function(player, config) {
     3 
     4     IriSP.Widgets.Widget.call(this, player, config);
     4 // Annotation class
     5     this.lastAnnotation = false;
     5 const Annotation = function (ns) {
     6     this.minimized = this.start_minimized || false;
     6   return class extends ns.Widgets.Widget {
     7     this.bounds = [ 0, 0 ];
     7     constructor(player, config) {
     8 };
     8       super(player, config);
     9 
     9       this.lastAnnotation = false;
    10 IriSP.Widgets.Annotation.prototype = new IriSP.Widgets.Widget();
    10       this.minimized = this.start_minimized || false;
    11 
    11       this.bounds = [0, 0];
    12 IriSP.Widgets.Annotation.prototype.messages = {
    12     }
    13     fr: {
    13 
       
    14     static messages =  {
       
    15       fr: {
    14         watching: "Je regarde ",
    16         watching: "Je regarde ",
    15         on_site: " sur ",
    17         on_site: " sur ",
    16         tags_: "Mots-clés\u00a0:",
    18         tags_: "Mots-clés\u00a0:",
    17         description_: "Description\u00a0:",
    19         description_: "Description\u00a0:",
    18         creator_: "Créé par\u00a0:",
    20         creator_: "Créé par\u00a0:",
    19         excerpt_from: "Extrait de\u00a0:",
    21         excerpt_from: "Extrait de\u00a0:",
    20         untitled: "Segment sans titre"
    22         untitled: "Segment sans titre",
    21     },
    23       },
    22     en: {
    24       en: {
    23         watching: "I'm watching ",
    25         watching: "I'm watching ",
    24         on_site: " on ",
    26         on_site: " on ",
    25         tags_: "Keywords:",
    27         tags_: "Keywords:",
    26         description_: "Description:",
    28         description_: "Description:",
    27         creator_: "Created by\u00a0:",
    29         creator_: "Created by\u00a0:",
    28         excerpt_from: "Excerpt from:",
    30         excerpt_from: "Excerpt from:",
    29         untitled: "Untitled segment"
    31         untitled: "Untitled segment",
    30     }
    32       },
    31 };
    33     };
    32 
    34 
    33 IriSP.Widgets.Annotation.prototype.template =
    35     static template =
    34     '{{#show_arrow}}<div class="Ldt-Annotation-Arrow"></div>{{/show_arrow}}'
    36       '{{#show_arrow}}<div class="Ldt-Annotation-Arrow"></div>{{/show_arrow}}' +
    35     + '<div class="Ldt-Annotation-Widget {{^show_arrow}}Ldt-Annotation-ShowTop{{/show_arrow}}">'
    37       '<div class="Ldt-Annotation-Widget {{^show_arrow}}Ldt-Annotation-ShowTop{{/show_arrow}}">' +
    36     + '<div class="Ldt-Annotation-Inner Ldt-Annotation-Empty{{#start_minimized}} Ldt-Annotation-Minimized{{/start_minimized}}">'
    38       '<div class="Ldt-Annotation-Inner Ldt-Annotation-Empty{{#start_minimized}} Ldt-Annotation-Minimized{{/start_minimized}}">' +
    37     + '<div class="Ldt-Annotation-HiddenWhenEmpty Ldt-Annotation-MaxMinButton"></div>'
    39       '<div class="Ldt-Annotation-HiddenWhenEmpty Ldt-Annotation-MaxMinButton"></div>' +
    38     + '{{#show_social}}<div class="Ldt-Annotation-Social Ldt-Annotation-HiddenWhenMinimized Ldt-Annotation-HiddenWhenEmpty"></div>{{/show_social}}'
    40       '{{#show_social}}<div class="Ldt-Annotation-Social Ldt-Annotation-HiddenWhenMinimized Ldt-Annotation-HiddenWhenEmpty"></div>{{/show_social}}' +
    39     + '<h3 class="Ldt-Annotation-HiddenWhenEmpty">{{#show_annotation_type}}<span class="Ldt-Annotation-Type"></span> » {{/show_annotation_type}}<a class="Ldt-Annotation-Title" href="#"></a> <span class="Ldt-Annotation-Time Ldt-Annotation-HiddenWhenMinimized">'
    41       '<h3 class="Ldt-Annotation-HiddenWhenEmpty">{{#show_annotation_type}}<span class="Ldt-Annotation-Type"></span> » {{/show_annotation_type}}<a class="Ldt-Annotation-Title" href="#"></a> <span class="Ldt-Annotation-Time Ldt-Annotation-HiddenWhenMinimized">' +
    40     + '(<span class="Ldt-Annotation-Begin"></span> - <span class="Ldt-Annotation-End"></span>)</span></h3>'
    42       '(<span class="Ldt-Annotation-Begin"></span> - <span class="Ldt-Annotation-End"></span>)</span></h3>' +
    41     + '<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">'
    43       '<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">' +
    42     + '(<span class="Ldt-Annotation-MashupBegin"></span> - <span class="Ldt-Annotation-MashupEnd"></span>)</span></h3>'
    44       '(<span class="Ldt-Annotation-MashupBegin"></span> - <span class="Ldt-Annotation-MashupEnd"></span>)</span></h3>' +
    43     + '<div class="Ldt-Annotation-Cleared Ldt-Annotation-HiddenWhenMinimized Ldt-Annotation-HiddenWhenEmpty Ldt-Annotation-Creator-Block"><div class="Ldt-Annotation-Label">{{l10n.creator_}}</div>'
    45       '<div class="Ldt-Annotation-Cleared Ldt-Annotation-HiddenWhenMinimized Ldt-Annotation-HiddenWhenEmpty Ldt-Annotation-Creator-Block"><div class="Ldt-Annotation-Label">{{l10n.creator_}}</div>' +
    44     + '{{#show_creator}}<p class="Ldt-Annotation-Labelled Ldt-Annotation-Creator"></p></div>{{/show_creator}}'
    46       '{{#show_creator}}<p class="Ldt-Annotation-Labelled Ldt-Annotation-Creator"></p></div>{{/show_creator}}' +
    45     + '{{#show_description}}<div class="Ldt-Annotation-Cleared Ldt-Annotation-HiddenWhenMinimized Ldt-Annotation-HiddenWhenEmpty Ldt-Annotation-Description-Block"><div class="Ldt-Annotation-Label">{{l10n.description_}}</div>'
    47       '{{#show_description}}<div class="Ldt-Annotation-Cleared Ldt-Annotation-HiddenWhenMinimized Ldt-Annotation-HiddenWhenEmpty Ldt-Annotation-Description-Block"><div class="Ldt-Annotation-Label">{{l10n.description_}}</div>' +
    46     + '<p class="Ldt-Annotation-Labelled Ldt-Annotation-Description"></p></div>{{/show_description}}'
    48       '<p class="Ldt-Annotation-Labelled Ldt-Annotation-Description"></p></div>{{/show_description}}' +
    47     + '<div class="Ldt-Annotation-Tags-Block Ldt-Annotation-HiddenWhenMinimized Ldt-Annotation-HiddenWhenEmpty Ldt-Annotation-Cleared">'
    49       '<div class="Ldt-Annotation-Tags-Block Ldt-Annotation-HiddenWhenMinimized Ldt-Annotation-HiddenWhenEmpty Ldt-Annotation-Cleared">' +
    48     + '<div class="Ldt-Annotation-Label">{{l10n.tags_}}</div><ul class="Ldt-Annotation-Labelled Ldt-Annotation-Tags"></ul>'
    50       '<div class="Ldt-Annotation-Label">{{l10n.tags_}}</div><ul class="Ldt-Annotation-Labelled Ldt-Annotation-Tags"></ul>' +
    49     + '</div></div></div></div>';
    51       "</div></div></div></div>";
    50 
    52 
    51 IriSP.Widgets.Annotation.prototype.defaults = {
    53     static defaults = {
    52     annotation_type : "chap",
    54       annotation_type: "chap",
    53     start_minimized: false,
    55       start_minimized: false,
    54     show_arrow : true,
    56       show_arrow: true,
    55     show_creator: true,
    57       show_creator: true,
    56     show_description: true,
    58       show_description: true,
    57     arrow_position: .5,
    59       arrow_position: 0.5,
    58     site_name : "Lignes de Temps",
    60       site_name: "Lignes de Temps",
    59     search_on_tag_click: true,
    61       search_on_tag_click: true,
    60     show_social: true,
    62       show_social: true,
    61     show_annotation_type: false
    63       show_annotation_type: false,
    62 };
    64     };
    63 
    65 
    64 IriSP.Widgets.Annotation.prototype.draw = function() {
    66     draw() {
    65     
    67       var _this = this,
    66     var _this = this,
       
    67         currentAnnotation;
    68         currentAnnotation;
    68     
    69 
    69     function timeupdate(_time) {
    70       function timeupdate(_time) {
    70         var _list = _this.getWidgetAnnotationsAtTime();
    71         var _list = _this.getWidgetAnnotationsAtTime();
    71         if (!_list.length) {
    72         if (!_list.length) {
    72             _this.$.find(".Ldt-Annotation-Inner").addClass("Ldt-Annotation-Empty");
    73           _this.$.find(".Ldt-Annotation-Inner").addClass(
    73             if (_this.arrow) {
    74             "Ldt-Annotation-Empty"
    74                 _this.arrow.moveToTime(_time);
    75           );
    75             }
    76           if (_this.arrow) {
    76             _this.bounds = [ _time, _time ];
    77             _this.arrow.moveToTime(_time);
    77             _this.sendBounds();
    78           }
    78         }
    79           _this.bounds = [_time, _time];
    79     }
    80           _this.sendBounds();
    80     
    81         }
    81     function highlightTitleAndDescription() {
    82       }
       
    83 
       
    84       function highlightTitleAndDescription() {
    82         if (!currentAnnotation) {
    85         if (!currentAnnotation) {
    83             return;
    86           return;
    84         }
    87         }
    85         var title = currentAnnotation.title,
    88         var title = currentAnnotation.title,
    86             description = currentAnnotation.description.replace(/(^\s+|\s+$)/g,''),
    89           description = currentAnnotation.description.replace(
    87             rx = (currentAnnotation.found ? (_this.source.getAnnotations().regexp || false) : false);
    90             /(^\s+|\s+$)/g,
    88         _this.$.find(".Ldt-Annotation-Title").html(IriSP.textFieldHtml(title,rx)  || "(" + _this.l10n.untitled + ")");
    91             ""
       
    92           ),
       
    93           rx = currentAnnotation.found
       
    94             ? _this.source.getAnnotations().regexp || false
       
    95             : false;
       
    96         _this.$.find(".Ldt-Annotation-Title").html(
       
    97           IriSP.textFieldHtml(title, rx) || "(" + _this.l10n.untitled + ")"
       
    98         );
    89         if (description) {
    99         if (description) {
    90             _this.$.find(".Ldt-Annotation-Description-Block").removeClass("Ldt-Annotation-EmptyBlock");
   100           _this.$.find(".Ldt-Annotation-Description-Block").removeClass(
    91             _this.$.find(".Ldt-Annotation-Description").html(IriSP.textFieldHtml(description,rx));
   101             "Ldt-Annotation-EmptyBlock"
       
   102           );
       
   103           _this.$.find(".Ldt-Annotation-Description").html(
       
   104             IriSP.textFieldHtml(description, rx)
       
   105           );
    92         } else {
   106         } else {
    93             _this.$.find(".Ldt-Annotation-Description-Block").addClass("Ldt-Annotation-EmptyBlock");
   107           _this.$.find(".Ldt-Annotation-Description-Block").addClass(
    94         }
   108             "Ldt-Annotation-EmptyBlock"
    95     }
   109           );
    96     
   110         }
    97     function drawAnnotation(_annotation) {
   111       }
       
   112 
       
   113       function drawAnnotation(_annotation) {
    98         currentAnnotation = _annotation;
   114         currentAnnotation = _annotation;
    99         var _url = (typeof _annotation.url !== "undefined" 
   115         var _url =
   100                 ? _annotation.url
   116             typeof _annotation.url !== "undefined"
   101                 : (document.location.href.replace(/#.*$/,'') + '#id='  + _annotation.id)),
   117               ? _annotation.url
   102             _text = _this.l10n.watching + _annotation.title + (_this.site_name ? _this.l10n.on_site + _this.site_name : ''),
   118               : document.location.href.replace(/#.*$/, "") +
   103             _tags = _annotation.getTags(),
   119                 "#id=" +
   104             _tagblock = _this.$.find(".Ldt-Annotation-Tags");
   120                 _annotation.id,
       
   121           _text =
       
   122             _this.l10n.watching +
       
   123             _annotation.title +
       
   124             (_this.site_name ? _this.l10n.on_site + _this.site_name : ""),
       
   125           _tags = _annotation.getTags(),
       
   126           _tagblock = _this.$.find(".Ldt-Annotation-Tags");
   105         _tagblock.empty();
   127         _tagblock.empty();
   106         if (_tags.length) {
   128         if (_tags.length) {
   107             _this.$.find(".Ldt-Annotation-Tags-Block").removeClass("Ldt-Annotation-EmptyBlock");
   129           _this.$.find(".Ldt-Annotation-Tags-Block").removeClass(
   108             _tags.forEach(function(_tag) {
   130             "Ldt-Annotation-EmptyBlock"
   109                 var _trimmedTitle =  _tag.title.replace(/(^\s+|\s+$)/g,'');
   131           );
   110                 if (_trimmedTitle) {
   132           _tags.forEach(function (_tag) {
   111                     var _el = IriSP.jQuery('<li class="Ldt-Annotation-TagLabel"></li>').append(IriSP.jQuery('<span>').text(_trimmedTitle));
   133             var _trimmedTitle = _tag.title.replace(/(^\s+|\s+$)/g, "");
   112                     _el.click(function() {
   134             if (_trimmedTitle) {
   113                         if (_this.search_on_tag_click) {
   135               var _el = IriSP.jQuery(
   114                             _this.source.getAnnotations().search(_trimmedTitle);
   136                 '<li class="Ldt-Annotation-TagLabel"></li>'
   115                         }
   137               ).append(IriSP.jQuery("<span>").text(_trimmedTitle));
   116                         _tag.trigger("click");
   138               _el.click(function () {
   117                     });
   139                 if (_this.search_on_tag_click) {
   118                     _tagblock.append(_el);
   140                   _this.source.getAnnotations().search(_trimmedTitle);
   119                 }
   141                 }
   120             });
   142                 _tag.trigger("click");
       
   143               });
       
   144               _tagblock.append(_el);
       
   145             }
       
   146           });
   121         } else {
   147         } else {
   122             _this.$.find(".Ldt-Annotation-Tags-Block").addClass("Ldt-Annotation-EmptyBlock");
   148           _this.$.find(".Ldt-Annotation-Tags-Block").addClass(
       
   149             "Ldt-Annotation-EmptyBlock"
       
   150           );
   123         }
   151         }
   124         highlightTitleAndDescription();
   152         highlightTitleAndDescription();
   125         if (_this.show_creator) {
   153         if (_this.show_creator) {
   126              _this.$.find(".Ldt-Annotation-Creator").text(_annotation.creator);
   154           _this.$.find(".Ldt-Annotation-Creator").text(_annotation.creator);
   127         }
   155         }
   128         if (_this.show_annotation_type) {
   156         if (_this.show_annotation_type) {
   129             _this.$.find(".Ldt-Annotation-Type").text(_annotation.getAnnotationType().title);
   157           _this.$.find(".Ldt-Annotation-Type").text(
   130             _this.$.find(".Ldt-Annotation-Type").attr("title", _annotation.getAnnotationType().description);
   158             _annotation.getAnnotationType().title
   131         }
   159           );
   132         _this.$.find(".Ldt-Annotation-Begin").text(_annotation.begin.toString());
   160           _this.$.find(".Ldt-Annotation-Type").attr(
       
   161             "title",
       
   162             _annotation.getAnnotationType().description
       
   163           );
       
   164         }
       
   165         _this.$.find(".Ldt-Annotation-Begin").text(
       
   166           _annotation.begin.toString()
       
   167         );
   133         _this.$.find(".Ldt-Annotation-End").text(_annotation.end.toString());
   168         _this.$.find(".Ldt-Annotation-End").text(_annotation.end.toString());
   134         if (_annotation.elementType === "mashedAnnotation") {
   169         if (_annotation.elementType === "mashedAnnotation") {
   135             _this.$.find('.Ldt-Annotation-Inner').addClass("Ldt-Annotation-isMashup");
   170           _this.$.find(".Ldt-Annotation-Inner").addClass(
   136             _this.$.find(".Ldt-Annotation-MashupMedia").text(_annotation.getMedia().title);
   171             "Ldt-Annotation-isMashup"
   137             _this.$.find(".Ldt-Annotation-MashupBegin").text(_annotation.annotation.begin.toString());
   172           );
   138             _this.$.find(".Ldt-Annotation-MashupEnd").text(_annotation.annotation.end.toString());
   173           _this.$.find(".Ldt-Annotation-MashupMedia").text(
       
   174             _annotation.getMedia().title
       
   175           );
       
   176           _this.$.find(".Ldt-Annotation-MashupBegin").text(
       
   177             _annotation.annotation.begin.toString()
       
   178           );
       
   179           _this.$.find(".Ldt-Annotation-MashupEnd").text(
       
   180             _annotation.annotation.end.toString()
       
   181           );
   139         } else {
   182         } else {
   140             _this.$.find('.Ldt-Annotation-Inner').removeClass("Ldt-Annotation-isMashup");
   183           _this.$.find(".Ldt-Annotation-Inner").removeClass(
       
   184             "Ldt-Annotation-isMashup"
       
   185           );
   141         }
   186         }
   142         if (typeof _this.socialWidget !== "undefined") {
   187         if (typeof _this.socialWidget !== "undefined") {
   143             _this.socialWidget.updateUrls(_url, _text);
   188           _this.socialWidget.updateUrls(_url, _text);
   144         } else {
   189         } else {
   145             setTimeout(function() {
   190           setTimeout(function () {
   146                 if (typeof _this.socialWidget !== "undefined") {
   191             if (typeof _this.socialWidget !== "undefined") {
   147                     _this.socialWidget.updateUrls(_url, _text);
   192               _this.socialWidget.updateUrls(_url, _text);
   148                 }
   193             }
   149             },800);
   194           }, 800);
   150         }
   195         }
   151         _this.$.find(".Ldt-Annotation-Inner").removeClass("Ldt-Annotation-Empty");
   196         _this.$.find(".Ldt-Annotation-Inner").removeClass(
   152         _this.bounds = [ _annotation.begin, _annotation.end ];
   197           "Ldt-Annotation-Empty"
       
   198         );
       
   199         _this.bounds = [_annotation.begin, _annotation.end];
   153         if (_this.arrow) {
   200         if (_this.arrow) {
   154             _this.arrow.moveToTime((1 - _this.arrow_position) * _annotation.begin + _this.arrow_position * _annotation.end);
   201           _this.arrow.moveToTime(
       
   202             (1 - _this.arrow_position) * _annotation.begin +
       
   203               _this.arrow_position * _annotation.end
       
   204           );
   155         }
   205         }
   156         _this.sendBounds();
   206         _this.sendBounds();
   157     }
   207       }
   158     
   208 
   159     this.renderTemplate();
   209       this.renderTemplate();
   160     
   210 
   161     this.$.find(".Ldt-Annotation-Title").click(function() {
   211       this.$.find(".Ldt-Annotation-Title").click(function () {
   162         if (currentAnnotation) {
   212         if (currentAnnotation) {
   163             _this.media.setCurrentTime(currentAnnotation.begin);
   213           _this.media.setCurrentTime(currentAnnotation.begin);
   164         }
   214         }
   165         return false;
   215         return false;
   166     });
   216       });
   167     
   217 
   168     if (this.show_social) {
   218       if (this.show_social) {
   169         this.insertSubwidget(this.$.find(".Ldt-Annotation-Social"), { type: "Social" }, "socialWidget");
   219         this.insertSubwidget(
   170     }
   220           this.$.find(".Ldt-Annotation-Social"),
   171     
   221           { type: "Social" },
   172     if (this.show_arrow) {
   222           "socialWidget"
   173         this.insertSubwidget(this.$.find(".Ldt-Annotation-Arrow"), { type: "Arrow", width: this.width }, "arrow");
   223         );
   174     }
   224       }
   175     this.onMediaEvent("timeupdate",timeupdate);
   225 
   176     this.onMdpEvent("Annotation.hide","hide");
   226       if (this.show_arrow) {
   177     this.onMdpEvent("Annotation.show","show");
   227         this.insertSubwidget(
   178     this.onMdpEvent("Annotation.minimize","minimize");
   228           this.$.find(".Ldt-Annotation-Arrow"),
   179     this.onMdpEvent("Annotation.maximize","maximize");
   229           { type: "Arrow", width: this.width },
   180     this.onMdpEvent("Annotation.getBounds","sendBounds");
   230           "arrow"
   181     this.$.find(".Ldt-Annotation-MaxMinButton").click(this.functionWrapper("toggleSize"));
   231         );
   182     this.$.on("resize", function () { _this.width = _this.$.parent().width();
   232       }
   183                                       _this.$.css({ width: _this.width });
   233       this.onMediaEvent("timeupdate", timeupdate);
   184                                     });
   234       this.onMdpEvent("Annotation.hide", "hide");
   185     this.getWidgetAnnotations().forEach(function(_a) {
   235       this.onMdpEvent("Annotation.show", "show");
   186         _a.on("enter", function() {
   236       this.onMdpEvent("Annotation.minimize", "minimize");
   187             drawAnnotation(_a);
   237       this.onMdpEvent("Annotation.maximize", "maximize");
       
   238       this.onMdpEvent("Annotation.getBounds", "sendBounds");
       
   239       this.$.find(".Ldt-Annotation-MaxMinButton").click(
       
   240         this.functionWrapper("toggleSize")
       
   241       );
       
   242       this.$.on("resize", function () {
       
   243         _this.width = _this.$.parent().width();
       
   244         _this.$.css({ width: _this.width });
       
   245       });
       
   246       this.getWidgetAnnotations().forEach(function (_a) {
       
   247         _a.on("enter", function () {
       
   248           drawAnnotation(_a);
   188         });
   249         });
   189     });
   250       });
   190     this.source.getAnnotations().on("found", highlightTitleAndDescription);
   251       this.source.getAnnotations().on("found", highlightTitleAndDescription);
   191     this.source.getAnnotations().on("not-found", highlightTitleAndDescription);
   252       this.source
   192     this.source.getAnnotations().on("search-cleared", highlightTitleAndDescription);
   253         .getAnnotations()
   193     IriSP.attachDndData(this.$.find("h3"), function() {
   254         .on("not-found", highlightTitleAndDescription);
   194     	return {
   255       this.source
   195 	    	title: currentAnnotation.title,
   256         .getAnnotations()
   196 	    	description: currentAnnotation.description,
   257         .on("search-cleared", highlightTitleAndDescription);
   197 	    	image: currentAnnotation.thumbnail,
   258       IriSP.attachDndData(this.$.find("h3"), function () {
   198 	    	uri: (typeof currentAnnotation.url !== "undefined" 
   259         return {
   199 	            ? currentAnnotation.url
   260           title: currentAnnotation.title,
   200 	            : (document.location.href.replace(/#.*$/,'') + '#id='  + currentAnnotation.id)),
   261           description: currentAnnotation.description,
   201             text: '[' + currentAnnotation.begin.toString() + '] ' + currentAnnotation.title
   262           image: currentAnnotation.thumbnail,
   202 	    };
   263           uri:
   203     });
   264             typeof currentAnnotation.url !== "undefined"
   204 };
   265               ? currentAnnotation.url
   205 
   266               : document.location.href.replace(/#.*$/, "") +
   206 IriSP.Widgets.Annotation.prototype.sendBounds = function() {
   267                 "#id=" +
   207     this.player.trigger("Annotation.boundsChanged",this.bounds);
   268                 currentAnnotation.id,
   208 };
   269           text:
   209 
   270             "[" +
   210 IriSP.Widgets.Annotation.prototype.drawAnnotation = function(_annotation) {
   271             currentAnnotation.begin.toString() +
   211     this.lastAnnotation = _annotation.id;
   272             "] " +
   212 
   273             currentAnnotation.title,
   213 };
   274         };
   214 
   275       });
   215 IriSP.Widgets.Annotation.prototype.hide = function() {
   276     }
   216     this.$.slideUp();
   277 
   217 };
   278     sendBounds() {
   218 
   279       this.player.trigger("Annotation.boundsChanged", this.bounds);
   219 IriSP.Widgets.Annotation.prototype.show = function() {
   280     }
   220     this.$.slideDown();
   281 
   221 };
   282     drawAnnotation(_annotation) {
   222 
   283       this.lastAnnotation = _annotation.id;
   223 IriSP.Widgets.Annotation.prototype.toggleSize = function() {
   284     }
   224     if (this.minimized) {
   285 
       
   286     hide() {
       
   287       this.$.slideUp();
       
   288     }
       
   289 
       
   290     show() {
       
   291       this.$.slideDown();
       
   292     }
       
   293 
       
   294     toggleSize() {
       
   295       if (this.minimized) {
   225         this.maximize();
   296         this.maximize();
   226     } else {
   297       } else {
   227         this.minimize();
   298         this.minimize();
   228     }
   299       }
   229 };
   300     }
   230 
   301 
   231 IriSP.Widgets.Annotation.prototype.minimize = function() {
   302     minimize() {
   232     this.minimized = true;
   303       this.minimized = true;
   233     this.$.find('.Ldt-Annotation-Inner').addClass("Ldt-Annotation-Minimized");
   304       this.$.find(".Ldt-Annotation-Inner").addClass("Ldt-Annotation-Minimized");
   234 };
   305     }
   235 
   306 
   236 IriSP.Widgets.Annotation.prototype.maximize = function() {
   307     maximize() {
   237     this.minimized = false;
   308       this.minimized = false;
   238     this.$.find('.Ldt-Annotation-Inner').removeClass("Ldt-Annotation-Minimized");
   309       this.$.find(".Ldt-Annotation-Inner").removeClass(
   239 };
   310         "Ldt-Annotation-Minimized"
       
   311       );
       
   312     }
       
   313   };
       
   314 }
       
   315 
       
   316 export { Annotation , annotationStyles };