src/widgets/AnnotationsList.js
branchnew-model
changeset 937 eb3c442cec50
parent 930 165f236e42f2
child 944 8a6c9e3d0158
child 1019 3ab36f402b0c
equal deleted inserted replaced
936:c66260a734ca 937:eb3c442cec50
    44 };
    44 };
    45 
    45 
    46 IriSP.Widgets.AnnotationsList.prototype.template =
    46 IriSP.Widgets.AnnotationsList.prototype.template =
    47     '<div class="Ldt-AnnotationsListWidget">'
    47     '<div class="Ldt-AnnotationsListWidget">'
    48     + '<ul class="Ldt-AnnotationsList-ul">'
    48     + '<ul class="Ldt-AnnotationsList-ul">'
    49     + '{{#annotations}}'
    49     + '</ul>'
    50     + '<li class="Ldt-AnnotationsList-li Ldt-TraceMe" trace-info="annotation-id:{{id}}, media-id:{{media_id}}" style="{{specific_style}}">'
    50     + '</div>';
       
    51 
       
    52 IriSP.Widgets.AnnotationsList.prototype.annotationTemplate = 
       
    53     '<li class="Ldt-AnnotationsList-li Ldt-TraceMe" trace-info="annotation-id:{{id}}, media-id:{{media_id}}" style="{{specific_style}}">'
    51     + '<div class="Ldt-AnnotationsList-ThumbContainer">'
    54     + '<div class="Ldt-AnnotationsList-ThumbContainer">'
    52     + '<a href="{{url}}">'
    55     + '<a href="{{url}}">'
    53     + '<img class="Ldt-AnnotationsList-Thumbnail" src="{{thumbnail}}" />'
    56     + '<img class="Ldt-AnnotationsList-Thumbnail" src="{{thumbnail}}" />'
    54     + '</a>'
    57     + '</a>'
    55     + '</div>'
    58     + '</div>'
    67     + '</li>'
    70     + '</li>'
    68     + '{{/.}}'
    71     + '{{/.}}'
    69     + '{{/tags}}'
    72     + '{{/tags}}'
    70     + '</ul>'
    73     + '</ul>'
    71     + '{{/tags.length}}'
    74     + '{{/tags.length}}'
    72     + '</li>'
    75     + '</li>';
    73     + '{{/annotations}}'
       
    74     + '</ul>'
       
    75     + '</div>';
       
    76 
    76 
    77 IriSP.Widgets.AnnotationsList.prototype.onSearch = function(searchString) {
    77 IriSP.Widgets.AnnotationsList.prototype.onSearch = function(searchString) {
    78     this.searchString = typeof searchString !== "undefined" ? searchString : '';
    78     this.searchString = typeof searchString !== "undefined" ? searchString : '';
    79     var _n = this.refresh(true);
    79     var _n = this.refresh(true);
    80     if (this.searchString) {
    80     if (this.searchString) {
   168     var _ids = _list.idIndex;
   168     var _ids = _list.idIndex;
   169     
   169     
   170     if (_forceRedraw || !IriSP._.isEqual(_ids, this.lastIds)) {
   170     if (_forceRedraw || !IriSP._.isEqual(_ids, this.lastIds)) {
   171         /* This part only gets executed if the list needs updating */
   171         /* This part only gets executed if the list needs updating */
   172         this.lastIds = _ids;
   172         this.lastIds = _ids;
   173         var _data = _list.map(function(_annotation) {
   173         this.list_$.html("");
   174                     var _url = (
   174         _list.forEach(function(_annotation) {
   175                         ( typeof _annotation.url !== "undefined" && _annotation.url)
   175             var _url = (
   176                         ? _annotation.url
   176                 ( typeof _annotation.url !== "undefined" && _annotation.url)
   177                         : (
   177                 ? _annotation.url
   178                             ( typeof _this.source.projectId !== "undefined" && typeof _annotation.project !== "undefined" && _annotation.project && _this.source.projectId !== _annotation.project )
   178                 : (
   179                             ? Mustache.to_html(
   179                     ( typeof _this.source.projectId !== "undefined" && typeof _annotation.project !== "undefined" && _annotation.project && _this.source.projectId !== _annotation.project )
   180                                 _this.foreign_url,
   180                     ? Mustache.to_html(
   181                                 {
   181                         _this.foreign_url,
   182                                     project : _annotation.project,
   182                         {
   183                                     media : _annotation.media.id,
   183                             project : _annotation.project,
   184                                     annotation : _annotation.id,
   184                             media : _annotation.media.id,
   185                                     annotationType : _annotation.annotationType.id
   185                             annotation : _annotation.id,
   186                                 }
   186                             annotationType : _annotation.annotationType.id
   187                             )
       
   188                             : '#id=' + _annotation.id
       
   189                             )
       
   190                     );
       
   191                     var _title = (_annotation.title || "").replace(_annotation.description,''),
       
   192                         _description = _annotation.description;
       
   193                     if (!_annotation.title) {
       
   194                         _title = _annotation.creator;
       
   195                     }
       
   196                     if (!_annotation.description && _annotation.creator) {
       
   197                         _description = _annotation.title;
       
   198                         _title = _annotation.creator;
       
   199                     }
       
   200                     var _bgcolor;
       
   201                     IriSP._(_this.polemics).each(function(_polemic) {
       
   202                         var _rgxp = IriSP.Model.regexpFromTextOrArray(_polemic.keyword, true);
       
   203                         if (_rgxp.test(_title + " " + _description)) {
       
   204                             _bgcolor = _polemic.background_color;
       
   205                         }
   187                         }
   206                     });
   188                     )
   207                     var _res = {
   189                     : '#id=' + _annotation.id
   208                         id : _annotation.id,
   190                     )
   209                         media_id : _annotation.getMedia().id,
   191             );
   210                         title : _title,
   192             var _title = (_annotation.title || "").replace(_annotation.description,''),
   211                         description : _description,
   193                 _description = _annotation.description;
   212                         begin : _annotation.begin.toString(),
   194             if (!_annotation.title) {
   213                         end : _annotation.end.toString(),
   195                 _title = _annotation.creator;
   214                         thumbnail : typeof _annotation.thumbnail !== "undefined" && _annotation.thumbnail ? _annotation.thumbnail : _this.default_thumbnail,
   196             }
   215                         url : _url,
   197             if (!_annotation.description && _annotation.creator) {
   216                         tags : _annotation.getTagTexts(),
   198                 _description = _annotation.title;
   217                         specific_style : (typeof _bgcolor !== "undefined" ? "background: " + _bgcolor : "")
   199                 _title = _annotation.creator;
   218                     }
   200             }
   219                     return _res;
   201             var _bgcolor;
   220             }),
   202             IriSP._(_this.polemics).each(function(_polemic) {
   221             _html = Mustache.to_html(
   203                 var _rgxp = IriSP.Model.regexpFromTextOrArray(_polemic.keyword, true);
   222                 this.template,
   204                 if (_rgxp.test(_title + " " + _description)) {
   223                 {
   205                     _bgcolor = _polemic.background_color;
   224                     annotations : _data
   206                 }
   225                 });
   207             });
   226     
   208             var _data = {
   227         this.$.html(_html);
   209                 id : _annotation.id,
       
   210                 media_id : _annotation.getMedia().id,
       
   211                 title : _title,
       
   212                 description : _description,
       
   213                 begin : _annotation.begin.toString(),
       
   214                 end : _annotation.end.toString(),
       
   215                 thumbnail : typeof _annotation.thumbnail !== "undefined" && _annotation.thumbnail ? _annotation.thumbnail : _this.default_thumbnail,
       
   216                 url : _url,
       
   217                 tags : _annotation.getTagTexts(),
       
   218                 specific_style : (typeof _bgcolor !== "undefined" ? "background-color: " + _bgcolor : "")
       
   219             };
       
   220             var _html = Mustache.to_html(_this.annotationTemplate, _data);
       
   221             var _el = IriSP.jQuery(_html);
       
   222             _el.mouseover(function() {
       
   223                     _annotation.trigger("select");
       
   224                 })
       
   225                 .mouseout(function() {
       
   226                     _annotation.trigger("unselect");
       
   227                 })
       
   228                 .appendTo(_this.list_$);
       
   229             _annotation.on("select", function() {
       
   230                 _this.annotations_$.removeClass("selected");
       
   231                 _el.addClass("selected");
       
   232             });
       
   233             _annotation.on("unselect", function() {
       
   234                 _this.annotations_$.removeClass("selected");
       
   235             });;
       
   236         });
       
   237         
       
   238         this.annotations_$ = this.$.find('.Ldt-AnnotationsList-li');
   228         
   239         
   229         /* Correct the empty tag bug */
   240         /* Correct the empty tag bug */
   230         this.$.find('.Ldt-AnnotationsList-Tag-Li').each(function() {
   241         this.$.find('.Ldt-AnnotationsList-Tag-Li').each(function() {
   231             var _el = IriSP.jQuery(this);
   242             var _el = IriSP.jQuery(this);
   232             if (!_el.text().replace(/(^\s+|\s+$)/g,'')) {
   243             if (!_el.text().replace(/(^\s+|\s+$)/g,'')) {
   259     return _list.length;
   270     return _list.length;
   260 }
   271 }
   261 
   272 
   262 IriSP.Widgets.AnnotationsList.prototype.draw = function() {
   273 IriSP.Widgets.AnnotationsList.prototype.draw = function() {
   263     
   274     
       
   275     this.renderTemplate();
       
   276     
       
   277     this.list_$ = this.$.find(".Ldt-AnnotationsList-ul");
       
   278     
   264     this.bindPopcorn("IriSP.search", "onSearch");
   279     this.bindPopcorn("IriSP.search", "onSearch");
   265     this.bindPopcorn("IriSP.search.closed", "onSearch");
   280     this.bindPopcorn("IriSP.search.closed", "onSearch");
   266     this.bindPopcorn("IriSP.search.cleared", "onSearch");
   281     this.bindPopcorn("IriSP.search.cleared", "onSearch");
   267     this.bindPopcorn("IriSP.AnnotationsList.refresh","refresh");
   282     this.bindPopcorn("IriSP.AnnotationsList.refresh","refresh");
   268     
   283