src/js/widgets/createAnnotationWidget.js
branchpopcorn-port
changeset 842 4ae2247a59f4
parent 841 8da49ff273e0
child 852 eefb64f74a3f
equal deleted inserted replaced
841:8da49ff273e0 842:4ae2247a59f4
    12             "error_while_contacting": "An error happened while contacting the server. Your annotation has not been saved.",
    12             "error_while_contacting": "An error happened while contacting the server. Your annotation has not been saved.",
    13             "empty_annotation": "Your annotation is empty. Please write something before submitting.",
    13             "empty_annotation": "Your annotation is empty. Please write something before submitting.",
    14             "annotation_saved": "Thank you, your annotation has been saved.",
    14             "annotation_saved": "Thank you, your annotation has been saved.",
    15             "share_annotation": "Would you like to share it on social networks ?",
    15             "share_annotation": "Would you like to share it on social networks ?",
    16             "share_on": "Share on",
    16             "share_on": "Share on",
    17             "moar_tags": "More tags"
    17             "more_tags": "More tags"
    18         },
    18         },
    19         "fr": {
    19         "fr": {
    20             "submit": "Envoyer",
    20             "submit": "Envoyer",
    21             "add_keywords": "Ajouter des mots-clés",
    21             "add_keywords": "Ajouter des mots-clés",
    22             "add_polemic_keywords": "Ajouter des mots-clés polémiques",
    22             "add_polemic_keywords": "Ajouter des mots-clés polémiques",
    26             "error_while_contacting": "Une erreur s'est produite en contactant le serveur. Votre annotation n'a pas été enregistrée",
    26             "error_while_contacting": "Une erreur s'est produite en contactant le serveur. Votre annotation n'a pas été enregistrée",
    27             "empty_annotation": "Votre annotation est vide. Merci de rédiger un texte avant de l'envoyer.",
    27             "empty_annotation": "Votre annotation est vide. Merci de rédiger un texte avant de l'envoyer.",
    28             "annotation_saved": "Merci, votre annotation a été enregistrée.",
    28             "annotation_saved": "Merci, votre annotation a été enregistrée.",
    29             "share_annotation": "Souhaitez-vous la partager sur les réseaux sociaux ?",
    29             "share_annotation": "Souhaitez-vous la partager sur les réseaux sociaux ?",
    30             "share_on": "Partager sur",
    30             "share_on": "Partager sur",
    31             "moar_tagz": "Plus de mots-clés"
    31             "more_tags": "Plus de mots-clés"
    32         }
    32         }
    33     }
    33     }
    34 );
    34 );
    35 
    35 
    36 IriSP.createAnnotationWidget = function(Popcorn, config, Serializer) {
    36 IriSP.createAnnotationWidget = function(Popcorn, config, Serializer) {
    37   IriSP.Widget.call(this, Popcorn, config, Serializer);
    37   IriSP.Widget.call(this, Popcorn, config, Serializer);
    38   this._hidden = true;
    38   this._hidden = true;
    39   
       
    40   this.checkOption("keywords");
       
    41   this.checkOption("polemic_mode", true);
       
    42   this.checkOption("polemics");
       
    43   this.checkOption("cinecast_version", false);
       
    44   this.checkOption("api_endpoint_template");
       
    45   this.checkOption("show_from_field", true);
       
    46   this.checkOption("api_method");
       
    47   this.checkOption("random_keywords");
       
    48   this.checkOption("disable_share", false);
       
    49                          
    39                          
    50   if (!IriSP.null_or_undefined(IriSP.user)) {
    40   if (!IriSP.null_or_undefined(IriSP.user)) {
    51       if (!IriSP.null_or_undefined(IriSP.user.avatar)) {
    41       if (!IriSP.null_or_undefined(IriSP.user.avatar)) {
    52         this.user_avatar = IriSP.user.avatar;
    42         this.user_avatar = IriSP.user.avatar;
    53       }
    43       }
    72     this.selector.find(".Ldt-SaKeywordText").text("");
    62     this.selector.find(".Ldt-SaKeywordText").text("");
    73 };
    63 };
    74 
    64 
    75 IriSP.createAnnotationWidget.prototype.draw = function() {
    65 IriSP.createAnnotationWidget.prototype.draw = function() {
    76     var _this = this;
    66     var _this = this;
    77     if (typeof this._config.remote_keywords != "undefined" && typeof this._config.remote_keywords) {
    67     if (typeof this.remote_tags == "object") {
    78         IriSP.jQuery.getJSON(this._config.remote_keywords, function(_json) {
    68         IriSP.jQuery.getJSON((typeof this.remote_tags.alias == "string" ? this.remote_tags.alias : this.remote_tags.url), function(_json) {
    79             _this.keywords = IriSP.underscore(_json.tags).map(function(_tag) {
    69             _this.tags = _json.tags;
    80                 return _tag.meta.description;
       
    81             });
       
    82             _this.drawCallback();
    70             _this.drawCallback();
    83         });
    71         });
    84     } else {
    72     } else {
    85         this.drawCallback();
    73         this.drawCallback();
    86     }
    74     }
    98     this.selector.hide();
    86     this.selector.hide();
    99   else {
    87   else {
   100     this.showStartScreen();
    88     this.showStartScreen();
   101   }
    89   }
   102   
    90   
   103   if (this.random_keywords) {
    91   if (this.random_tags) {
   104       this.selector.find(".Ldt-createAnnotation-keywords li").hide();
    92       this.selector.find(".Ldt-createAnnotation-keywords li").hide();
   105       this.showMoarTagz();
    93       this.showMoreTags();
   106       this.selector.find('.Ldt-createAnnotation-moar-keywordz').click(function() {
    94       this.selector.find('.Ldt-createAnnotation-moar-keywordz').click(function() {
   107           _this.showMoarTagz();
    95           _this.showMoreTags();
   108       })
    96       })
   109   }
    97   }
   110   // Add onclick event to both polemic and keywords buttons
    98   // Add onclick event to both polemic and keywords buttons
   111   
    99   
   112   this.selector.find(".Ldt-createAnnotation-keyword-button, .Ldt-createAnnotation-polemic-button").click(function() {
   100   this.selector.find(".Ldt-createAnnotation-keyword-button, .Ldt-createAnnotation-polemic-button").click(function() {
   115   });
   103   });
   116   
   104   
   117   // js_mod is a custom event because there's no simple way to test for a js
   105   // js_mod is a custom event because there's no simple way to test for a js
   118   // change in a textfield.                    
   106   // change in a textfield.                    
   119   this.selector.find(".Ldt-createAnnotation-Description")
   107   this.selector.find(".Ldt-createAnnotation-Description")
   120                .bind("propertychange keyup input paste click js_mod", IriSP.wrap(this, this.handleTextChanges));
   108                .bind("propertychange keyup input paste click js_mod", IriSP.wrap(this, this.handleTextChanges))
       
   109           .keyup(function(_e) {
       
   110               console.log(_e);
       
   111           });
   121                
   112                
   122   /* the cinecast version of the player is supposed to pause when the user clicks on the button */
   113   /* the cinecast version of the player is supposed to pause when the user clicks on the button */
   123 
   114 
   124   /* the cinecast version expects the user to comment on a defined segment.
   115   /* the cinecast version expects the user to comment on a defined segment.
   125      As the widget is always shown, we need a way to update it's content as
   116      As the widget is always shown, we need a way to update it's content as
   176       }
   167       }
   177     ));
   168     ));
   178   }
   169   }
   179 };
   170 };
   180 
   171 
   181 IriSP.createAnnotationWidget.prototype.showMoarTagz = function() {
   172 IriSP.createAnnotationWidget.prototype.showMoreTags = function() {
   182     for (var j=0; j < this.random_keywords; j++) {
   173     for (var j=0; j < this.random_tags; j++) {
   183         var _jq = this.selector.find(".Ldt-createAnnotation-keywords li:hidden");
   174         var _jq = this.selector.find(".Ldt-createAnnotation-keywords li:hidden");
   184         if (_jq.length > 1) {
   175         if (_jq.length > 1) {
   185             IriSP.jQuery(_jq[Math.floor(_jq.length*Math.random())]).show();
   176             IriSP.jQuery(_jq[Math.floor(_jq.length*Math.random())]).show();
   186         } else {
   177         } else {
   187             _jq.show();
   178             _jq.show();
   226     var currentTime = this._Popcorn.currentTime();
   217     var currentTime = this._Popcorn.currentTime();
   227     
   218     
   228     // block the arrow.
   219     // block the arrow.
   229     this._Popcorn.trigger("IriSP.ArrowWidget.blockArrow");
   220     this._Popcorn.trigger("IriSP.ArrowWidget.blockArrow");
   230     
   221     
   231     var duration = this._serializer.getDuration();
   222     var duration = this.getDuration();
   232         
   223         
   233     var currentChapter = this._serializer.currentChapitre(currentTime);
   224     var currentChapter = this._serializer.currentChapitre(currentTime);
   234 
   225 
   235     if (IriSP.null_or_undefined(currentChapter)) {      
   226     if (IriSP.null_or_undefined(currentChapter)) {      
   236       var left = this.selector.width() / 2;
   227       var left = this.selector.width() / 2;
   385   this.sliceWidth = params[1];
   376   this.sliceWidth = params[1];
   386 };
   377 };
   387 
   378 
   388 IriSP.createAnnotationWidget.prototype.sendLdtData = function(contents, callback) {
   379 IriSP.createAnnotationWidget.prototype.sendLdtData = function(contents, callback) {
   389   var _this = this;
   380   var _this = this;
   390   var apiJson = {annotations : [{}], meta: {}};
   381   var apiJson = {
       
   382       format : "http://advene.org/ns/cinelab/",
       
   383       annotations : [
       
   384         {}
       
   385         ],
       
   386         meta: {}};
   391   var annotation = apiJson.annotations[0];
   387   var annotation = apiJson.annotations[0];
   392   
   388   
   393   annotation.media = this._serializer.currentMedia()["id"];
   389   annotation.media = this.currentMedia()["id"];
   394   
   390   
   395   if (this.cinecast_version) {   
   391   if (this.cinecast_version) {   
   396       annotation.begin = Math.round(this._Popcorn.currentTime() * 1000);
   392       annotation.begin = Math.round(this._Popcorn.currentTime() * 1000);
   397       annotation.end = annotation.begin;      
   393       annotation.end = annotation.begin;      
   398   } else {
   394   } else {
   399     var duration = this._serializer.getDuration();    
   395     var duration = this.getDuration();    
   400     annotation.begin = +((duration * (this.sliceLeft / 100)).toFixed(0));
   396     annotation.begin = +((duration * (this.sliceLeft / 100)).toFixed(0));
   401     annotation.end = +((duration * ((this.sliceWidth + this.sliceLeft) / 100)).toFixed(0));
   397     annotation.end = +((duration * ((this.sliceWidth + this.sliceLeft) / 100)).toFixed(0));
   402   }
   398   }
   403 
   399 
   404   // boundary checks
   400   // boundary checks
   405   annotation.begin = Math.max(0, annotation.begin);
   401   annotation.begin = Math.max(0, annotation.begin);
   406   annotation.end = Math.min(this._serializer.getDuration(), annotation.end);
   402   annotation.end = Math.min(this.getDuration(), annotation.end);
   407   
   403   
   408   annotation.type = ( this.cinecast_version ? "cinecast:UserAnnotation" : ( this._serializer.getContributions() || "" ));
   404   annotation.type = ( this.cinecast_version ? "cinecast:UserAnnotation" : ( this._serializer.getContributions() || "" ));
   409   if (typeof(annotation.type) === "undefined")
   405   if (typeof(annotation.type) === "undefined")
   410     annotation.type = "";
   406     annotation.type = "";
   411   
   407   
   436       )
   432       )
   437   );
   433   );
   438   
   434   
   439   meta.created = Date().toString();
   435   meta.created = Date().toString();
   440   
   436   
   441   // All #hashtags are added to tags
   437   var _tags = [];
   442   var _tags = contents.toLowerCase().match(/#[^#\s]+\b/gim) || [];
   438   IriSP._(this.tags).each(function(_v) {
   443   this.selector.find('.Ldt-createAnnotation-keyword-button').each(function() {
   439       var _rx = IriSP.regexpFromText(_v.meta.description);
   444       var _tx = IriSP.jQuery(this).text(),
       
   445         _rx = IriSP.regexpFromText(_tx);
       
   446         if (_rx.test(contents)) {
   440         if (_rx.test(contents)) {
   447             _tags.push(_tx.toLowerCase())
   441             _tags.push(_v.id);
   448         }
   442         }
   449   });
   443   });
   450   
   444 
       
   445   if (typeof this.remote_tags == "object") {
       
   446      _tags = IriSP._(_tags).map(function(_t) {
       
   447          return _this.remote_tags.id + ':' + _t
       
   448      });
       
   449     if (typeof apiJson.imports == "undefined") {
       
   450        apiJson.imports = [];
       
   451     }
       
   452     apiJson.imports.push({
       
   453         "id" : this.remote_tags.id,
       
   454         "url" : this.remote_tags.url
       
   455     })
       
   456   }
   451   annotation.tags = IriSP.underscore.uniq(_tags);
   457   annotation.tags = IriSP.underscore.uniq(_tags);
   452   
       
   453   
   458   
   454   var jsonString = JSON.stringify(apiJson);
   459   var jsonString = JSON.stringify(apiJson);
   455   var project_id = this._serializer._data.meta.id;
   460   var project_id = this._serializer._data.meta.id;
   456   
   461   
   457   //TODO: extract magic url
   462   //TODO: extract magic url
   493                     annotation.is_new = true;
   498                     annotation.is_new = true;
   494                     // everything is shared so there's no need to propagate the change
   499                     // everything is shared so there's no need to propagate the change
   495                     _this._serializer._data.annotations.push(annotation);
   500                     _this._serializer._data.annotations.push(annotation);
   496  
   501  
   497                     _this._Popcorn.trigger("IriSP.createAnnotationWidget.addedAnnotation", annotation);
   502                     _this._Popcorn.trigger("IriSP.createAnnotationWidget.addedAnnotation", annotation);
       
   503                     this.selector.find(".Ldt-createAnnotation-Description").val("");
   498                     callback(annotation);
   504                     callback(annotation);
   499       }), 
   505       }), 
   500       error: 
   506       error: 
   501               function(jqXHR, textStatus, errorThrown) { 
   507               function(jqXHR, textStatus, errorThrown) { 
   502                             console.log("an error occured while contacting " 
   508                             console.log("an error occured while contacting "