src/js/widgets/annotationsListWidget.js
branchpopcorn-port
changeset 833 33a5d5882be4
parent 820 7968346b9689
child 835 a8af9da7c622
equal deleted inserted replaced
832:6397a2ca3a67 833:33a5d5882be4
     1 IriSP.AnnotationsListWidget = function(Popcorn, config, Serializer) {
     1 IriSP.AnnotationsListWidget = function(Popcorn, config, Serializer) {
     2   IriSP.Widget.call(this, Popcorn, config, Serializer);
     2   IriSP.Widget.call(this, Popcorn, config, Serializer);
     3   this.__counter = 0;
     3   this.__counter = 0;
     4   this.__oldList = [];
     4   this.__oldList = [];
     5   
     5  
     6   this.ajax_mode = IriSP.widgetsDefaults["AnnotationsListWidget"].ajax_mode;
     6   this.checkOption('ajax_mode');
     7   this.project_url = IriSP.widgetsDefaults["AnnotationsListWidget"].project_url;  
     7   this.checkOption('project_url');
       
     8   this.checkOption('default_thumbnail');
       
     9   this.checkOption("cinecast_version", false);
       
    10   var _this = this;
     8 };
    11 };
     9 
    12 
    10 
    13 
    11 IriSP.AnnotationsListWidget.prototype = new IriSP.Widget();
    14 IriSP.AnnotationsListWidget.prototype = new IriSP.Widget();
    12 
    15 
    20 IriSP.AnnotationsListWidget.prototype.do_redraw = function(list) {
    23 IriSP.AnnotationsListWidget.prototype.do_redraw = function(list) {
    21     var widgetMarkup = IriSP.templToHTML(IriSP.annotationsListWidget_template, {annotations: list});
    24     var widgetMarkup = IriSP.templToHTML(IriSP.annotationsListWidget_template, {annotations: list});
    22     this.selector.html(widgetMarkup);
    25     this.selector.html(widgetMarkup);
    23 };
    26 };
    24 
    27 
       
    28 IriSP.AnnotationsListWidget.prototype.transformAnnotation = function(a) {
       
    29     var _this = this
       
    30     return {
       
    31         "id" : a.id,
       
    32         "title": this.cinecast_version ? IriSP.get_aliased(a.meta, ['creator_name', 'creator']) : a.content.title,
       
    33         "desc" : this.cinecast_version ? a.content.data : a.content.description,
       
    34         "begin": IriSP.msToTime(a.begin),
       
    35         "end" : IriSP.msToTime(a.end),
       
    36         "thumbnail" : (typeof a.meta == "object" && typeof a.meta.thumbnail == "string") ? a.meta.thumbnail : this.default_thumbnail,
       
    37         "url" : (typeof a.meta == "object" && typeof a.meta.url == "string") ? a.meta.url : null,
       
    38         "tags": typeof a.tags == "object"
       
    39             ? IriSP.underscore(a.tags)
       
    40                 .chain()
       
    41                 .map(function(_t) {
       
    42                     if (typeof _t == "string") {
       
    43                         return _t.replace(/^.*:/,'#');
       
    44                     } else {
       
    45                         if (typeof _t['id-ref'] != "undefined") {
       
    46                             var _f = IriSP.underscore.find(_this._serializer._data.tags, function(_tag) {
       
    47                                 return _tag['id-ref'] == _t.id;
       
    48                             });
       
    49                             if (typeof _f != "undefined") {
       
    50                                 return IriSP.get_aliased(_f.meta, ['dc:title', 'title']);
       
    51                             }
       
    52                         }
       
    53                     }
       
    54                     return null;
       
    55                 })
       
    56                 .filter(function(_t) {
       
    57                     return _t !== null && _t !== ""
       
    58                 })
       
    59                 .value()
       
    60             : []
       
    61     }    
       
    62 }
       
    63 
    25 /** draw the annotation list */
    64 /** draw the annotation list */
    26 IriSP.AnnotationsListWidget.prototype.drawList = function(force_redraw) {
    65 IriSP.AnnotationsListWidget.prototype.drawList = function(force_redraw) {
    27   var _this = this;
    66   var _this = this;
    28   
    67   
    29   var view_type = this._serializer.getContributions();
    68 //  var view_type = this._serializer.getContributions();
    30   var annotations = this._serializer._data.annotations;
    69   var annotations = this._serializer._data.annotations;
    31   var currentTime = this._Popcorn.currentTime();
    70   var currentTime = this._Popcorn.currentTime();
    32     
       
    33   var list = [];
    71   var list = [];
    34 
    72 
    35   if (typeof(view_type) === "undefined") {    
    73 /*  if (typeof(view_type) === "undefined") {    
    36     return;
    74     return;
    37   }
    75 } */
    38 
       
    39   for (i = 0; i < annotations.length; i++) {
    76   for (i = 0; i < annotations.length; i++) {
    40     var annotation = annotations[i];
    77     var obj = this.transformAnnotation(annotations[i]);
    41 
    78     obj.iterator = i;
    42     /* filter the annotations whose type is not the one we want */
    79     obj.distance = Math.abs((annotations[i].end + annotations[i].begin) / 2000 - currentTime);
    43     if (typeof(annotation.meta) !== "undefined" && typeof(annotation.meta["id-ref"]) !== "undefined"
       
    44           && annotation.meta["id-ref"] !== view_type) {
       
    45         continue;
       
    46     }
       
    47 
       
    48     /* only get the annotations happening in the current chapter */
       
    49     if (!(annotation.begin <= currentTime * 1000 && annotation.end > currentTime * 1000)) {        
       
    50         continue;
       
    51     }
       
    52 
       
    53     var a = annotation;
       
    54     var obj = {};
       
    55 
       
    56     obj["id"] = a.id;
       
    57     obj["title"] = a.content.title;
       
    58     obj["desc"] = a.content.description;
       
    59     obj["begin"] = IriSP.msToTime(annotation.begin);
       
    60     obj["end"] = IriSP.msToTime(annotation.end);
       
    61 
       
    62     list.push(obj);
    80     list.push(obj);
    63   }
    81   }
    64   
    82   
       
    83   list = IriSP.underscore(list)
       
    84     .chain()
       
    85     .sortBy(function(_o) {
       
    86         return _o.distance;
       
    87     })
       
    88     .first(10)
       
    89     .sortBy(function(_o) {
       
    90         return _o.iterator;
       
    91     })
       
    92     .value();
       
    93   
    65   var idList = IriSP.underscore.pluck(list, "id").sort();
    94   var idList = IriSP.underscore.pluck(list, "id").sort();
    66 
    95 
    67   if (idList.length !== this.__oldList.length) {
    96   
       
    97   if (!IriSP.underscore.isEqual(this.__oldList, idList) || typeof(force_redraw) !== "undefined") {
    68     this.do_redraw(list);
    98     this.do_redraw(list);
    69   }
    99     this.__oldList = idList;
    70     
   100   }
    71   var res = 1;
   101    /* save for next call */
    72   for (var i = 0; i < idList.length; i++) {
   102   
    73     if (idList[i] !== this.__oldList[i])
       
    74       res = 0;
       
    75       break;
       
    76   }
       
    77   
       
    78   this.__oldList = idList; /* save for next call */
       
    79   
       
    80   if (typeof(force_redraw) !== "undefined") {
       
    81     this.do_redraw(list);
       
    82   }
       
    83   
       
    84   /* the two lists are equal, no need to redraw */
       
    85   if (res === 1) {
       
    86     return;
       
    87   } else {
       
    88     this.do_redraw(list);
       
    89   }
       
    90   
   103   
    91 };
   104 };
    92 
   105 
    93 IriSP.AnnotationsListWidget.prototype.ajaxRedraw = function(timecode) {
   106 IriSP.AnnotationsListWidget.prototype.ajaxRedraw = function(timecode) {
    94 
   107 
   123   var templ = Mustache.to_html(platf_url, {media: media_id, begin: begin_timecode,
   136   var templ = Mustache.to_html(platf_url, {media: media_id, begin: begin_timecode,
   124                                  end: end_timecode});
   137                                  end: end_timecode});
   125 
   138 
   126   /* we create on the fly a serializer to get the ajax */
   139   /* we create on the fly a serializer to get the ajax */
   127   var serializer = new IriSP.JSONSerializer(IriSP.__dataloader, templ);
   140   var serializer = new IriSP.JSONSerializer(IriSP.__dataloader, templ);
   128   serializer.sync(IriSP.wrap(this, function(json) { this.processJson(json, serializer) }));                  
   141   serializer.sync(IriSP.wrap(this, function(json) { this.processJson(json, serializer) }));
   129 };
   142 };
   130 
   143 
   131 /** process the received json - it's a bit hackish */
   144 /** process the received json - it's a bit hackish */
   132 IriSP.AnnotationsListWidget.prototype.processJson = function(json, serializer) {
   145 IriSP.AnnotationsListWidget.prototype.processJson = function(json, serializer) {
   133   /* FIXME: DRY the whole thing */
   146   /* FIXME: DRY the whole thing */
   142   var l = [];
   155   var l = [];
   143   
   156   
   144   var media = this._serializer.currentMedia()["id"];
   157   var media = this._serializer.currentMedia()["id"];
   145   
   158   
   146   for (i = 0; i < annotations.length; i++) {
   159   for (i = 0; i < annotations.length; i++) {
   147       var annotation = annotations[i];
   160     var obj = this.transformAnnotation(annotations[i])
   148 
       
   149       /* filter the annotations whose type is not the one we want */
       
   150       /* We want _all_ the annotations.
       
   151       if (typeof(annotation.meta) !== "undefined" && typeof(annotation.meta["id-ref"]) !== "undefined"
       
   152             && !IriSP.underscore.include(view_types, annotation.meta["id-ref"])) {
       
   153           continue;
       
   154       }
       
   155       */
       
   156       var a = annotation;
       
   157       var obj = {};
       
   158 
       
   159       obj["id"] = a.id;
       
   160       obj["title"] = a.content.title;
       
   161       obj["desc"] = a.content.description;
       
   162       obj["begin"] = IriSP.msToTime(annotation.begin);
       
   163       obj["end"] = IriSP.msToTime(annotation.end);
       
   164 
   161 
   165       /* only if the annotation isn't present in the document create an
   162       /* only if the annotation isn't present in the document create an
   166          external link */
   163          external link */
   167       if (!this.annotations_ids.hasOwnProperty(obj["id"])) {
   164       if (!this.annotations_ids.indexOf(obj["id"]) != -1) {
   168         // braindead url; jacques didn't want to create a new one in the platform,
   165         // braindead url; jacques didn't want to create a new one in the platform,
   169         // so we append the cutting id to the url.
   166         // so we append the cutting id to the url.
   170         obj["url"] = this.project_url + "/" + media + "/" + 
   167         obj["url"] = this.project_url + "/" + media + "/" + 
   171                      annotation.meta["project"] + "/" +
   168                      annotation.meta["project"] + "/" +
   172                      annotation.meta["id-ref"];
   169                      annotation.meta["id-ref"];
   182 IriSP.AnnotationsListWidget.prototype.draw = function() {
   179 IriSP.AnnotationsListWidget.prototype.draw = function() {
   183   
   180   
   184   /* build a table of the annotations present in the document for faster 
   181   /* build a table of the annotations present in the document for faster 
   185      lookup
   182      lookup
   186   */
   183   */
   187   this.annotations_ids = {};
   184   this.annotations_ids = [];
   188   
   185   
   189   var annotations = this._serializer._data.annotations;
   186   var annotations = this._serializer._data.annotations;
   190   var i = 0;
   187   var i = 0;
   191   for(i = 0; i < annotations.length; i++) {
   188   for(i = 0; i < annotations.length; i++) {
   192     this.annotations_ids[annotations[i]["id"]] = 1;
   189     this.annotations_ids.push(annotations[i]["id"]);
   193   }
   190   }
   194   
   191   
   195   this.drawList();
   192   this.drawList();
       
   193   
       
   194   var _this = this;
   196     
   195     
   197   if (!this.ajax_mode) {    
   196   if (!this.ajax_mode) {
   198     this._Popcorn.listen("IriSP.createAnnotationWidget.addedAnnotation", IriSP.wrap(this, function() { this.drawList(true); }));
   197       var _throttled = IriSP.underscore.throttle(function() {
   199     this._Popcorn.listen("timeupdate", IriSP.wrap(this, this.redraw));
   198       _this.drawList();
       
   199     }, 1500);
       
   200     this._Popcorn.listen("IriSP.createAnnotationWidget.addedAnnotation", _throttled);
       
   201     this._Popcorn.listen("timeupdate", _throttled);
   200   } else {
   202   } else {
   201     /* update the widget when the video has finished loading and when it's seeked and paused */
   203     /* update the widget when the video has finished loading and when it's seeked and paused */
   202     this._Popcorn.listen("seeked", IriSP.wrap(this, this.ajaxRedraw));
   204     this._Popcorn.listen("seeked", IriSP.wrap(this, this.ajaxRedraw));
   203     this._Popcorn.listen("loadedmetadata", IriSP.wrap(this, this.ajaxRedraw));
   205     this._Popcorn.listen("loadedmetadata", IriSP.wrap(this, this.ajaxRedraw));
   204     this._Popcorn.listen("paused", IriSP.wrap(this, this.ajaxRedraw));
   206     this._Popcorn.listen("paused", IriSP.wrap(this, this.ajaxRedraw));
   205     
   207     
   206     this._Popcorn.listen("IriSP.createAnnotationWidget.addedAnnotation", IriSP.wrap(this, this.ajaxRedraw));
   208     this._Popcorn.listen("IriSP.createAnnotationWidget.addedAnnotation", IriSP.wrap(this, this.ajaxRedraw));
   207   }
   209   }
   208 
   210 
   209 };
   211 };
   210 
       
   211 IriSP.AnnotationsListWidget.prototype.redraw = function() {
       
   212   this.drawList();
       
   213 };