57 }(keyword)); |
61 }(keyword)); |
58 } |
62 } |
59 |
63 |
60 this.selector.find(".Ldt-createAnnotation-Description") |
64 this.selector.find(".Ldt-createAnnotation-Description") |
61 .bind("propertychange keyup input paste", IriSP.wrap(this, this.handleTextChanges)); |
65 .bind("propertychange keyup input paste", IriSP.wrap(this, this.handleTextChanges)); |
|
66 |
|
67 /* the cinecast version of the player is supposed to pause when the user clicks on the button */ |
|
68 if (this.cinecast_version) |
|
69 this.selector.find(".Ldt-createAnnotation-Description") |
|
70 .one("propertychange keyup input paste js_mod", |
|
71 function() { if (!_this._Popcorn.media.paused) _this._Popcorn.pause() }); |
|
72 |
|
73 /* the cinecast version expects the user to comment on a defined segment. |
|
74 As the widget is always shown, we need a way to update it's content as |
|
75 time passes. We do this like we did with the annotationsWidget : we schedule |
|
76 a .code start function which will be called at the right time. |
|
77 */ |
|
78 if (this.cinecast_version) { |
|
79 var legal_ids; |
|
80 if (typeof(this._serializer.getChapitrage()) !== "undefined") |
|
81 legal_id = this._serializer.getChapitrage(); |
|
82 else |
|
83 legal_id = this._serializer.getNonTweetIds()[0]; |
|
84 |
|
85 var annotations = this._serializer._data.annotations; |
|
86 var i; |
|
87 |
|
88 for (i in annotations) { |
|
89 var annotation = annotations[i]; |
|
90 if (typeof(annotation.meta) !== "undefined" && typeof(annotation.meta["id-ref"]) !== "undefined" |
|
91 && legal_id !== annotation.meta["id-ref"]) { |
|
92 continue; |
|
93 } |
|
94 |
|
95 code = {start: annotation.begin / 1000, end: annotation.end / 1000, |
|
96 onStart: function(annotation) { return function() { |
|
97 console.log(annotation); |
|
98 if (typeof(annotation.content) !== "undefined") |
|
99 _this.selector.find(".Ldt-createAnnotation-Title").html(annotation.content.title); |
|
100 |
|
101 _this._currentAnnotation = annotation; |
|
102 var beginTime = IriSP.msToTime(annotation.begin); |
|
103 var endTime = IriSP.msToTime(annotation.end); |
|
104 var timeTemplate = IriSP.templToHTML("- ({{begin}} - {{ end }})", {begin: beginTime, end: endTime }); |
|
105 _this.selector.find(".Ldt-createAnnotation-TimeFrame").html(timeTemplate); |
|
106 } }(annotation) |
|
107 }; |
|
108 |
|
109 this._Popcorn.code(code); |
|
110 } |
|
111 } |
62 |
112 |
63 this.selector.find(".Ldt-createAnnotation-submitButton").click(IriSP.wrap(this, this.handleButtonClick)); |
113 this.selector.find(".Ldt-createAnnotation-submitButton").click(IriSP.wrap(this, this.handleButtonClick)); |
64 this._Popcorn.listen("IriSP.PlayerWidget.AnnotateButton.clicked", |
114 |
65 IriSP.wrap(this, this.handleAnnotateSignal)); |
115 if (!this.cinecast_version) |
|
116 this._Popcorn.listen("IriSP.PlayerWidget.AnnotateButton.clicked", |
|
117 IriSP.wrap(this, this.handleAnnotateSignal)); |
66 }; |
118 }; |
67 |
119 |
68 IriSP.createAnnotationWidget.prototype.handleAnnotateSignal = function() { |
120 IriSP.createAnnotationWidget.prototype.handleAnnotateSignal = function() { |
|
121 // note : this signal is only handled by the non-cinecast version. |
69 if (this._hidden == false) { |
122 if (this._hidden == false) { |
70 this.selector.hide(); |
123 this.selector.hide(); |
71 this._hidden = true; |
124 this._hidden = true; |
72 /* reinit the fields */ |
|
73 |
|
74 this.selector.find(".Ldt-createAnnotation-DoubleBorder").children().show(); |
|
75 this.selector.find("Ldt-createAnnotation-Description").val(""); |
|
76 this.selector.find(".Ldt-createAnnotation-endScreen").hide(); |
|
77 |
125 |
78 // free the arrow. |
126 // free the arrow. |
79 this._Popcorn.trigger("IriSP.ArrowWidget.releaseArrow"); |
127 this._Popcorn.trigger("IriSP.ArrowWidget.releaseArrow"); |
80 } else { |
128 } else { |
81 if (this.cinecast_version) { |
129 this.showStartScreen(); |
82 var currentTime = this._Popcorn.currentTime(); |
|
83 var currentAnnotation = this._serializer.currentAnnotations(currentTime)[0]; |
|
84 |
|
85 var beginTime = IriSP.msToTime(currentAnnotation.begin); |
|
86 var endTime = IriSP.msToTime(currentAnnotation.end); |
|
87 |
|
88 /* save the variable because the user may take some time writing his |
|
89 comment so the currentAnnottion may change when it's time to post it */ |
|
90 this._currentAnnotation = currentAnnotation; |
|
91 |
|
92 if (typeof(currentAnnotation.content) !== "undefined") |
|
93 this.selector.find(".Ldt-createAnnotation-Title").html(currentAnnotation.content.title); |
|
94 |
|
95 var timeTemplate = IriSP.templToHTML("- ({{begin}} - {{ end }})", {begin: beginTime, end: endTime }); |
|
96 this.selector.find(".Ldt-createAnnotation-TimeFrame").html(timeTemplate); |
|
97 } |
|
98 |
|
99 this.selector.show(); |
130 this.selector.show(); |
100 this._hidden = false; |
131 this._hidden = false; |
101 |
132 |
102 // block the arrow. |
133 // block the arrow. |
103 this._Popcorn.trigger("IriSP.ArrowWidget.blockArrow"); |
134 this._Popcorn.trigger("IriSP.ArrowWidget.blockArrow"); |
104 } |
135 } |
105 }; |
136 }; |
|
137 |
106 |
138 |
107 /** watch for changes in the textfield and change the buttons accordingly */ |
139 /** watch for changes in the textfield and change the buttons accordingly */ |
108 IriSP.createAnnotationWidget.prototype.handleTextChanges = function(event) { |
140 IriSP.createAnnotationWidget.prototype.handleTextChanges = function(event) { |
109 var contents = this.selector.find(".Ldt-createAnnotation-Description").val(); |
141 var contents = this.selector.find(".Ldt-createAnnotation-Description").val(); |
110 |
142 |
125 } |
157 } |
126 } |
158 } |
127 } |
159 } |
128 }; |
160 }; |
129 |
161 |
|
162 IriSP.createAnnotationWidget.prototype.showStartScreen = function() { |
|
163 this.selector.find(".Ldt-createAnnotation-DoubleBorder").children().show(); |
|
164 this.selector.find("Ldt-createAnnotation-Description").val(""); |
|
165 this.selector.find(".Ldt-createAnnotation-endScreen").hide(); |
|
166 }; |
|
167 |
|
168 IriSP.createAnnotationWidget.prototype.showEndScreen = function() { |
|
169 this.selector.find(".Ldt-createAnnotation-DoubleBorder").children().hide(); |
|
170 |
|
171 if (this.cinecast_version) { |
|
172 this.selector.find(".Ldt-createAnnotation-Title").parent().show(); |
|
173 } |
|
174 |
|
175 var twStatus = IriSP.mkTweetUrl(document.location.href); |
|
176 var gpStatus = IriSP.mkGplusUrl(document.location.href); |
|
177 var fbStatus = IriSP.mkFbUrl(document.location.href); |
|
178 |
|
179 this.selector.find(".Ldt-createAnnotation-endScreen-TweetLink").attr("href", twStatus); |
|
180 this.selector.find(".Ldt-createAnnotation-endScreen-FbLink").attr("href", fbStatus); |
|
181 this.selector.find(".Ldt-createAnnotation-endScreen-GplusLink").attr("href", gpStatus); |
|
182 |
|
183 this.selector.find(".Ldt-createAnnotation-endScreen").show(); |
|
184 }; |
|
185 |
130 /** handle clicks on "send annotation" button */ |
186 /** handle clicks on "send annotation" button */ |
131 IriSP.createAnnotationWidget.prototype.handleButtonClick = function(event) { |
187 IriSP.createAnnotationWidget.prototype.handleButtonClick = function(event) { |
132 var _this = this; |
188 var _this = this; |
133 var textfield = this.selector.find(".Ldt-createAnnotation-Description"); |
189 var textfield = this.selector.find(".Ldt-createAnnotation-Description"); |
134 var contents = textfield.val(); |
190 var contents = textfield.val(); |
135 |
191 |
136 if (contents === "") { |
192 if (contents === "") { |
137 |
|
138 if (this.selector.find(".Ldt-createAnnotation-errorMessage").length === 0) { |
193 if (this.selector.find(".Ldt-createAnnotation-errorMessage").length === 0) { |
139 this.selector.find(".Ldt-createAnnotation-Container") |
194 this.selector.find(".Ldt-createAnnotation-Container") |
140 .after(IriSP.templToHTML(IriSP.createAnnotation_errorMessage_template)); |
195 .after(IriSP.templToHTML(IriSP.createAnnotation_errorMessage_template)); |
141 textfield.css("background-color", "#d93c71"); |
196 textfield.css("background-color", "#d93c71"); |
142 } else { |
197 } else { |
143 this.selector.find(".Ldt-createAnnotation-errorMessage").show(); |
198 this.selector.find(".Ldt-createAnnotation-errorMessage").show(); |
144 } |
199 } |
145 // use namespaced events to be able to unbind them quickly and without unbinding |
200 |
146 // the other event handlers. |
201 textfield.one("js_mod propertychange keyup input paste", IriSP.wrap(this, function() { |
147 textfield.bind("js_mod.tmp propertychange.tmp keyup.tmp input.tmp paste.tmp", IriSP.wrap(this, function() { |
|
148 var contents = textfield.val(); |
202 var contents = textfield.val(); |
149 |
203 |
150 if (contents !== "") { |
204 if (contents !== "") { |
151 this.selector.find(".Ldt-createAnnotation-errorMessage").hide(); |
205 this.selector.find(".Ldt-createAnnotation-errorMessage").hide(); |
152 textfield.css("background-color", ""); |
206 textfield.css("background-color", ""); |
153 textfield.unbind(".tmp"); |
|
154 } |
207 } |
155 })); |
208 })); |
156 } else { |
209 } else { |
157 this.selector.find(".Ldt-createAnnotation-DoubleBorder").children().hide(); |
210 this.showEndScreen(); |
158 |
|
159 if (this.cinecast_version) { |
|
160 this.selector.find(".Ldt-createAnnotation-Title").parent().show(); |
|
161 } |
|
162 |
|
163 var twStatus = IriSP.mkTweetUrl(document.location.href); |
|
164 var gpStatus = IriSP.mkGplusUrl(document.location.href); |
|
165 var fbStatus = IriSP.mkFbUrl(document.location.href); |
|
166 |
|
167 this.selector.find(".Ldt-createAnnotation-endScreen-TweetLink").attr("href", twStatus); |
|
168 this.selector.find(".Ldt-createAnnotation-endScreen-FbLink").attr("href", fbStatus); |
|
169 this.selector.find(".Ldt-createAnnotation-endScreen-GplusLink").attr("href", gpStatus); |
|
170 |
|
171 this.selector.find(".Ldt-createAnnotation-endScreen").show(); |
|
172 |
|
173 |
211 |
174 if (typeof(this._currentAnnotation) === "undefined") { |
212 if (typeof(this._currentAnnotation) === "undefined") { |
175 console.log("this._currentAnnotation undefined"); |
213 console.log("this._currentAnnotation undefined"); |
176 return; |
214 return; |
177 } |
215 } |
178 |
216 |
179 var apiJson = {annotations : [{}], meta: {}}; |
217 this.sendLdtData(contents, function() { |
180 var annotation = apiJson["annotations"][0]; |
218 if (_this.cinecast_version) { |
181 |
219 if (_this._Popcorn.media.paused) |
182 annotation["media"] = this._serializer.currentMedia()["id"]; |
220 _this._Popcorn.play(); |
183 annotation["begin"] = this._currentAnnotation.begin; |
221 |
184 annotation["end"] = this._currentAnnotation.end; |
222 window.setTimeout(IriSP.wrap(_this, function() { this.showStartScreen(); }), 5000); |
185 annotation["type"] = this._serializer.getContributions(); |
223 } |
186 if (typeof(annotation["type"]) === "undefined") |
224 }); |
187 annotation["type"] = ""; |
225 } |
188 |
226 }; |
189 annotation["type_title"] = "Contributions"; |
227 |
190 annotation.content = {}; |
228 IriSP.createAnnotationWidget.prototype.sendLdtData = function(contents, callback) { |
191 annotation.content["data"] = contents; |
229 var _this = this; |
192 |
230 var apiJson = {annotations : [{}], meta: {}}; |
193 var meta = apiJson["meta"]; |
231 var annotation = apiJson["annotations"][0]; |
194 meta.creator = "An User"; |
232 |
195 meta.created = Date().toString(); |
233 annotation["media"] = this._serializer.currentMedia()["id"]; |
196 |
234 annotation["begin"] = this._currentAnnotation.begin; |
197 annotation["tags"] = []; |
235 annotation["end"] = this._currentAnnotation.end; |
198 |
236 annotation["type"] = this._serializer.getContributions(); |
199 for (var i = 0; i < this.keywords.length; i++) { |
237 if (typeof(annotation["type"]) === "undefined") |
200 var keyword = this.keywords[i]; |
238 annotation["type"] = ""; |
201 if (contents.indexOf(keyword) != -1) |
239 |
202 annotation["tags"].push(keyword); |
240 annotation["type_title"] = "Contributions"; |
203 } |
241 annotation.content = {}; |
204 |
242 annotation.content["data"] = contents; |
205 var jsonString = JSON.stringify(apiJson); |
243 |
206 var project_id = this._serializer._data.meta.id; |
244 var meta = apiJson["meta"]; |
207 |
245 meta.creator = "An User"; |
208 var url = Mustache.to_html("{{platf_url}}/ldtplatform/api/ldt/projects/{{id}}.json", |
246 meta.created = Date().toString(); |
209 {platf_url: IriSP.platform_url, id: project_id}); |
247 |
210 console.log(url, jsonString); |
248 annotation["tags"] = []; |
211 IriSP.jQuery.ajax({ |
249 |
212 url: url, |
250 for (var i = 0; i < this.keywords.length; i++) { |
213 type: 'PUT', |
251 var keyword = this.keywords[i]; |
214 contentType: 'application/json', |
252 if (contents.indexOf(keyword) != -1) |
215 data: jsonString, |
253 annotation["tags"].push(keyword); |
216 // bug with jquery >= 1.5, "json" adds a callback so we don't specify dataType |
254 } |
217 dataType: 'json', |
255 |
218 success: function(json, textStatus, XMLHttpRequest) { |
256 var jsonString = JSON.stringify(apiJson); |
|
257 var project_id = this._serializer._data.meta.id; |
|
258 |
|
259 var url = Mustache.to_html("{{platf_url}}/ldtplatform/api/ldt/projects/{{id}}.json", |
|
260 {platf_url: IriSP.platform_url, id: project_id}); |
|
261 |
|
262 IriSP.jQuery.ajax({ |
|
263 url: url, |
|
264 type: 'PUT', |
|
265 contentType: 'application/json', |
|
266 data: jsonString, |
|
267 dataType: 'json', |
|
268 success: function(json, textStatus, XMLHttpRequest) { |
219 /* add the annotation to the annotations and tell the world */ |
269 /* add the annotation to the annotations and tell the world */ |
220 delete annotation.tags; |
270 delete annotation.tags; |
221 annotation.content.description = annotation.content.data; |
271 annotation.content.description = annotation.content.data; |
222 delete annotation.content.data; |
272 delete annotation.content.data; |
223 annotation.id = json.annotations[0].id; |
273 annotation.id = json.annotations[0].id; |