--- a/src/ldt/ldt/static/ldt/js/LdtPlayer-release.js Fri Jan 13 16:13:03 2012 +0100
+++ b/src/ldt/ldt/static/ldt/js/LdtPlayer-release.js Fri Jan 13 16:24:16 2012 +0100
@@ -1086,7 +1086,7 @@
IriSP.annotation_loading_template = "{{! template shown while the annotation widget is loading }}<div id='Ldt-load-container'><div id='Ldt-loader'> </div> Chargement... </div>";
IriSP.annotationsListWidget_template = "{{! template for the annotation list widget }}<div class='Ldt-AnnotationsListWidget'> <!-- ugly div because we want to have a double border --> <div class='Ldt-Annotation-DoubleBorder'> <ul> {{#annotations}} <li> <a href='#a={{id}}'> <div style='overflow: auto; margin-top: 5px; margin-bottom: 5px;'> <div class='Ldt-AnnotationsList-Caption'> <img src='http://i.imgur.com/aoUlC.jpg'></img> </div> <div class='Ldt-AnnotationsList-Duration'>{{begin}} - {{end}}</div> <div class='Ldt-AnnotationsList-Title'>{{title}}</div> <div class='Ldt-AnnotationsList-Description'>{{desc}}</div> </div> </a> </li> {{/annotations}} </ul> </div></div>";
IriSP.arrowWidget_template = "<div class='Ldt-arrowWidget'></div>";
-IriSP.createAnnotationWidget_template = "{{! template for the annotation creation widget }}<div class='Ldt-createAnnotationWidget'> <!-- ugly div because we want to have a double border --> <div class='Ldt-createAnnotation-DoubleBorder'> <div style='margin-bottom: 7px; overflow: auto;'> <div class='Ldt-createAnnotation-Title'></div> <div class='Ldt-createAnnotation-TimeFrame'></div> </div> <div class='Ldt-createAnnotation-Container'> <textarea class='Ldt-createAnnotation-Description'></textarea> <div class='Ldt-createAnnotation-profileArrow'> <img src='{{img_dir}}/annotate_arrow.png'></img> </div> <div class='Ldt-createAnnotation-userAvatar'> <img src='https://si0.twimg.com/sticky/default_profile_images/default_profile_1_normal.png'></img> </div> </div> <div class='Ldt-createAnnotation-keywords'> Add keywords : </div> <div class='Ldt-createAnnotation-submitButton'> <div style='position: absolute; bottom: 10pt; right: 11pt;'>Submit</div> </div> <div class='Ldt-createAnnotation-endScreen' style='display: none'> Thank you, your annotation has been saved.<br> Would you like to share it on social networks ? <div style='margin-top: 12px; text-align: center;'> <a target='_blank' class='Ldt-createAnnotation-endScreen-TweetLink'><img src='{{img_dir}}/tweet_button.png' style='margin-right: 20px;'></img></a> <a target='_blank' class='Ldt-createAnnotation-endScreen-FbLink'><img src='{{img_dir}}/facebook_button.png' style='margin-right: 20px;'></img></a> <a target='_blank' class='Ldt-createAnnotation-endScreen-GplusLink'><img src='{{img_dir}}/gplus_button.png' style='margin-right: 20px;'></img></a> </div> </div> </div></div>";
+IriSP.createAnnotationWidget_template = "{{! template for the annotation creation widget }}<div class='Ldt-createAnnotationWidget'> <!-- ugly div because we want to have a double border --> <div class='Ldt-createAnnotation-DoubleBorder'> <div class='Ldt-createAnnotation-startScreen'> <div style='margin-bottom: 7px; overflow: auto;'> <div class='Ldt-createAnnotation-Title'></div> <div class='Ldt-createAnnotation-TimeFrame'></div> </div> <div class='Ldt-createAnnotation-Container'> <textarea class='Ldt-createAnnotation-Description'></textarea> <div class='Ldt-createAnnotation-profileArrow'> <img src='{{img_dir}}/annotate_arrow.png'></img> </div> <div class='Ldt-createAnnotation-userAvatar'> <img src='https://si0.twimg.com/sticky/default_profile_images/default_profile_1_normal.png'></img> </div> </div> <div class='Ldt-createAnnotation-keywords'> Add keywords : </div> <div class='Ldt-createAnnotation-submitButton'> <div style='position: absolute; bottom: 10pt; right: 11pt;'>Submit</div> </div> </div> <div class='Ldt-createAnnotation-waitScreen' style='display: none; text-align: center'> <img src='{{img_dir}}/spinner.gif'></img> Please wait while your request is being processed... </div> <div class='Ldt-createAnnotation-endScreen' style='display: none'> Thank you, your annotation has been saved.<br> Would you like to share it on social networks ? <div style='margin-top: 12px; text-align: center;'> <a target='_blank' class='Ldt-createAnnotation-endScreen-TweetLink'><img src='{{img_dir}}/tweet_button.png' style='margin-right: 20px;'></img></a> <a target='_blank' class='Ldt-createAnnotation-endScreen-FbLink'><img src='{{img_dir}}/facebook_button.png' style='margin-right: 20px;'></img></a> <a target='_blank' class='Ldt-createAnnotation-endScreen-GplusLink'><img src='{{img_dir}}/gplus_button.png' style='margin-right: 20px;'></img></a> </div> </div> </div></div>";
IriSP.createAnnotationWidget_festivalCinecast_template = "{{! template for the annotation creation widget specific for the cinecast festival}}<div class='Ldt-createAnnotationWidget'> <!-- ugly div because we want to have a double border --> <div class='Ldt-createAnnotation-DoubleBorder'> <div style='margin-bottom: 7px; overflow: auto;'> <div class='Ldt-createAnnotation-Title'></div> <div class='Ldt-createAnnotation-TimeFrame'></div> </div> <div class='Ldt-createAnnotation-Container'> <textarea class='Ldt-createAnnotation-Description'></textarea> <div class='Ldt-createAnnotation-profileArrow'> <img src='{{img_dir}}/annotate_arrow.png'></img> </div> <div class='Ldt-createAnnotation-userAvatar'> <img src='https://si0.twimg.com/sticky/default_profile_images/default_profile_1_normal.png'></img> </div> </div> <div class='Ldt-createAnnotation-keywords'> Add keywords : </div> <div class='Ldt-createAnnotation-submitButton'> <div style='position: absolute; bottom: 10pt; right: 11pt;'>Submit</div> </div> <div class='Ldt-createAnnotation-endScreen' style='display: none'> Thank you, your annotation has been saved.<br> Would you like to share it on social networks ? <div style='margin-top: 12px; text-align: center;'> <a target='_blank' class='Ldt-createAnnotation-endScreen-TweetLink'><img src='{{img_dir}}/tweet_button.png' style='margin-right: 20px;'></img></a> <a target='_blank' class='Ldt-createAnnotation-endScreen-FbLink'><img src='{{img_dir}}/facebook_button.png' style='margin-right: 20px;'></img></a> <a target='_blank' class='Ldt-createAnnotation-endScreen-GplusLink'><img src='{{img_dir}}/gplus_button.png' style='margin-right: 20px;'></img></a> </div> </div> </div></div>";
IriSP.createAnnotation_errorMessage_template = "<p class='Ldt-createAnnotation-errorMessage'> You must enter text to submit an annotation</p>";
IriSP.overlay_marker_template = "{{! the template for the small bars which is z-indexed over our segment widget }}<div class='Ldt-SegmentPositionMarker' style='background-color: #F7268E;'></div>";
@@ -1571,8 +1571,8 @@
IriSP.jwplayer_swf_path = "/mdp/test/libs/player.swf";
IriSP.lib = {
- jQuery : "http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js",
- jQueryUI : "http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.4/jquery-ui.js",
+ jQuery : "http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.js",
+ jQueryUI : "http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/jquery-ui.js",
jQueryToolTip : "http://cdn.jquerytools.org/1.2.4/all/jquery.tools.min.js",
swfObject : "http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js",
cssjQueryUI : "http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.4/themes/base/jquery-ui.css",
@@ -1601,7 +1601,8 @@
},
"TweetsWidget" : {
default_profile_picture : "https://si0.twimg.com/sticky/default_profile_images/default_profile_1_normal.png",
- tweet_display_period: 10000 // how long do we show a tweet ?
+ tweet_display_period: 10000, // how long do we show a tweet ?
+
},
"SliderWidget" : {
minimize_period: 850 // how long does the slider stays maximized after the user leaves the zone ?
@@ -1966,23 +1967,36 @@
};
+
// the json format is totally illogical
- opts.streamer = IriSP.__jsonMetadata["medias"][0]["meta"]["item"]["value"];
- var source = IriSP.__jsonMetadata["medias"][0]["href"];
-
+ //opts.streamer = IriSP.__jsonMetadata["medias"][0]["meta"]["item"]["value"];
+ //var source = IriSP.__jsonMetadata["medias"][0]["href"];
+
// the source if a full url but jwplayer wants an url relative to the
// streamer url, so we've got to remove the common part.
- opts.file = source.slice(opts.streamer.length);
- console.log(opts.streamer, opts.file);
+ //opts.file = source.slice(opts.streamer.length);
+
+ /* sometimes we get served a file with a wrong path and streamer.
+ as a streamer is of the form rtmp://domain/path/ and the media is
+ the rest, we uglily do this :
+ */
+ opts.file = "";
+ opts.streamer = "";
+ var fullPath = IriSP.__jsonMetadata["medias"][0]["href"];
+ var pathSplit = fullPath.split('/');
+ console.log(pathSplit);
- // HACK - do not commit
- opts.streamer = "rtmp://media.iri.centrepompidou.fr/ddc_player/";
- opts.file = "video/ldtplatform/museologie_inaugurale_20111018_flat.f4v";
+ for (var i = 0; i < pathSplit.length; i++) {
+ if (i < 4) {
+ opts.streamer += pathSplit[i] + "/";
+ } else {
+ opts.file += pathSplit[i];
+ if (i < pathSplit.length - 1)
+ opts.file += "/";
+ }
+ }
- /*opts.streamer = "rtmp://media.iri.centrepompidou.fr/ddc_player/video/ldtplatform/";
- opts.file = "laurentcantet_entrelesmurs.flv";
- */
- console.log(opts.streamer, opts.file);
+ console.log(opts.file);
} else {
/* other providers type, video for instance -
pass everything as is */
@@ -2212,6 +2226,12 @@
IriSP.AnnotationsListWidget.prototype.clearWidget = function() {
};
+/** effectively redraw the widget - called by drawList */
+IriSP.AnnotationsListWidget.prototype.do_redraw = function(list) {
+ var widgetMarkup = IriSP.templToHTML(IriSP.annotationsListWidget_template, {annotations: list});
+ this.selector.html(widgetMarkup);
+};
+
/** draw the annotation list */
IriSP.AnnotationsListWidget.prototype.drawList = function(force_redraw) {
var _this = this;
@@ -2255,8 +2275,7 @@
var idList = IriSP.underscore.pluck(list, "id").sort();
if (idList.length !== this.__oldList.length) {
- var widgetMarkup = IriSP.templToHTML(IriSP.annotationsListWidget_template, {annotations: list});
- this.selector.html(widgetMarkup);
+ this.do_redraw(list);
}
var res = 1;
@@ -2270,16 +2289,14 @@
if (typeof(force_redraw) !== "undefined") {
console.log("forced redraw");
- var widgetMarkup = IriSP.templToHTML(IriSP.annotationsListWidget_template, {annotations: list});
- this.selector.html(widgetMarkup);
+ this.do_redraw(list);
}
/* the two lists are equal, no need to redraw */
if (res === 1) {
return;
} else {
- var widgetMarkup = IriSP.templToHTML(IriSP.annotationsListWidget_template, {annotations: list});
- this.selector.html(widgetMarkup);
+ this.do_redraw(list);
}
};
@@ -2483,6 +2500,12 @@
this.keywords = IriSP.widgetsDefaults["createAnnotationWidget"].keywords;
this.cinecast_version = IriSP.widgetsDefaults["createAnnotationWidget"].cinecast_version;
this.ids = {}; /* a dictionnary linking buttons ids to keywords */
+
+ /* variables to save the current position of the slicer */
+ if (this.cinecast_version) {
+ this.sliceLeft = 0;
+ this.sliceWidth = 0;
+ }
};
@@ -2614,13 +2637,22 @@
// block the arrow.
this._Popcorn.trigger("IriSP.ArrowWidget.blockArrow");
+
var duration = +this._serializer.currentMedia().meta["dc:duration"];
+
var currentChapter = this._serializer.currentChapitre(currentTime);
- console.log(currentTime);
- var left = (currentChapter.begin / duration) * this.selector.width();
- var width = (currentChapter.end / duration) * this.selector.width() - left;
- console.log([left, width]);
+ if (typeof(currentChapter) === "undefined") {
+ var left = this.selector.width() / 2;
+ var width = this.selector.width() / 10;
+ } else {
+ var left = (currentChapter.begin / duration) * this.selector.width();
+ var width = (currentChapter.end / duration) * this.selector.width() - left;
+ }
+
+ this.sliceLeft = left;
+ this.sliceWidth = width;
this._Popcorn.trigger("IriSP.SliceWidget.position", [left, width]);
+ this._Popcorn.listen("IriSP.SliceWidget.zoneChange", IriSP.wrap(this, this.handleSliderChanges));
this._Popcorn.trigger("IriSP.SliceWidget.show");
}
};
@@ -2650,9 +2682,14 @@
};
IriSP.createAnnotationWidget.prototype.showStartScreen = function() {
- this.selector.find(".Ldt-createAnnotation-DoubleBorder").children().show();
- this.selector.find("Ldt-createAnnotation-Description").val("Type your annotation here.");
- this.selector.find(".Ldt-createAnnotation-endScreen").hide();
+ this.selector.find(".Ldt-createAnnotation-DoubleBorder").children().hide();
+ this.selector.find(".Ldt-createAnnotation-startScreen").show();
+ this.selector.find("Ldt-createAnnotation-Description").val("Type your annotation here.");
+};
+
+IriSP.createAnnotationWidget.prototype.showWaitScreen = function() {
+ this.selector.find(".Ldt-createAnnotation-DoubleBorder").children().hide();
+ this.selector.find(".Ldt-createAnnotation-waitScreen").show();
};
IriSP.createAnnotationWidget.prototype.showEndScreen = function() {
@@ -2697,32 +2734,43 @@
}
}));
} else {
- this.showEndScreen();
-
- if (typeof(this._currentAnnotation) === "undefined") {
- console.log("this._currentAnnotation undefined");
- return;
- }
+ this.showWaitScreen();
this.sendLdtData(contents, function() {
if (_this.cinecast_version) {
if (_this._Popcorn.media.paused)
_this._Popcorn.play();
-
- window.setTimeout(IriSP.wrap(_this, function() { this.showStartScreen(); }), 5000);
}
+
+ _this.showEndScreen();
+ window.setTimeout(IriSP.wrap(_this, function() { this.showStartScreen(); }), 5000);
});
}
};
+IriSP.createAnnotationWidget.prototype.handleSliderChanges = function(params) {
+ this.sliceLeft = params[0];
+ this.sliceWidth = params[1];
+};
+
IriSP.createAnnotationWidget.prototype.sendLdtData = function(contents, callback) {
var _this = this;
var apiJson = {annotations : [{}], meta: {}};
var annotation = apiJson["annotations"][0];
annotation["media"] = this._serializer.currentMedia()["id"];
- annotation["begin"] = this._currentAnnotation.begin;
- annotation["end"] = this._currentAnnotation.end;
+
+ if (this.cinecast_version) {
+ if (typeof(this._currentAnnotation) !== "undefined") {
+ annotation["begin"] = this._currentAnnotation.begin;
+ annotation["end"] = this._currentAnnotation.end;
+ }
+ } else {
+ var duration = +this._serializer.currentMedia().meta["dc:duration"];
+ annotation["begin"] = +((duration * (this.sliceLeft / 100)).toFixed(0));
+ annotation["end"] = +((duration * ((this.sliceWidth + this.sliceLeft) / 100)).toFixed(0));
+ }
+
annotation["type"] = this._serializer.getContributions();
if (typeof(annotation["type"]) === "undefined")
annotation["type"] = "";
@@ -2748,31 +2796,44 @@
var url = Mustache.to_html("{{platf_url}}/ldtplatform/api/ldt/projects/{{id}}.json",
{platf_url: IriSP.platform_url, id: project_id});
-
+
IriSP.jQuery.ajax({
url: url,
type: 'PUT',
contentType: 'application/json',
data: jsonString,
- dataType: 'json',
- success: function(json, textStatus, XMLHttpRequest) {
- /* add the annotation to the annotations and tell the world */
+ //dataType: 'json',
+ success: IriSP.wrap(this, function(json, textStatus, XMLHttpRequest) {
+ /* add the annotation to the annotation and tell the world */
+
+ /* if the media doesn't have a contributions line, we need to add one */
+ if (typeof(this._serializer.getContributions()) === "undefined") {
+ /* set up a basic view */
+ var tmp_view = {"dc:contributor": "perso", "dc:creator": "perso", "dc:title": "Contributions",
+ "id": json.annotations[0].type}
+ console.log(tmp_view);
+ this._serializer._data["annotation-types"].push(tmp_view);
+ }
+ annotation["type"] = "";
+
delete annotation.tags;
annotation.content.description = annotation.content.data;
+ annotation.content.title = "";
delete annotation.content.data;
annotation.id = json.annotations[0].id;
- annotation.title = _this._currentAnnotation.content.title;
+
annotation.meta = meta;
annotation.meta["id-ref"] = annotation["type"];
// everything is shared so there's no need to propagate the change
_this._serializer._data.annotations.push(annotation);
+ console.log(_this._serializer._data);
_this._Popcorn.trigger("IriSP.createAnnotationWidget.addedAnnotation");
callback();
- },
+ }),
error:
- function() {
+ function(jqXHR, textStatus, errorThrown) {
console.log("an error occured while contacting "
- + url + " and sending " + jsonString); } });
+ + url + " and sending " + jsonString + textStatus ); } });
};IriSP.PlayerWidget = function(Popcorn, config, Serializer) {
IriSP.Widget.call(this, Popcorn, config, Serializer);
@@ -3028,14 +3089,6 @@
this.svgElements = {};
this.oldSearchMatches = [];
- // Make and define the Raphael area
- this.paper = Raphael(document.getElementById(this._id), config.width, config.height);
-
- // event handlers
- this._Popcorn.listen("IriSP.search", IriSP.wrap(this, function(searchString) { this.searchHandler(searchString); }));
- this._Popcorn.listen("IriSP.search.closed", IriSP.wrap(this, this.searchFieldClosedHandler));
- this._Popcorn.listen("IriSP.search.cleared", IriSP.wrap(this, this.searchFieldClearedHandler));
-
};
IriSP.PolemicWidget.prototype = new IriSP.Widget();
@@ -3126,27 +3179,42 @@
}
- this._serializer.sync(function(data) { loaded_callback.call(self, data) });
+ this._serializer.sync(function(data) { loaded_callback.call(self, data); return; });
function loaded_callback (json) {
var view_type = this._serializer.getTweets();
+
if (typeof(view_type) === "undefined") {
- var view_type = this._serializer.getTweetIds()[0];
+ var view_type = this._serializer.getTweetIds()[0];
if (typeof(view_type) === "undefined") {
// default to guessing if nothing else works.
- view = json.views[0];
+ var view = json.views[0];
if(typeof(view.annotation_types) !== "undefined") {
- if (view.annotation_types.length >= 1) {
- view_type = view.annotation_types[0];
+ /* we need to be backward compatible with the old files which used to
+ feature only two lines : Chapitrage and Tweets. We've added a
+ "Contributions" line so we need to discriminate against that */
+ if (view.annotation_types.length === 2 && typeof(this._serializer.getContributions()) === "undefined") {
+ var view_type = view.annotation_types[1];
} else {
- console.log("PolemicWidget: invalid file");
+ console.log("PolemicWidget: invalid file - minimizing");
+ return;
}
}
}
}
+ // Make and define the Raphael area
+ this.paper = Raphael(document.getElementById(this._id), this._config.width, this._config.height);
+
+ // event handlers
+ this._Popcorn.listen("IriSP.search", IriSP.wrap(this, function(searchString) { this.searchHandler(searchString); }));
+ this._Popcorn.listen("IriSP.search.closed", IriSP.wrap(this, this.searchFieldClosedHandler));
+ this._Popcorn.listen("IriSP.search.cleared", IriSP.wrap(this, this.searchFieldClearedHandler));
+ this.selector.mouseleave(IriSP.wrap(this, function() { self.TooltipWidget.hide.call(self.TooltipWidget); }));
+ this._Popcorn.listen("timeupdate", IriSP.wrap(this, this.sliderUpdater));
+
for(var i = 0; i < json.annotations.length; i++) {
var item = json.annotations[i];
var MyTime = Math.floor(item.begin/duration*lineSize);
@@ -3355,8 +3423,7 @@
this.sliderTip.toFront();
}
- this.selector.mouseleave(IriSP.wrap(this, function() { self.TooltipWidget.hide.call(self.TooltipWidget); }));
- this._Popcorn.listen("timeupdate", IriSP.wrap(this, this.sliderUpdater));
+
}
/** update the positionMarker as time passes */
@@ -4503,10 +4570,10 @@
if (typeof(this._data.lists) === "undefined" || this._data.lists === null)
return;
- var e;
- /* first get the list containing the tweets */
+ name = name.toUpperCase();
+ var e;
e = IriSP.underscore.find(this._data["annotation-types"],
- function(entry) { return (entry["dc:title"].indexOf(name) !== -1) });
+ function(entry) { return (entry["dc:title"].toUpperCase().indexOf(name) !== -1) });
if (typeof(e) === "undefined")
return;
@@ -4523,10 +4590,20 @@
/** return the id of the ligne de temps named "Tweets" */
IriSP.JSONSerializer.prototype.getTweets = function() {
- return this.getId("Tweets");
+ var val = this.getId("Tweets");
+ if (typeof(val) === "undefined")
+ val = this.getId("Tweet");
+ if (typeof(val) === "undefined")
+ val = this.getId("Twitter");
+ if (typeof(val) === "undefined")
+ val = this.getId("twit");
+ if (typeof(val) === "undefined")
+ val = this.getId("Polemic");
+
+ return val;
};
/** return the id of the ligne de temps named "Contributions" */
IriSP.JSONSerializer.prototype.getContributions = function() {
return this.getId("Contributions");
-};
+};
\ No newline at end of file