server/src/remie/static/remie/metadataplayer/AnnotationsList.js
changeset 36 3e47f3eb145b
parent 11 e2a3375c5a0a
child 55 75290150fc31
equal deleted inserted replaced
35:f40a84c7cebf 36:3e47f3eb145b
    69 };
    69 };
    70 
    70 
    71 IriSP.Widgets.AnnotationsList.prototype.messages = {
    71 IriSP.Widgets.AnnotationsList.prototype.messages = {
    72     en: {
    72     en: {
    73         voice_annotation: "Voice Annotation",
    73         voice_annotation: "Voice Annotation",
    74         now_playing: "Now playing..."
    74         now_playing: "Now playing...",
       
    75         everyone: "Everyone"
    75     },
    76     },
    76     fr: {
    77     fr: {
    77         voice_annotation: "Annotation Vocale",
    78         voice_annotation: "Annotation Vocale",
    78         now_playing: "Lecture en cours..."
    79         now_playing: "Lecture en cours...",
       
    80         everyone: "Tous"
    79     }
    81     }
    80 };
    82 };
    81 
    83 
    82 IriSP.Widgets.AnnotationsList.prototype.template =
    84 IriSP.Widgets.AnnotationsList.prototype.template =
    83     '<div class="Ldt-AnnotationsListWidget">'
    85     '<div class="Ldt-AnnotationsListWidget">'
    84     + '{{#show_filters}}'
    86     + '{{#show_filters}}'
    85     + '<div class="Ldt-AnnotationsList-Filters">'
    87     + '<div class="Ldt-AnnotationsList-Filters">'
    86     +    '<input class="Ldt-AnnotationsList-filter-text" type="text" value="Mot-clés"></input>'
    88     +    '<input class="Ldt-AnnotationsList-filter-text" id="Ldt-AnnotationsList-keywordsFilter" type="text" value=""></input>'
    87     +    '<select class="Ldt-AnnotationsList-filter-dropdown"></select>'
    89     +    '<select class="Ldt-AnnotationsList-filter-dropdown" id="Ldt-AnnotationsList-userFilter"><option selected value="">{{l10n.everyone}}</option></select>'
    88     +    '<label class="Ldt-AnnotationsList-filter-checkbox"><input type="checkbox">Toutes annotations</label>'
    90     +    '<label class="Ldt-AnnotationsList-filter-date">Date: <input id="Ldt-AnnotationsList-dateFilter" type="text"></input></label>'
       
    91     +    '<label class="Ldt-AnnotationsList-filter-checkbox"><input type="checkbox" id="Ldt-AnnotationsList-ignoreSegmentsFilter">Toutes annotations</label>'
    89     + '</div>'
    92     + '</div>'
    90     + '{{/show_filters}}'
    93     + '{{/show_filters}}'
    91     + '{{#show_audio}}<div class="Ldt-AnnotationsList-Audio"></div>{{/show_audio}}'
    94     + '{{#show_audio}}<div class="Ldt-AnnotationsList-Audio"></div>{{/show_audio}}'
    92     + '<ul class="Ldt-AnnotationsList-ul">'
    95     + '<ul class="Ldt-AnnotationsList-ul">'
    93     + '</ul>'
    96     + '</ul>'
   175         }
   178         }
   176     }
   179     }
   177     _list = _list.filter(function(_annotation) {
   180     _list = _list.filter(function(_annotation) {
   178         return _annotation.found !== false;
   181         return _annotation.found !== false;
   179     });
   182     });
   180     if (this.filter_by_segments) {
   183     
       
   184     if ((this.filter_by_segments)&&(!(this.show_filters && this.ignoresegmentcheckbox_$[0].checked))) {
   181         /*
   185         /*
   182          *  A given annotation is considered "in" segment if the middle of it is between the segment beginning and the segment end. 
   186          *  A given annotation is considered "in" segment if the middle of it is between the segment beginning and the segment end. 
   183          *  Note this is meant to be used for "markings" annotations (not segments)
   187          *  Note this is meant to be used for "markings" annotations (not segments)
   184          */
   188          */
   185         _segmentsAnnotation = this.currentSource.getAnnotationsByTypeTitle(this.segments_annotation_type)
   189         _segmentsAnnotation = this.currentSource.getAnnotationsByTypeTitle(this.segments_annotation_type)
   207         /* Get the n annotations closest to current timecode */
   211         /* Get the n annotations closest to current timecode */
   208         _list = _list.sortBy(function(_annotation) {
   212         _list = _list.sortBy(function(_annotation) {
   209             return Math.abs((_annotation.begin + _annotation.end) / 2 - _currentTime);
   213             return Math.abs((_annotation.begin + _annotation.end) / 2 - _currentTime);
   210         }).slice(0, this.limit_count);
   214         }).slice(0, this.limit_count);
   211     }
   215     }
       
   216     
   212     if (this.newest_first) {
   217     if (this.newest_first) {
   213         _list = _list.sortBy(function(_annotation) {
   218         _list = _list.sortBy(function(_annotation) {
   214             return -_annotation.created.valueOf();
   219             return -_annotation.created.valueOf();
   215         });
   220         });
   216     } else {
   221     } else {
   217         _list = _list.sortBy(function(_annotation) {
   222         _list = _list.sortBy(function(_annotation) {
   218             return _annotation.begin;
   223             return _annotation.begin;
   219         });
   224         });
       
   225     }
       
   226     
       
   227     if (this.show_filters){
       
   228         _username = this.userselect_$[0].options[this.userselect_$[0].selectedIndex].value;
       
   229         if (_username != "false")
       
   230         {
       
   231             _list = _list.filter(function(_annotation){
       
   232                 return _annotation.creator == _username
       
   233             })
       
   234         }
       
   235         _keyword = this.keywordinput_$[0].value;
       
   236         if (_keyword != ""){
       
   237             _list = _list.filter(function(_annotation){
       
   238                return _annotation.description.toLowerCase().match(_keyword.toLowerCase());
       
   239             });
       
   240         }
       
   241         
       
   242         _date = this.datefilterinput_$[0].value
       
   243         if(_date != ""){
       
   244             _list = _list.filter(function(_annotation){
       
   245                 return _annotation.created.toLocaleDateString() == _date
       
   246             });
       
   247         }
       
   248         
   220     }
   249     }
   221     
   250     
   222     var _ids = _list.idIndex;
   251     var _ids = _list.idIndex;
   223     
   252     
   224     if (_forceRedraw || !IriSP._.isEqual(_ids, this.lastIds) || this.searchString !== this.lastSearch) {
   253     if (_forceRedraw || !IriSP._.isEqual(_ids, this.lastIds) || this.searchString !== this.lastSearch) {
   332                     _annotation.trigger("select");
   361                     _annotation.trigger("select");
   333                 })
   362                 })
   334                 .mouseout(function() {
   363                 .mouseout(function() {
   335                     _annotation.trigger("unselect");
   364                     _annotation.trigger("unselect");
   336                 })
   365                 })
       
   366                 .click(function() {
       
   367                     _annotation.trigger("click");
       
   368                 })
   337                 .appendTo(_this.list_$);
   369                 .appendTo(_this.list_$);
   338             IriSP.attachDndData(_el.find("[draggable]"), {
   370             IriSP.attachDndData(_el.find("[draggable]"), {
   339                 title: _title,
   371                 title: _title,
   340                 description: _description,
   372                 description: _description,
   341                 uri: _url,
   373                 uri: _url,
   426     
   458     
   427     var _this = this;
   459     var _this = this;
   428         
   460         
   429     this.list_$ = this.$.find(".Ldt-AnnotationsList-ul");
   461     this.list_$ = this.$.find(".Ldt-AnnotationsList-ul");
   430     this.widget_$ = this.$.find(".Ldt-AnnotationsListWidget");
   462     this.widget_$ = this.$.find(".Ldt-AnnotationsListWidget");
   431     
   463     this.userselect_$ = this.$.find("#Ldt-AnnotationsList-userFilter");
       
   464     this.userselect_$.change(function(){
       
   465         _this.player.trigger("AnnotationsList.refresh");
       
   466     });
       
   467     this.keywordinput_$ = this.$.find("#Ldt-AnnotationsList-keywordsFilter");
       
   468     this.keywordinput_$.keyup(function(){
       
   469         _this.player.trigger("AnnotationsList.refresh");
       
   470     });
       
   471     this.ignoresegmentcheckbox_$ = this.$.find("#Ldt-AnnotationsList-ignoreSegmentsFilter");
       
   472     this.ignoresegmentcheckbox_$.click(function(){
       
   473         _this.player.trigger("AnnotationsList.refresh");
       
   474     });
       
   475     this.datefilterinput_$ = this.$.find("#Ldt-AnnotationsList-dateFilter");
       
   476     this.datefilterinput_$.datepicker({ dateFormat: 'dd/mm/yy' });
       
   477     this.datefilterinput_$.change(function(){
       
   478         _this.player.trigger("AnnotationsList.refresh")
       
   479     })
   432     
   480     
   433     this.source.getAnnotations().on("search", function(_text) {
   481     this.source.getAnnotations().on("search", function(_text) {
   434         _this.searchString = _text;
   482         _this.searchString = _text;
   435         if (_this.source !== _this.currentSource) {
   483         if (_this.source !== _this.currentSource) {
   436             _this.currentSource.getAnnotations().search(_text);
   484             _this.currentSource.getAnnotations().search(_text);
   450         }
   498         }
   451     });
   499     });
   452     this.source.getAnnotations().on("search-cleared", function() {
   500     this.source.getAnnotations().on("search-cleared", function() {
   453         _this.throttledRefresh();
   501         _this.throttledRefresh();
   454     });
   502     });
       
   503     
       
   504     if (this.show_filters){
       
   505         _usernames = Array();
       
   506         _list = this.getWidgetAnnotations()
       
   507         _list.forEach(function(_annotation){
       
   508             if(_usernames.indexOf(_annotation.creator) == -1){
       
   509                 _usernames.push(_annotation.creator);
       
   510             }
       
   511         });
       
   512         this.userselect_$.html("<option selected value='false'>"+this.l10n.everyone+"</option>");
       
   513         _usernames.forEach(function(_user){
       
   514             _this.userselect_$.append("<option value='"+_user+"'>"+_user+"</option>");
       
   515         });
       
   516     }
   455     
   517     
   456     this.onMdpEvent("AnnotationsList.refresh", function() {
   518     this.onMdpEvent("AnnotationsList.refresh", function() {
   457         if (_this.ajax_url) {
   519         if (_this.ajax_url) {
   458             if (_this.mashupMode) {
   520             if (_this.mashupMode) {
   459                 _this.ajaxMashup();
   521                 _this.ajaxMashup();