";
-IriSP.tweetWidget_template = "{{! template for the tweet widget }}";/* utils.js - various utils that don't belong anywhere else */
+IriSP.tweetWidget_template = "{{! template for the tweet widget }}";/* utils.js - various utils that don't belong anywhere else */
/* trace function, for debugging */
@@ -1217,7 +1217,11 @@
/* shortcut to have global variables in templates */
IriSP.templToHTML = function(template, values) {
- var params = IriSP.jQuery.extend(IriSP.default_templates_vars, values);
+ var params = IriSP.underscore.extend(
+ { "defaults" : IriSP.default_templates_vars,
+ "l10n" : IriSP.i18n.getMessages()
+ },
+ values);
return Mustache.to_html(template, params);
};
@@ -1227,7 +1231,15 @@
IriSP.encodeURI = function(str) {
return encodeURIComponent(str).replace(/!/g, '%21').replace(/'/g, '%27').replace(/\(/g, '%28').
replace(/\)/g, '%29').replace(/\*/g, '%2A');
-}
+}
+
+IriSP.jqEscape = function(text) {
+ return text.replace(/(:|\.)/g,'\\$1')
+}
+
+IriSP.jqId = function (text) {
+ return IriSP.jQuery('#' + IriSP.jqEscape(text));
+ }
IriSP.__guidCounter = 0;
IriSP.guid = function(prefix) {
@@ -1280,14 +1292,7 @@
return url;
};
-/** Similar to substr but remove the last word if
- we're breaking a word in two.
- */
-IriSP.clean_substr = function(str, start, end) {
- var s = str.substr(start, end).substr(start, end).split(" ");
- s.pop();
- return s.join(" ");
-};
+
/* for ie compatibility
if (Object.prototype.__defineGetter__&&!Object.defineProperty) {
Object.defineProperty=function(obj,prop,desc) {
@@ -1296,6 +1301,11 @@
}
}
*/
+
+/* Creates regexps from text */
+IriSP.regexpFromText = function(_text) {
+ return new RegExp('(' + _text.replace(/(\W)/gim,'\\$1') + ')','gim');
+}
/* wrapper that simulates popcorn.js because
popcorn is a bit unstable at the time */
@@ -1442,6 +1452,22 @@
}
};
+IriSP.PopcornReplacement.player.prototype.volume = function(val) {
+ if (typeof this.playerFns.getVolume == "undefined" || typeof this.playerFns.setVolume == "undefined") {
+ return false;
+ }
+ var _vol = this.playerFns.getVolume();
+ if (typeof(val) !== "undefined" && parseFloat(val) !== NaN) {
+ val = Math.max(0, Math.min(1, val));
+ if (parseFloat(val) != parseFloat(_vol)) {
+ this.playerFns.setVolume(val);
+ this.trigger("volumechange");
+ _vol = this.playerFns.getVolume();
+ }
+ }
+ return _vol;
+};
+
IriSP.PopcornReplacement.player.prototype.mute = IriSP.PopcornReplacement.player.prototype.muted;
IriSP.PopcornReplacement.player.prototype.code = function(options) {
@@ -1641,6 +1667,8 @@
IriSP.platform_url = "http://192.168.56.101/pf";
IriSP.default_templates_vars = { };
+IriSP.language = 'fr';
+
/** ugly ugly ugly ugly - returns an object defining
the paths to the libs
We need it that way cause it's called at runtime by
@@ -1651,11 +1679,16 @@
libdir = IriSP.libdir;
return {
- 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",
+// jQuery : "http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.js",
+ jQuery : libdir + "jquery.min.js",
+// jQueryUI : "http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/jquery-ui.js",
+ jQueryUI : libdir + "jquery-ui.min.js",
+// jQueryToolTip : "http://cdn.jquerytools.org/1.2.4/all/jquery.tools.min.js",
+ jQueryToolTip : libdir + "jquery.tools.min.js",
+// swfObject : "http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js",
+ swfObject : libdir + "swfobject.js",
+// cssjQueryUI : "http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.4/themes/base/jquery-ui.css",
+ cssjQueryUI : libdir + "jquery-ui.css",
popcorn : libdir + "popcorn.js",
jwplayer : libdir + "jwplayer.js",
popcornReplacement: libdir + "pop.js",
@@ -1664,7 +1697,8 @@
"popcorn.mediafragment" : libdir + "popcorn.mediafragment.js",
"popcorn.code" : libdir + "popcorn.code.js",
"popcorn.jwplayer": libdir + "popcorn.jwplayer.js",
- "popcorn.youtube": libdir + "popcorn.youtube.js"
+ "popcorn.youtube": libdir + "popcorn.youtube.js",
+ "tracemanager": libdir + "tracemanager.js"
};
};
@@ -1700,19 +1734,20 @@
minimize_period: 850 // how long does the slider stays maximized after the user leaves the zone ?
},
"createAnnotationWidget" : {
- keywords: ["#faux-raccord", "#mot-clef"],
+ keywords: ["#amateur", "#digital-studies"],
polemic_mode: true, /* enable polemics ? */
/* polemics - the corresponding class names defined in the css should be for instance :
- Ldt-createAnnotation-polemic-plusplus for plusplus
+ Ldt-createAnnotation-polemic-positive for positive
Ldt-createAnnotation-polemic-equalequal for equalequal, etc.
*/
- polemics: {"++" : "positive", "--" : "negative", "==" : "reference", "??" : "question"},
- cinecast_version: true, /* put to false to enable the platform version, true for the festival cinecast one. */
+ polemics: [ { "className" : "positive", "keyword" : "++" }, { "className" : "negative", "keyword" : "--" }, { "className" : "reference", "keyword" : "==" }, { "className" : "question", "keyword" : "??" } ],
+ cinecast_version: false, /* put to false to enable the platform version, true for the festival cinecast one. */
/* where does the widget PUT the annotations - this is a mustache template. id refers to the id of the media ans is filled
by the widget.
*/
- api_endpoint_template: platform_url + "/ldtplatform/api/ldt/annotations/{{id}}.json"
+ api_endpoint_template: platform_url + "/ldtplatform/api/ldt/annotations/{{id}}.json",
+ api_method: "PUT"
},
"SparklineWidget" : {
column_width: 10 // the width of a column in pixels.
@@ -1733,6 +1768,8 @@
ajax_granularity: 10000, /* how much ms should we look before and after the
current timecode */
+
+ default_thumbnail: "/metadataplayer/src/css/imgs/video_sequence.png",
project_url: platform_url + "/ldtplatform/ldt/front/player/" /* the beginning
of a link to the
@@ -1757,13 +1794,12 @@
"imgs": "/metadataplayer/src/css/imgs"
};
+
IriSP.defaults.default_templates_vars = function() {
return {
"img_dir" : IriSP.paths.imgs
};
-}
-
-/* the widget classes and definitions */
+}/* the widget classes and definitions */
/**
* @class Widget is an "abstract" class. It's mostly used to define some properties common to every widget.
@@ -1815,28 +1851,32 @@
}
if (config.hasOwnProperty("layoutManager")) {
- this.layoutManager = config.layoutManager;
+ this.layoutManager = config.layoutManager;
+ }
+ if (typeof this.selector != "undefined") {
+ this.selector.addClass("Ldt-TraceMe").addClass("Ldt-Widget");
+ this.selector.attr("widget-type", this._config.type);
}
- if (typeof this.selector != "undefined" && typeof Popcorn != "undefined") {
- var _id = this._id;
- this.selector.bind("click mouseover mouseout dragstart dragstop", function(_e) {
- var _data = {
- "type": _e.type,
- "x": _e.clientX,
- "y": _e.clientY,
- "widget": _id,
- "target_name": _e.target.localName,
- "target_id": _e.target.id,
- "target_class": _e.target.className,
- "text": _e.target.textContent.trim(),
- "title": _e.target.title,
- "value": _e.target.value
- };
- Popcorn.trigger('IriSP.Widget.MouseEvents', _data);
- })
- }
-
-};
+
+};
+
+// This functions checks for configuration options
+
+IriSP.Widget.prototype.checkOption = function(_name, _default) {
+ this[_name] = (
+ typeof this._config[_name] != "undefined"
+ ? this._config[_name]
+ : (
+ (typeof IriSP.widgetsDefaults[this._config.type] != "undefined" && IriSP.widgetsDefaults[this._config.type][_name] != "undefined")
+ ? IriSP.widgetsDefaults[this._config.type][_name]
+ : (
+ typeof _default != "undefined"
+ ? _default
+ : null
+ )
+ )
+ )
+}
/**
* This method responsible of drawing a widget on screen.
@@ -2215,6 +2255,7 @@
/** single point of entry for the metadataplayer */
IriSP.initPlayer = function(config, metadata_url, libdir, platform_url) {
+ document.getElementById(config.gui.container).innerHTML = IriSP.templToHTML(IriSP.loading_template, config.gui);
IriSP.configureDefaults(libdir, platform_url);
IriSP.loadLibs(IriSP.lib, config, metadata_url,
function() {
@@ -2225,8 +2266,79 @@
var widgets = IriSP.configureWidgets(pop, layoutManager, config.gui);
var modules = IriSP.configureModules(pop, config.modules);
+ IriSP.jQuery('#Ldt-loader').detach();
});
-};/* To wrap a player the develop should create a new class derived from
+};IriSP.I18n = function() {
+ this.messages = {};
+ this.base_lang = 'en';
+}
+
+IriSP.I18n.prototype.getLanguage = function(lang) {
+ var _lang = (
+ typeof lang != "undefined"
+ ? lang
+ : (
+ typeof IriSP.language != "undefined"
+ ? IriSP.language
+ : this.base_lang
+ )
+ );
+ return (
+ typeof this.messages[_lang] == "object"
+ ? _lang
+ : (
+ typeof this.messages[this.base_lang] == "object"
+ ? this.base_lang
+ : null
+ )
+ )
+}
+
+IriSP.I18n.prototype.getMessages = function(lang) {
+ var _lang = this.getLanguage(lang);
+ return (
+ _lang != null
+ ? this.messages[_lang]
+ : {}
+ );
+}
+
+IriSP.I18n.prototype.getMessage = function(message, lang) {
+ var _msgs = this.getMessages(lang);
+ return (
+ typeof _msgs[message] != "undefined"
+ ? _msgs[message]
+ : message
+ )
+}
+
+IriSP.I18n.prototype.addMessage = function(lang, messagekey, messagevalue) {
+ if (typeof this.messages[lang] == "undefined") {
+ this.messages[lang] = {};
+ }
+ this.messages[lang][messagekey] = messagevalue;
+}
+
+IriSP.I18n.prototype.addMessages = function(messagesObj) {
+ var _this = this;
+ IriSP.underscore(messagesObj).each(function(_messages, _lang) {
+ IriSP.underscore(_messages).each(function(_value, _key) {
+ _this.addMessage(_lang, _key, _value);
+ })
+ });
+}
+
+IriSP.i18n = new IriSP.I18n();
+
+IriSP.i18n.addMessages({
+ "fr": {
+ "loading_wait": "Chargement en cours, veuillez patienter…"
+ },
+ "en": {
+ "loading_wait": "Loading, please wait…"
+ }
+})
+/* To wrap a player the develop should create a new class derived from
the IriSP.PopcornReplacement.player and defining the correct functions */
/** allocine player wrapper */
@@ -2288,7 +2400,7 @@
}
window.onReady = IriSP.wrap(this, this.ready);
- //NOT CALLED window.onAllocineStateChange = IriSP.wrap(this, this.stateHandler);
+ window.onAllocineStateChange = IriSP.wrap(this, this.stateHandler);
window.onTime = IriSP.wrap(this, this.progressHandler);
var _videoUrl = (
@@ -2330,7 +2442,7 @@
IriSP.PopcornReplacement.allocine.prototype.stateHandler = function(state) {
-
+ console.log("stateHandler");
switch(state) {
case 1:
this.callbacks.onPlay();
@@ -2404,11 +2516,26 @@
},
setMute : function(p) {
if (_this.player) {
- return p ? _this.player.mute() : _this.player.unMute();
+ if (p) {
+ _this.player.mute();
+ }
+ else {
+ _this.player.unMute();
+ }
+ }
+ },
+ getVolume : function() {
+ if (_this.player) {
+ return _this.player.getVolume() / 100;
} else {
return false;
}
- }
+ },
+ setVolume : function(p) {
+ if (_this.player) {
+ _this.player.setVolume(Math.floor(100 * p));
+ }
+ },
}
window.onDailymotionPlayerReady = IriSP.wrap(this, this.ready);
@@ -2475,7 +2602,6 @@
/** jwplayer player wrapper */
IriSP.PopcornReplacement.jwplayer = function(container, options) {
-
/* appel du parent pour initialiser les structures communes à tous les players */
IriSP.PopcornReplacement.player.call(this, container, options);
@@ -2488,7 +2614,9 @@
getPosition: function() { return jwplayer(this.container).getPosition(); },
seek: function(pos) { return jwplayer(this.container).seek(pos); },
getMute: function() { return jwplayer(this.container).getMute() },
- setMute: function(p) { return jwplayer(this.container).setMute(p); }
+ setMute: function(p) { return jwplayer(this.container).setMute(p); },
+ getVolume: function() { return jwplayer(this.container).getVolume() / 100; },
+ setVolume: function(p) { return jwplayer(this.container).setVolume(Math.floor(100*p)); }
}
options.events = this.callbacks;
@@ -2642,9 +2770,24 @@
IriSP.Widget.call(this, Popcorn, config, Serializer);
this.__counter = 0;
this.__oldList = [];
-
- this.ajax_mode = IriSP.widgetsDefaults["AnnotationsListWidget"].ajax_mode;
- this.project_url = IriSP.widgetsDefaults["AnnotationsListWidget"].project_url;
+
+ this.checkOption('ajax_mode');
+ this.checkOption('project_url');
+ this.checkOption('default_thumbnail');
+ this.checkOption("cinecast_version", false);
+ this.searchRe = null;
+ this._ajax_cache = [];
+ var _this = this;
+
+ this._Popcorn.listen("IriSP.search", function(searchString) {
+ _this.searchHandler(searchString);
+ });
+ this._Popcorn.listen("IriSP.search.closed", function() {
+ _this.searchHandler(false);
+ });
+ this._Popcorn.listen("IriSP.search.cleared", function() {
+ _this.searchHandler(false);
+ });
};
@@ -2656,77 +2799,136 @@
IriSP.AnnotationsListWidget.prototype.clearWidget = function() {
};
+IriSP.AnnotationsListWidget.prototype.searchHandler = function(searchString) {
+ this.searchRe = (searchString && searchString.length) ? IriSP.regexpFromText(searchString) : null;
+ if (this.ajax_mode) {
+ var _this = this,
+ _annotations = (
+ this.searchRe === null
+ ? this._ajax_cache
+ : IriSP.underscore.filter(this._ajax_cache, function(_a) {
+ return (_this.searchRe.test(_a.desc) || _this.searchRe.test(_a.title));
+ })
+ );
+ this.do_redraw(_annotations);
+ if (_annotations.length) {
+ this._Popcorn.trigger("IriSP.search.matchFound");
+ } else {
+ this._Popcorn.trigger("IriSP.search.noMatchFound");
+ }
+ } else {
+ this.drawList();
+ }
+}
+
/** 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);
-};
+ var _html = IriSP.templToHTML(
+ IriSP.annotationsListWidget_template, {
+ annotations: list
+ }),
+ _this = this;
+
+ this.selector.html(_html);
+
+ if (this.searchRe !== null) {
+ this.selector.find(".Ldt-AnnotationsList-Title a, .Ldt-AnnotationsList-Description")
+ .each(function() {
+ var _$ = IriSP.jQuery(this);
+ _$.html(_$.text().replace(_this.searchRe, '
$1 '))
+ })
+ }
+};
+
+IriSP.AnnotationsListWidget.prototype.transformAnnotation = function(a) {
+ var _this = this
+ return {
+ "id" : a.id,
+ "title": this.cinecast_version ? IriSP.get_aliased(a.meta, ['creator_name', 'creator']) : a.content.title,
+ "desc" : this.cinecast_version ? a.content.data : a.content.description,
+ "begin": IriSP.msToTime(a.begin),
+ "end" : IriSP.msToTime(a.end),
+ "thumbnail" : (typeof a.meta == "object" && typeof a.meta.thumbnail == "string") ? a.meta.thumbnail : this.default_thumbnail,
+ "url" : (typeof a.meta == "object" && typeof a.meta.url == "string") ? a.meta.url : null,
+ "tags": typeof a.tags == "object"
+ ? IriSP.underscore(a.tags)
+ .chain()
+ .map(function(_t) {
+ if (typeof _t == "string") {
+ return _t.replace(/^.*:/,'#');
+ } else {
+ if (typeof _t['id-ref'] != "undefined") {
+ var _f = IriSP.underscore.find(_this._serializer._data.tags, function(_tag) {
+ return _tag.id == _t['id-ref'];
+ });
+ if (typeof _f != "undefined") {
+ return IriSP.get_aliased(_f.meta, ['dc:title', 'title']);
+ }
+ }
+ }
+ return null;
+ })
+ .filter(function(_t) {
+ return _t !== null && _t !== ""
+ })
+ .value()
+ : []
+ }
+}
/** draw the annotation list */
IriSP.AnnotationsListWidget.prototype.drawList = function(force_redraw) {
var _this = this;
- var view_type = this._serializer.getContributions();
+// var view_type = this._serializer.getContributions();
var annotations = this._serializer._data.annotations;
var currentTime = this._Popcorn.currentTime();
-
var list = [];
- if (typeof(view_type) === "undefined") {
+/* if (typeof(view_type) === "undefined") {
return;
- }
-
+} */
for (i = 0; i < annotations.length; i++) {
- var annotation = annotations[i];
-
- /* filter the annotations whose type is not the one we want */
- if (typeof(annotation.meta) !== "undefined" && typeof(annotation.meta["id-ref"]) !== "undefined"
- && annotation.meta["id-ref"] !== view_type) {
- continue;
+ var obj = this.transformAnnotation(annotations[i]);
+ obj.iterator = i;
+ obj.distance = Math.abs((annotations[i].end + annotations[i].begin) / 2000 - currentTime);
+ if (!this.cinecast_version || annotations[i].type == "cinecast:UserAnnotation") {
+ list.push(obj);
}
-
- /* only get the annotations happening in the current chapter */
- if (!(annotation.begin <= currentTime * 1000 && annotation.end > currentTime * 1000)) {
- continue;
+
+ }
+
+ if (this.searchRe !== null) {
+ list = list.filter(function(_a) {
+ return (_this.searchRe.test(_a.desc) || _this.searchRe.test(_a.title));
+ });
+ if (list.length) {
+ this._Popcorn.trigger("IriSP.search.matchFound");
+ } else {
+ this._Popcorn.trigger("IriSP.search.noMatchFound");
+ }
}
-
- var a = annotation;
- var obj = {};
-
- obj["id"] = a.id;
- obj["title"] = a.content.title;
- obj["desc"] = a.content.description;
- obj["begin"] = IriSP.msToTime(annotation.begin);
- obj["end"] = IriSP.msToTime(annotation.end);
-
- list.push(obj);
- }
+
+ list = IriSP.underscore(list)
+ .chain()
+ .sortBy(function(_o) {
+ return _o.distance;
+ })
+ .first(10)
+ .sortBy(function(_o) {
+ return _o.iterator;
+ })
+ .value();
var idList = IriSP.underscore.pluck(list, "id").sort();
- if (idList.length !== this.__oldList.length) {
+
+ if (!IriSP.underscore.isEqual(this.__oldList, idList) || typeof(force_redraw) !== "undefined") {
this.do_redraw(list);
- }
-
- var res = 1;
- for (var i = 0; i < idList.length; i++) {
- if (idList[i] !== this.__oldList[i])
- res = 0;
- break;
+ this.__oldList = idList;
}
-
- this.__oldList = idList; /* save for next call */
-
- if (typeof(force_redraw) !== "undefined") {
- this.do_redraw(list);
- }
-
- /* the two lists are equal, no need to redraw */
- if (res === 1) {
- return;
- } else {
- this.do_redraw(list);
- }
+ /* save for next call */
+
};
@@ -2747,7 +2949,7 @@
we have to do that because the platform only knows at run time what view it's displaying.
*/
- var platf_url = IriSP.widgetsDefaults["AnnotationsListWidget"].ajax_url
+ var platf_url = IriSP.widgetsDefaults.AnnotationsListWidget.ajax_url
.replace(/\{/g, '{{').replace(/\}/g, '}}');
var media_id = this._serializer.currentMedia()["id"];
var duration = this._serializer.getDuration();
@@ -2765,7 +2967,7 @@
/* we create on the fly a serializer to get the ajax */
var serializer = new IriSP.JSONSerializer(IriSP.__dataloader, templ);
- serializer.sync(IriSP.wrap(this, function(json) { this.processJson(json, serializer) }));
+ serializer.sync(IriSP.wrap(this, function(json) { this.processJson(json, serializer) }));
};
/** process the received json - it's a bit hackish */
@@ -2784,39 +2986,23 @@
var media = this._serializer.currentMedia()["id"];
for (i = 0; i < annotations.length; i++) {
- var annotation = annotations[i];
-
- /* filter the annotations whose type is not the one we want */
- /* We want _all_ the annotations.
- if (typeof(annotation.meta) !== "undefined" && typeof(annotation.meta["id-ref"]) !== "undefined"
- && !IriSP.underscore.include(view_types, annotation.meta["id-ref"])) {
- continue;
- }
- */
- var a = annotation;
- var obj = {};
-
- obj["id"] = a.id;
- obj["title"] = a.content.title;
- obj["desc"] = a.content.description;
- obj["begin"] = IriSP.msToTime(annotation.begin);
- obj["end"] = IriSP.msToTime(annotation.end);
-
- /* only if the annotation isn't present in the document create an
- external link */
- if (!this.annotations_ids.hasOwnProperty(obj["id"])) {
- // braindead url; jacques didn't want to create a new one in the platform,
- // so we append the cutting id to the url.
- obj["url"] = this.project_url + "/" + media + "/" +
- annotation.meta["project"] + "/" +
- annotation.meta["id-ref"];
-
- // obj["url"] = document.location.href.split("#")[0] + "/" + annotation.meta["project"];
- }
-
+ var obj = this.transformAnnotation(annotations[i])
+ if (typeof obj.url == "undefined" || !obj.url) {
+ /* only if the annotation isn't present in the document create an
+ external link */
+ if (this.annotations_ids.indexOf(obj.id.toLowerCase()) == -1) {
+ // braindead url; jacques didn't want to create a new one in the platform,
+ // so we append the cutting id to the url.
+ obj.url = this.project_url + "/" + media + "/" +
+ annotations[i].meta.project + "/" +
+ annotations[i].meta["id-ref"] + '#id=' + annotations[i].id;
+
+ // obj.url = document.location.href.split("#")[0] + "/" + annotation.meta.project;
+ }
+ }
l.push(obj);
}
-
+ this._ajax_cache = l;
this.do_redraw(l);
};
IriSP.AnnotationsListWidget.prototype.draw = function() {
@@ -2824,19 +3010,19 @@
/* build a table of the annotations present in the document for faster
lookup
*/
- this.annotations_ids = {};
-
- var annotations = this._serializer._data.annotations;
- var i = 0;
- for(i = 0; i < annotations.length; i++) {
- this.annotations_ids[annotations[i]["id"]] = 1;
- }
-
- this.drawList();
+ this.annotations_ids = IriSP.underscore(this._serializer._data.annotations).map(function(_a) {
+ return _a.id.toLowerCase();
+ });
+
+ var _this = this;
- if (!this.ajax_mode) {
- this._Popcorn.listen("IriSP.createAnnotationWidget.addedAnnotation", IriSP.wrap(this, function() { this.drawList(true); }));
- this._Popcorn.listen("timeupdate", IriSP.wrap(this, this.redraw));
+ if (!this.ajax_mode) {
+ var _throttled = IriSP.underscore.throttle(function() {
+ _this.drawList();
+ }, 1500);
+ _throttled();
+ this._Popcorn.listen("IriSP.createAnnotationWidget.addedAnnotation", _throttled);
+ this._Popcorn.listen("timeupdate", _throttled);
} else {
/* update the widget when the video has finished loading and when it's seeked and paused */
this._Popcorn.listen("seeked", IriSP.wrap(this, this.ajaxRedraw));
@@ -2846,11 +3032,20 @@
this._Popcorn.listen("IriSP.createAnnotationWidget.addedAnnotation", IriSP.wrap(this, this.ajaxRedraw));
}
-};
-
-IriSP.AnnotationsListWidget.prototype.redraw = function() {
- this.drawList();
-};IriSP.AnnotationsWidget = function(Popcorn, config, Serializer) {
+};/* Internationalization for this widget */
+
+IriSP.i18n.addMessages(
+ {
+ "fr": {
+ "keywords": "Mots-clés"
+ },
+ "en": {
+ "keywords": "Keywords"
+ }
+ }
+);
+
+IriSP.AnnotationsWidget = function(Popcorn, config, Serializer) {
IriSP.Widget.call(this, Popcorn, config, Serializer);
/* flag used when we're creating an annotation */
this._hidden = false;
@@ -2898,7 +3093,7 @@
}
}
- tags = "Keywords: " + tags.slice(0, tags.length - 2);
+ tags = IriSP.i18n.getMessage("keywords") + ": " + tags.slice(0, tags.length - 2);
this.selector.find(".Ldt-SaKeywords").text(tags);
@@ -3071,18 +3266,59 @@
IriSP.ArrowWidget.prototype.releaseArrow = function() {
this._blockArrow = false;
};
+/* Internationalization for this widget */
+
+IriSP.i18n.addMessages(
+ {
+ "en": {
+ "submit": "Submit",
+ "add_keywords": "Add keywords",
+ "add_polemic_keywords": "Add polemic keywords",
+ "your_name": "Your name",
+ "type_here": "Type your annotation here.",
+ "wait_while_processed": "Please wait while your request is being processed...",
+ "error_while_contacting": "An error happened while contacting the server. Your annotation has not been saved.",
+ "empty_annotation": "Your annotation is empty. Please write something before submitting.",
+ "annotation_saved": "Thank you, your annotation has been saved.",
+ "share_annotation": "Would you like to share it on social networks ?",
+ "share_on": "Share on"
+ },
+ "fr": {
+ "submit": "Envoyer",
+ "add_keywords": "Ajouter des mots-clés",
+ "add_polemic_keywords": "Ajouter des mots-clés polémiques",
+ "your_name": "Votre nom",
+ "type_here": "Rédigez votre annotation ici.",
+ "wait_while_processed": "Veuillez patienter pendant le traitement de votre requête...",
+ "error_while_contacting": "Une erreur s'est produite en contactant le serveur. Votre annotation n'a pas été enregistrée",
+ "empty_annotation": "Votre annotation est vide. Merci de rédiger un texte avant de l'envoyer.",
+ "annotation_saved": "Merci, votre annotation a été enregistrée.",
+ "share_annotation": "Souhaitez-vous la partager sur les réseaux sociaux ?",
+ "share_on": "Partager sur"
+ }
+ }
+);
+
IriSP.createAnnotationWidget = function(Popcorn, config, Serializer) {
IriSP.Widget.call(this, Popcorn, config, Serializer);
this._hidden = true;
- this.keywords = IriSP.widgetsDefaults["createAnnotationWidget"].keywords;
-
- this.polemic_mode = IriSP.widgetsDefaults["createAnnotationWidget"].polemic_mode;
- this.polemics = IriSP.widgetsDefaults["createAnnotationWidget"].polemics;
-
- this.cinecast_version = IriSP.widgetsDefaults["createAnnotationWidget"].cinecast_version;
- this.api_endpoint_template = IriSP.widgetsDefaults["createAnnotationWidget"].api_endpoint_template;
-
- this.ids = {}; /* a dictionnary linking buttons ids to keywords */
+
+ this.checkOption("keywords");
+ this.checkOption("polemic_mode", true);
+ this.checkOption("polemics");
+ this.checkOption("cinecast_version", false);
+ this.checkOption("api_endpoint_template");
+ this.checkOption("show_from_field", true);
+ this.checkOption("api_method");
+
+ if (!IriSP.null_or_undefined(IriSP.user)) {
+ if (!IriSP.null_or_undefined(IriSP.user.avatar)) {
+ this.user_avatar = IriSP.user.avatar;
+ }
+ if (!IriSP.null_or_undefined(IriSP.user.name)) {
+ this.user_name = IriSP.user.name;
+ }
+ }
/* variables to save the current position of the slicer */
if (this.cinecast_version) {
@@ -3102,14 +3338,9 @@
IriSP.createAnnotationWidget.prototype.draw = function() {
var _this = this;
- var template_params = {cinecast_version: this.cinecast_version,
- polemic_mode: this.polemic_mode};
-
- if (!IriSP.null_or_undefined(IriSP.user) && !IriSP.null_or_undefined(IriSP.user.avatar))
- template_params["user_avatar"] = IriSP.user.avatar;
var annotationMarkup = IriSP.templToHTML(IriSP.createAnnotationWidget_template,
- template_params);
+ this);
this.selector.append(annotationMarkup);
@@ -3118,70 +3349,12 @@
else {
this.showStartScreen();
}
-
- // add the keywords.
- for (var i = 0; i < this.keywords.length; i++) {
- var keyword = this.keywords[i];
- var id = IriSP.guid("button_");
- var templ = IriSP.templToHTML("
{{keyword}} ",
- {keyword: keyword, id: id});
-
- this.ids[keyword] = id; // save it for the function that handle textarea changes.
-
- this.selector.find(".Ldt-createAnnotation-keywords").append(templ);
- this.selector.find("#" + id).click(function(keyword) { return function() {
- var contents = _this.selector.find(".Ldt-createAnnotation-Description").val();
- if (contents.indexOf(keyword) != -1) {
- var newVal = contents.replace(" " + keyword, "");
- if (newVal == contents)
- newVal = contents.replace(keyword, "");
- } else {
- if (contents === "")
- var newVal = keyword;
- else
- var newVal = contents + " " + keyword;
- }
-
- _this.selector.find(".Ldt-createAnnotation-Description").val(newVal);
- // we use a custom event because there's no simple way to test for a js
- // change in a textfield.
- _this.selector.find(".Ldt-createAnnotation-Description").trigger("js_mod");
- // also call our update function.
- //_this.handleTextChanges();
- }
- }(keyword));
- }
-
- // add the polemic buttons.
- if(this.polemic_mode)
- for (var polemic in this.polemics) {
-
- var classname = IriSP.templToHTML("Ldt-createAnnotation-polemic-{{classname}}", {classname : this.polemics[polemic]});
-
- var templ = IriSP.templToHTML("
{{polemic}} ",
- {classname: classname, polemic: polemic});
-
- this.selector.find(".Ldt-createAnnotation-polemics").append(templ);
- this.selector.find("." + classname).click(function(polemic) { return function() {
- var contents = _this.selector.find(".Ldt-createAnnotation-Description").val();
- if (contents.indexOf(polemic) != -1) {
- var newVal = contents.replace(" " + polemic, "");
- if (newVal == contents)
- newVal = contents.replace(polemic, "");
- } else {
- if (contents === "")
- var newVal = polemic;
- else
- var newVal = contents + " " + polemic;
- }
-
- _this.selector.find(".Ldt-createAnnotation-Description").val(newVal);
-
- // also call our update function.
- _this.handleTextChanges();
- }
- }(polemic));
- }
+
+ // Add onclick event to both polemic and keywords buttons
+
+ this.selector.find(".Ldt-createAnnotation-btnblock button").click(function() {
+ _this.addKeyword(IriSP.jQuery(this).text());
+ });
// js_mod is a custom event because there's no simple way to test for a js
// change in a textfield.
@@ -3189,11 +3362,7 @@
.bind("propertychange keyup input paste js_mod", IriSP.wrap(this, this.handleTextChanges));
/* the cinecast version of the player is supposed to pause when the user clicks on the button */
- if (this.cinecast_version) {
- this.selector.find(".Ldt-createAnnotation-Description")
- .one("propertychange keyup input paste js_mod",
- function() { if (!_this._Popcorn.media.paused) _this._Popcorn.pause() });
- }
+
/* the cinecast version expects the user to comment on a defined segment.
As the widget is always shown, we need a way to update it's content as
time passes. We do this like we did with the annotationsWidget : we schedule
@@ -3251,6 +3420,19 @@
}
};
+/* Handles adding keywords and polemics */
+IriSP.createAnnotationWidget.prototype.addKeyword = function(_keyword) {
+ var _field = this.selector.find(".Ldt-createAnnotation-Description"),
+ _rx = IriSP.regexpFromText(_keyword),
+ _contents = _field.val();
+ _contents = ( _rx.test(_contents)
+ ? _contents.replace(_rx,"").replace(" "," ").trim()
+ : _contents.trim() + " " + _keyword
+ );
+ _field.val(_contents);
+ _field.trigger("js_mod");
+}
+
/** handles clicks on the annotate button. Works only for the non-cinecast version */
IriSP.createAnnotationWidget.prototype.handleAnnotateSignal = function() {
@@ -3309,51 +3491,31 @@
/** watch for changes in the textfield and change the buttons accordingly */
IriSP.createAnnotationWidget.prototype.handleTextChanges = function(event) {
var contents = this.selector.find(".Ldt-createAnnotation-Description").val();
-
- for(var keyword in this.ids) {
-
- var id = this.ids[keyword];
-
- if (contents.indexOf(keyword) != -1) {
- /* the word is present in the textarea but the button is not toggled */
- if (this.selector.find("#" + id).hasClass("Ldt-createAnnotation-absent-keyword"))
- this.selector.find("#" + id).removeClass("Ldt-createAnnotation-absent-keyword")
- .addClass("Ldt-createAnnotation-present-keyword");
- } else {
- /* the word is absent from the textarea but the button is toggled */
- if (this.selector.find("#" + id).hasClass("Ldt-createAnnotation-present-keyword")) {
- this.selector.find("#" + id).removeClass("Ldt-createAnnotation-present-keyword")
- .addClass("Ldt-createAnnotation-absent-keyword");
+ if (this.cinecast_version && !this._Popcorn.media.paused) {
+ this._Popcorn.pause();
+ }
+ this.selector.find(".Ldt-createAnnotation-btnblock button").each(function() {
+ var _rx = IriSP.regexpFromText(IriSP.jQuery(this).text());
+ if (_rx.test(contents)) {
+ IriSP.jQuery(this).parent().addClass("Ldt-createAnnotation-active-button");
+ } else {
+ IriSP.jQuery(this).parent().removeClass("Ldt-createAnnotation-active-button");
}
- }
- }
-
- if (this.polemic_mode) {
- /* Also go through the polemics to highlight the buttons */
- for (var polemic in this.polemics) {
- /* Add the active class to the button */
- var classname = "Ldt-createAnnotation-polemic-" + this.polemics[polemic];
- if (contents.indexOf(polemic) != -1) {
- this.selector.find("." + classname).addClass("Ldt-createAnnotation-polemic-active");
- } else {
- if (this.selector.find("." + classname).addClass("Ldt-createAnnotation-polemic-active"))
- this.selector.find("." + classname).removeClass("Ldt-createAnnotation-polemic-active")
- }
- }
- }
+ });
+
};
IriSP.createAnnotationWidget.prototype.showStartScreen = function() {
- this.selector.find(".Ldt-createAnnotation-DoubleBorder").children().hide();
+ this.selector.find(".Ldt-createAnnotation-screen").hide();
this.selector.find(".Ldt-createAnnotation-startScreen").show();
var jqTextfield = this.selector.find(".Ldt-createAnnotation-Description"); // handle on the textfield. used for the closure
/* test if the browser supports the placeholder attribute */
if (!IriSP.null_or_undefined(jqTextfield.get(0).placeholder)) {
- jqTextfield.attr("placeholder", "Type your annotation here.");
+ jqTextfield.attr("placeholder", IriSP.i18n.getMessage('type_here'));
} else {
- jqTextfield.val("Type your annotation here.");
+ jqTextfield.val(IriSP.i18n.getMessage('type_here'));
jqTextfield.one("click", IriSP.wrap(this, function() { jqTextfield.val(""); }));
}
@@ -3363,26 +3525,30 @@
};
IriSP.createAnnotationWidget.prototype.showWaitScreen = function() {
- this.selector.find(".Ldt-createAnnotation-DoubleBorder").children().hide();
+ this.selector.find(".Ldt-createAnnotation-screen").hide();
this.selector.find(".Ldt-createAnnotation-waitScreen").show();
this._state = "waitScreen";
};
IriSP.createAnnotationWidget.prototype.showErrorScreen = function() {
- this.selector.find(".Ldt-createAnnotation-DoubleBorder").children().hide();
+ this.selector.find(".Ldt-createAnnotation-screen").hide();
this.selector.find(".Ldt-createAnnotation-errorScreen").show();
this._state = "errorScreen";
+ var _this = this;
+ window.setTimeout(function() { _this.showStartScreen(); }, 2000);
};
/** update show the final screen with links to share the created annotation */
IriSP.createAnnotationWidget.prototype.showEndScreen = function(annotation) {
- this.selector.find(".Ldt-createAnnotation-DoubleBorder").children().hide();
+ this.selector.find(".Ldt-createAnnotation-screen").hide();
if (this.cinecast_version) {
this.selector.find(".Ldt-createAnnotation-Title").parent().show();
}
- var url = document.location.href + "#id=" + annotation.id;
+ var url = ( (typeof annotation.meta == "object" && typeof annotation.meta.url == "string" && annotation.meta.url.length)
+ ? annotation.meta.url
+ : ( document.location.href + "#id=" + annotation.id ) );
var twStatus = IriSP.mkTweetUrl(url);
var gpStatus = IriSP.mkGplusUrl(url);
var fbStatus = IriSP.mkFbUrl(url);
@@ -3400,7 +3566,7 @@
var _this = this;
var textfield = this.selector.find(".Ldt-createAnnotation-Description");
var contents = textfield.val();
-
+
if (contents === "") {
if (this.selector.find(".Ldt-createAnnotation-errorMessage").length === 0) {
this.selector.find(".Ldt-createAnnotation-Container")
@@ -3430,7 +3596,7 @@
if (_this._state == "waitScreen") {
_this.showEndScreen(annotation);
if (_this.cinecast_version) {
- window.setTimeout(IriSP.wrap(_this, function() { this.showStartScreen(); }), 5000);
+ window.setTimeout(function() { _this.showStartScreen(); }, 5000);
}
}
// hide the slicer widget
@@ -3449,51 +3615,58 @@
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"];
- var duration_part = Math.round(this._serializer.getDuration() / 20);
+ var annotation = apiJson.annotations[0];
+
+ annotation.media = this._serializer.currentMedia()["id"];
if (this.cinecast_version) {
- annotation["begin"] = Math.round(this._Popcorn.currentTime() * 1000 - duration_part);
- annotation["end"] = Math.round(this._Popcorn.currentTime() * 1000 + duration_part);
+ annotation.begin = Math.round(this._Popcorn.currentTime() * 1000);
+ annotation.end = annotation.begin;
} else {
var duration = this._serializer.getDuration();
- annotation["begin"] = +((duration * (this.sliceLeft / 100)).toFixed(0));
- annotation["end"] = +((duration * ((this.sliceWidth + this.sliceLeft) / 100)).toFixed(0));
+ annotation.begin = +((duration * (this.sliceLeft / 100)).toFixed(0));
+ annotation.end = +((duration * ((this.sliceWidth + this.sliceLeft) / 100)).toFixed(0));
}
// boundary checks
- if (annotation["begin"] < 0)
- annotation["begin"] = 0;
-
- if (annotation["end"] > this._serializer.getDuration())
- annotation["end"] = this._serializer.getDuration();
-
-
- annotation["type"] = this._serializer.getContributions();
- if (typeof(annotation["type"]) === "undefined")
- annotation["type"] = "";
-
- annotation["type_title"] = "Contributions";
+ annotation.begin = Math.max(0, annotation.begin);
+ annotation.end = Math.min(this._serializer.getDuration(), annotation.end);
+
+ annotation.type = ( this.cinecast_version ? "cinecast:UserAnnotation" : ( this._serializer.getContributions() || "" ));
+ if (typeof(annotation.type) === "undefined")
+ annotation.type = "";
+
+ annotation.type_title = "Contributions";
annotation.content = {};
- annotation.content["data"] = contents;
-
- var meta = apiJson["meta"];
- if (!IriSP.null_or_undefined(IriSP.user) && !IriSP.null_or_undefined(IriSP.user.name))
- meta.creator = IriSP.user.name;
- else
- meta.creator = "An User";
+ annotation.content.data = contents;
+ if (this.cinecast_version) {
+ var _extract = IriSP.underscore(this._serializer._data.annotations)
+ .filter(function(_a) {
+ return (_a.begin <= annotation.begin && _a.end >= annotation.begin && _a.type == "cinecast:MovieExtract");
+ })
+ if (_extract.length) {
+ annotation.extract = _extract[0].id;
+ }
+ }
+
+ var meta = apiJson.meta;
+
+
+ var _username = this.selector.find(".Ldt-createAnnotation-userName").val();
+ meta.creator = (
+ (_username && _username.length)
+ ? _username
+ : (
+ (!IriSP.null_or_undefined(IriSP.user) && !IriSP.null_or_undefined(IriSP.user.name))
+ ? IriSP.user.name
+ : "Anonymous user"
+ )
+ );
meta.created = Date().toString();
- annotation["tags"] = [];
-
- for (var i = 0; i < this.keywords.length; i++) {
- var keyword = this.keywords[i];
- if (contents.indexOf(keyword) != -1)
- annotation["tags"].push(keyword);
- }
+ // All #hashtags are added to tags
+ annotation.tags = contents.match(/#[^#\s]+\b/gim) || [];
var jsonString = JSON.stringify(apiJson);
var project_id = this._serializer._data.meta.id;
@@ -3504,32 +3677,35 @@
IriSP.jQuery.ajax({
url: url,
- type: 'PUT',
+ type: this.api_method,
contentType: 'application/json',
data: jsonString,
//dataType: 'json',
success: IriSP.wrap(this, function(json, textStatus, XMLHttpRequest) {
/* add the annotation to the annotation and tell the world */
-
+ if (this.cinecast_version) {
+ var annotation = json.annotations[0];
+ } else {
/* 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}
-
-
- IriSP.get_aliased(this._serializer._data, ["annotation_types", "annotation-types"]).push(tmp_view);
+ 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}
+
+
+ IriSP.get_aliased(this._serializer._data, ["annotation_types", "annotation-types"]).push(tmp_view);
+ }
+
+ delete annotation.tags;
+ annotation.content.description = annotation.content.data;
+ annotation.content.title = "";
+ delete annotation.content.data;
+ annotation.id = json.annotations[0].id;
+
+ annotation.meta = meta;
+ annotation.meta["id-ref"] = json.annotations[0]["type"];
}
-
- delete annotation.tags;
- annotation.content.description = annotation.content.data;
- annotation.content.title = "";
- delete annotation.content.data;
- annotation.id = json.annotations[0].id;
-
- annotation.meta = meta;
- annotation.meta["id-ref"] = json.annotations[0]["type"];
-
+
// everything is shared so there's no need to propagate the change
_this._serializer._data.annotations.push(annotation);
@@ -3558,6 +3734,42 @@
console.log(this);
}
+/* Internationalization for this widget */
+
+IriSP.i18n.addMessages(
+ {
+ "en": {
+ "play_pause": "Play/Pause",
+ "mute_unmute": "Mute/Unmute",
+ "play": "Play",
+ "pause": "Pause",
+ "mute": "Mute",
+ "unmute": "Unmute",
+ "annotate": "Annotate",
+ "search": "Search",
+ "elapsed_time": "Elapsed time",
+ "total_time": "Total time",
+ "volume": "Volume",
+ "volume_control": "Volume control"
+ },
+ "fr": {
+ "play_pause": "Lecture/Pause",
+ "mute_unmute": "Couper/Activer le son",
+ "play": "Lecture",
+ "pause": "Pause",
+ "mute": "Couper le son",
+ "unmute": "Activer le son",
+ "annotate": "Annoter",
+ "search": "Rechercher",
+ "elapsed_time": "Durée écoulée",
+ "total_time": "Durée totale",
+ "volume": "Niveau sonore",
+ "volume_control": "Réglage du niveau sonore"
+ }
+ }
+);
+
+
IriSP.PlayerWidget = function(Popcorn, config, Serializer) {
IriSP.Widget.call(this, Popcorn, config, Serializer);
@@ -3573,7 +3785,7 @@
var height = this.height;
var heightS = this.height-20;
- var playerTempl = IriSP.templToHTML(IriSP.player_template, {"share_template" : IriSP.share_template});
+ var playerTempl = IriSP.templToHTML(IriSP.player_template, this._config);
this.selector.append(playerTempl);
this.selector.children(".Ldt-controler").show();
@@ -3582,7 +3794,7 @@
this._Popcorn.listen("play", IriSP.wrap(this, this.playButtonUpdater));
this._Popcorn.listen("pause", IriSP.wrap(this, this.playButtonUpdater));
- this._Popcorn.listen("volumechange", IriSP.wrap(this, this.muteButtonUpdater));
+ this._Popcorn.listen("volumechange", IriSP.wrap(this, this.volumeUpdater));
this._Popcorn.listen("timeupdate", IriSP.wrap(this, this.timeDisplayUpdater));
// update the time display for the first time.
@@ -3598,9 +3810,20 @@
{ self._Popcorn.trigger("IriSP.PlayerWidget.AnnotateButton.clicked"); });
this.selector.find(".Ldt-CtrlSearch").click(function() { self.searchButtonHandler.call(self); });
- this.selector.find('.Ldt-CtrlSound').click(function() { self.muteHandler.call(self); } );
-
- this.selector.find(".Ldt-CtrlPlay").attr( "style", "background-color:#CD21C24;" );
+ var _volctrl = this.selector.find(".Ldt-Ctrl-Volume-Control");
+ this.selector.find('.Ldt-CtrlSound')
+ .click(function() { self.muteHandler.call(self); } )
+ .mouseover(function() {
+ _volctrl.show();
+ })
+ .mouseout(function() {
+ _volctrl.hide();
+ });
+ _volctrl.mouseover(function() {
+ _volctrl.show();
+ }).mouseout(function() {
+ _volctrl.hide();
+ });
/*
var searchButtonPos = this.selector.find(".Ldt-CtrlSearch").position();
@@ -3611,16 +3834,27 @@
// trigger an IriSP.PlayerWidget.MouseOver to the widgets that are interested (i.e : sliderWidget)
this.selector.hover(function() { self._Popcorn.trigger("IriSP.PlayerWidget.MouseOver"); },
function() { self._Popcorn.trigger("IriSP.PlayerWidget.MouseOut"); });
+ this.selector.find(".Ldt-Ctrl-Volume-Cursor").draggable({
+ axis: "x",
+ drag: function(event, ui) {
+ var _vol = Math.max(0, Math.min( 1, ui.position.left / (ui.helper.parent().width() - ui.helper.outerWidth())));
+ ui.helper.attr("title",IriSP.i18n.getMessage('volume')+': ' + Math.floor(100*_vol) + '%');
+ self._Popcorn.volume(_vol);
+ },
+ containment: "parent"
+ });
- this.muteButtonUpdater(); /* some player - jwplayer notable - save the state of the mute button between sessions */
+ setTimeout(function() {
+ self.volumeUpdater();
+ }, 1000); /* some player - jwplayer notable - save the state of the mute button between sessions */
};
/* Update the elasped time div */
IriSP.PlayerWidget.prototype.timeDisplayUpdater = function() {
- if (this._previousSecond === undefined)
+ if (this._previousSecond === undefined) {
this._previousSecond = this._Popcorn.roundTime();
-
+ }
else {
/* we're still in the same second, so it's not necessary to update time */
if (this._Popcorn.roundTime() == this._previousSecond)
@@ -3647,10 +3881,10 @@
if ( status == true ){
/* the background sprite is changed by adding/removing the correct classes */
- this.selector.find(".Ldt-CtrlPlay").attr("title", "Play");
+ this.selector.find(".Ldt-CtrlPlay").attr("title", IriSP.i18n.getMessage('play'));
this.selector.find(".Ldt-CtrlPlay").removeClass("Ldt-CtrlPlay-PauseState").addClass("Ldt-CtrlPlay-PlayState");
} else {
- this.selector.find(".Ldt-CtrlPlay").attr("title", "Pause");
+ this.selector.find(".Ldt-CtrlPlay").attr("title", IriSP.i18n.getMessage('pause'));
this.selector.find(".Ldt-CtrlPlay").removeClass("Ldt-CtrlPlay-PlayState").addClass("Ldt-CtrlPlay-PauseState");
}
@@ -3669,25 +3903,28 @@
};
IriSP.PlayerWidget.prototype.muteHandler = function() {
- if (!this._Popcorn.muted()) {
- this._Popcorn.mute(true);
- } else {
- this._Popcorn.mute(false);
+ this._Popcorn.mute(!this._Popcorn.muted());
+};
+
+IriSP.PlayerWidget.prototype.volumeUpdater = function() {
+ var _muted = this._Popcorn.muted(),
+ _vol = this._Popcorn.volume();
+ if (_vol === false) {
+ _vol = .5;
}
-};
-
-IriSP.PlayerWidget.prototype.muteButtonUpdater = function() {
- var status = this._Popcorn.media.muted;
-
- if ( status == true ){
- this.selector.find(".Ldt-CtrlSound").attr("title", "Unmute");
- this.selector.find(".Ldt-CtrlSound").removeClass("Ldt-CtrlSound-MuteState").addClass("Ldt-CtrlSound-SoundState");
- } else {
- this.selector.find(".Ldt-CtrlSound").attr("title", "Mute");
- this.selector.find(".Ldt-CtrlSound").removeClass("Ldt-CtrlSound-SoundState").addClass("Ldt-CtrlSound-MuteState");
- }
-
- return;
+ var _soundCtl = this.selector.find(".Ldt-CtrlSound");
+ _soundCtl.removeClass("Ldt-CtrlSound-Mute Ldt-CtrlSound-Half Ldt-CtrlSound-Full");
+ if (_muted) {
+ _soundCtl.attr("title", IriSP.i18n.getMessage('unmute'))
+ .addClass("Ldt-CtrlSound-Mute");
+ } else {
+ _soundCtl.attr("title", IriSP.i18n.getMessage('mute'))
+ .addClass(_vol < .5 ? "Ldt-CtrlSound-Half" : "Ldt-CtrlSound-Full" )
+ }
+ var _cursor = this.selector.find(".Ldt-Ctrl-Volume-Cursor");
+ _cursor.css({
+ "left": ( _muted ? 0 : Math.floor(_vol * (_cursor.parent().width() - _cursor.outerWidth())) ) + "px"
+ })
};
IriSP.PlayerWidget.prototype.showSearchBlock = function() {
@@ -3837,7 +4074,7 @@
var duration = this._serializer.getDuration(); // timescale width
var frameLength = lineSize / frameSize; // frame timescale
var timeline;
- var colors = new Array("","#1D973D","#C5A62D","#CE0A15","#036AAE","#585858");
+ var colors = new Array("","#1D973D","#036AAE","#CE0A15","#C5A62D","#585858");
// array
//var tweets = new Array();
@@ -4105,9 +4342,16 @@
e.id = frames[i].mytweetsID[k].cinecast_id;
this.svgElements[e.id] = e;
- IriSP.jQuery(e.node).mouseenter(function(element) { return function () {
+ IriSP.jQuery(e.node).mouseenter(function(element) { return function (_e) {
self.TooltipWidget.show.call(self.TooltipWidget, element.title, element.attr("fill"), element.attrs.x + element.attrs.width / 2, element.attrs.y - 2);
element.displayed = true;
+ self._Popcorn.trigger("IriSP.TraceWidget.MouseEvents", {
+ "widget" : "StackGraphWidget",
+ "type": "mousemove",
+ "x": _e.pageX,
+ "y": _e.pageY,
+ "annotation_id": element.id
+ });
}}(e)).mousedown(function(element) { return function () {
self._Popcorn.currentTime(element.time/1000);
self._Popcorn.trigger("IriSP.PolemicTweet.click", element.id);
@@ -4232,36 +4476,13 @@
this._Popcorn.listen("IriSP.search", function(searchString) { self.searchHandler.call(self, searchString); });
this._Popcorn.listen("IriSP.search.closed", function() { self.searchFieldClosedHandler.call(self); });
this._Popcorn.listen("IriSP.search.cleared", function() { self.searchFieldClearedHandler.call(self); });
+
+ this.checkOption("cinecast_version");
+ this.defaultColors = ["#1f77b4","#aec7e8","#ff7f0e","#ffbb78","#2ca02c","#98df8a","#d62728","#ff9896","#9467bd","#c5b0d5","#8c564b","#c49c94","#e377c2","#f7b6d2","#7f7f7f","#c7c7c7","#bcbd22","#dbdb8d","#17becf","#9edae5"]
};
IriSP.SegmentsWidget.prototype = new IriSP.Widget();
-/* Get the width of a segment, in pixels. */
-IriSP.SegmentsWidget.prototype.segmentToPixel = function(annotation) {
- var begin = Math.round((+ annotation.begin) / 1000);
- var end = Math.round((+ annotation.end) / 1000);
- var duration = this._serializer.getDuration() / 1000;
-
- var startPourcent = IriSP.timeToPourcent(begin, duration);
- var startPixel = Math.floor(this.selector.parent().width() * (startPourcent / 100));
-
- var endPourcent = Math.floor(IriSP.timeToPourcent(end, duration) - startPourcent);
- var endPixel = Math.floor(this.selector.parent().width() * (endPourcent / 100));
-
- return endPixel;
-};
-
-/* compute the total length of a group of segments */
-IriSP.SegmentsWidget.prototype.segmentsLength = function(segmentsList) {
- var self = this;
- var total = 0;
-
- for (var i = 0; i < segmentsList.length; i++)
- total += self.segmentToPixel(segmentsList[i].annotation);
-
- return total;
-};
-
IriSP.SegmentsWidget.prototype.draw = function() {
var self = this;
@@ -4269,33 +4490,45 @@
this.selector.addClass("Ldt-SegmentsWidget");
this.selector.append(Mustache.to_html(IriSP.overlay_marker_template));
-
- var view_type = this._serializer.getChapitrage();
- if (typeof(view_type) === "undefined") {
- view_type = this._serializer.getNonTweetIds()[0];
- }
+
this.positionMarker = this.selector.find(".Ldt-SegmentPositionMarker");
this._Popcorn.listen("timeupdate", IriSP.wrap(this, this.positionUpdater));
-
-
- var i = 0;
-
- var segments_annotations = [];
-
- for (i = 0; i < annotations.length; i++) {
- var annotation = annotations[i];
-
- /* filter the annotations whose type is not the one we want */
- if (view_type != "" && typeof(annotation.meta) !== "undefined" && typeof(annotation.meta["id-ref"]) !== "undefined"
- && annotation.meta["id-ref"] != view_type) {
- continue;
- }
-
- segments_annotations.push(annotation);
+ var duration = this._serializer.getDuration();
+
+ if (this.cinecast_version) {
+ var segments_annotations = IriSP.underscore.filter(
+ this._serializer._data.annotations,
+ function(_a) {
+ return _a.type == "cinecast:MovieExtract";
+ }
+ );
}
+ else {
+
+ var view_type = this._serializer.getChapitrage();
+ if (typeof(view_type) === "undefined") {
+ view_type = this._serializer.getNonTweetIds()[0];
+ }
- var totalWidth = this.selector.width() - segments_annotations.length;
+
+ var i = 0;
+
+ var segments_annotations = [];
+
+ for (i = 0; i < annotations.length; i++) {
+ var annotation = annotations[i];
+
+ /* filter the annotations whose type is not the one we want */
+ if (view_type != "" && typeof(annotation.meta) !== "undefined" && typeof(annotation.meta["id-ref"]) !== "undefined"
+ && annotation.meta["id-ref"] != view_type) {
+ continue;
+ }
+
+ segments_annotations.push(annotation);
+ }
+}
+ var _w = this.selector.width();
var lastSegment = IriSP.underscore.max(segments_annotations, function(annotation) { return annotation.end; });
for (i = 0; i < segments_annotations.length; i++) {
@@ -4303,100 +4536,87 @@
var annotation = segments_annotations[i];
var begin = (+ annotation.begin);
var end = (+ annotation.end);
- var duration = this._serializer.getDuration();
var id = annotation.id;
- var startPixel = Math.floor(this.selector.parent().width() * (begin / duration));
-
- var endPixel = Math.floor(this.selector.parent().width() * (end / duration));
-
+ var startPixel = Math.floor(_w * (begin / duration));
+
+ var endPixel = Math.floor(_w * (end / duration));
if (annotation.id !== lastSegment.id)
var pxWidth = endPixel - startPixel -1;
else
/* the last segment has no segment following it */
var pxWidth = endPixel - startPixel;
-
- var divTitle = IriSP.clean_substr(annotation.content.title + " -
" + annotation.content.description, 0, 132) + "...";
-
- if (typeof(annotation.content.color) !== "undefined")
- var color = annotation.content.color;
- else
- var color = annotation.color;
+
+ var divTitle = this.cinecast_version
+ ? annotation.content.data
+ : annotation.content.title + ( annotation.content.title ? "
" : "" ) + annotation.content.description.replace(/(^.{120,140})[\s].+$/,'$1…');
- var hexa_color = IriSP.DEC_HEXA_COLOR(color);
+ var thumbUrl = annotation.meta.thumbnail || '';
+
+ var hexa_color = typeof(annotation.content.color) !== "undefined"
+ ? '#' + IriSP.DEC_HEXA_COLOR(annotation.content.color)
+ : typeof(annotation.color) !== "undefined"
+ ? '#' + IriSP.DEC_HEXA_COLOR(annotation.color)
+ : this.defaultColors[i % this.defaultColors.length];
/*
if (hexa_color === "FFCC00")
hexa_color = "333";
*/
- if (hexa_color.length == 4)
+ if (hexa_color.length == 5)
hexa_color = hexa_color + '00';
+
var annotationTemplate = Mustache.to_html(IriSP.annotation_template,
{"divTitle" : divTitle, "id" : id, "startPixel" : startPixel,
"pxWidth" : pxWidth, "hexa_color" : hexa_color,
- "seekPlace" : Math.round(begin/1000)});
+ "seekPlace" : Math.round(begin/1000), "thumbnailUrl": thumbUrl});
this.selector.append(annotationTemplate);
/* add a special class to the last segment and change its border */
if (annotation.id === lastSegment.id) {
- this.selector.find("#" + id).addClass("Ldt-lastSegment");
- this.selector.find(".Ldt-lastSegment").css("border-color", "#" + hexa_color);
+ IriSP.jqId(id).addClass("Ldt-lastSegment").css("border-color", hexa_color);
}
-
- IriSP.jQuery("#" + id).fadeTo(0, 0.3);
-
- IriSP.jQuery("#" + id).mouseover(
- /* we wrap the handler in another function because js's scoping
- rules are function-based - otherwise, the internal vars like
- divTitle are preserved but they are looked-up from the draw
- method scope, so after that the loop is run, so they're not
- preserved */
- (function(divTitle) {
- return function(event) {
- IriSP.jQuery(this).animate({opacity: 0.6}, 5);
- var offset_x = IriSP.jQuery(this).position().left + IriSP.jQuery(this).outerWidth() / 2;
-
- self.TooltipWidget.show(divTitle, color, offset_x, 0);
- } })(divTitle)).mouseout(function(){
- IriSP.jQuery(this).animate({opacity: 0.3}, 5);
- self.TooltipWidget.hide();
- });
-
+ }
// react to mediafragment messages.
this._Popcorn.listen("IriSP.Mediafragment.showAnnotation",
- function(id, divTitle) {
- return function(annotation_id) {
- if (annotation_id !== id)
- return;
+ function(id, divTitle) {
- var divObject = IriSP.jQuery("#" + id);
- divObject.animate({opacity: 0.6}, 5);
- var offset = divObject.offset();
- var correction = divObject.outerWidth() / 2;
-
- var offset_x = offset.left + correction - 106;
- if (offset_x < 0)
- offset_x = 0;
-
- var offset_y = offset.top;
-
- self.TooltipWidget.show(divTitle, color, offset_x, offset_y - 160);
- IriSP.jQuery(document).one("mousemove", function() { divObject.animate({opacity: 0.3}, 5);
+ var divObject = IriSP.jqId(id);
+ if (divObject.length) {
+ divObject.fadeTo(0,1);
+ var offset_x = divObject.position().left + divObject.outerWidth() / 2;
+ self.TooltipWidget.show(divObject.attr("title"), IriSP.jQuery(this).css("background-color"), offset_x, 0);
+ IriSP.jQuery(document).one("mousemove", function() { divObject.fadeTo(0,.5);
self.TooltipWidget.hide(); });
- }; }(id, divTitle));
-
- IriSP.jQuery("#" + id).click(function(_this, annotation) {
- return function() { _this.clickHandler(annotation)};
- }(this, annotation));
- }
+ }
+ });
+
+ this.selector.find(".Ldt-iri-chapter")
+ .fadeTo(0, .5)
+ .click(function() {
+ self._Popcorn.trigger("IriSP.SegmentsWidget.click", this.id);
+ self._Popcorn.currentTime(IriSP.jQuery(this).attr("data-seek"));
+ })
+ .mouseover( function(event) {
+ var divObject = IriSP.jQuery(this);
+ divObject.fadeTo(0,1);
+ var offset_x = divObject.position().left + divObject.outerWidth() / 2;
+ var thumb = divObject.attr("thumbnail-url");
+ var txt = divObject.attr("title") + (thumb && thumb.length ? '
' : '');
+ self.TooltipWidget.show(txt, IriSP.jQuery(this).css("background-color"), offset_x, 0);
+ })
+ .mouseout(function(){
+ IriSP.jQuery(this).fadeTo(0,.5);
+ self.TooltipWidget.hide();
+ });
};
/* restores the view after a search */
IriSP.SegmentsWidget.prototype.clear = function() {
- this.selector.children(".Ldt-iri-chapter").animate({opacity:0.3}, 100);
+ this.selector.children(".Ldt-iri-chapter").fadeTo(0,.5);
};
IriSP.SegmentsWidget.prototype.clickHandler = function(annotation) {
@@ -4770,16 +4990,16 @@
};
IriSP.SliderWidget.prototype.positionMarkerDraggedHandler = function(event, ui) {
- this._disableUpdate = true; // disable slider position updates while dragging is ongoing.
+
+/* this._disableUpdate = true; // disable slider position updates while dragging is ongoing.
window.setTimeout(IriSP.wrap(this, function() { this._disableUpdate = false; }), 500);
-
+*/
var parentOffset = this.sliderForeground.parent().offset();
var width = this.sliderBackground.width();
- var relX = event.pageX - parentOffset.left;
+ var relX = event.originalEvent.pageX - parentOffset.left;
var duration = this._serializer.getDuration() / 1000;
var newTime = ((relX / width) * duration).toFixed(2);
-
this._Popcorn.currentTime(newTime);
this.draggingOngoing = false;
@@ -4791,6 +5011,22 @@
this._oldAnnotation = null;
this._results = [];
+
+ this.lineColor = this._config.lineColor || "#7492b4";
+ this.fillColor = this._config.fillColor || "#aeaeb8";
+ this.lineWidth = this._config.lineWidth || 2;
+ this.slices = this._config.slices || Math.floor(this.width/20);
+ if (!this.width) {
+ this.width = this.selector.width();
+ }
+ if (!this.height) {
+ this.height = 40;
+ }
+ this.selector.css("height", this.height + "px");
+ if (this._config.background) {
+ this.selector.css("background", this._config.background);
+ }
+ this.checkOption('cinecast_version');
};
@@ -4802,19 +5038,14 @@
/** draw the sparkline using jquery sparkline */
IriSP.SparklineWidget.prototype.draw = function() {
- var templ = Mustache.to_html(IriSP.SparklineWidget_template, {width: this.width, height: this.height});
- /** this widget uses three divs -
- the first is the sparkline, which is generated by jquery sparkline,
- the second is an overlay div to display the progression in the video,
- and the third is a div to react to clicks
- */
+ this.duration = this._serializer.getDuration();
+ this.paper = new Raphael(this.selector[0], this.width, this.height);
+ var _this = this;
var views = this._serializer._data.views;
var stat_view;
if (!IriSP.null_or_undefined(views)) {
-
- var i;
- for (i = 0; i < views.length; i++) {
+ for (var i = 0; i < views.length; i++) {
var view = views[i];
if (view.id === "stat") {
stat_view = view;
@@ -4823,107 +5054,103 @@
}
}
+ var _ = IriSP.underscore;
// If we've found the correct view, feed the directly the data from the view
// to jquery sparkline. Otherwise, compute it ourselves.
- if (!IriSP.null_or_undefined(stat_view)) {
- console.log("sparklinewidget : using stats embedded in the json");
- var results = stat_view.meta.stat.split(",");
- } else {
- console.log("sparklinewidget : computing stats ourselves");
- var num_columns = (this.selector.width()) / IriSP.widgetsDefaults["SparklineWidget"].column_width;
- var duration = this._serializer.getDuration();
- var time_step = duration / num_columns; /* the time interval between two columns */
- var results = [];
- var i = 0; /* the index in the loop */
-
- /* this algorithm makes one assumption : that the array is sorted
- (it's done for us by the JSONSerializer). We go through the array
- and count how many comments fall within a peculiar time piece.
- As i is preserved between each iteration, it's O(n).
- */
-
- for(var j = 0; j < num_columns && i < this._serializer._data.annotations.length; j++) {
- var count = 0;
- var annotation_begin = +(this._serializer._data.annotations[i].begin);
-
- while(annotation_begin >= j * time_step && annotation_begin <= (j + 1) * time_step ) {
- count++;
- i++;
- if (i >= this._serializer._data.annotations.length)
- break;
-
- annotation_begin = +(this._serializer._data.annotations[i].begin);
-
- }
-
- results.push(count);
+ if (!IriSP.null_or_undefined(stat_view)) {
+ //console.log("sparklinewidget : using stats embedded in the json");
+ var _results = stat_view.meta.stat.split(",");
+ } else {
+ var _annotations = this._serializer._data.annotations,
+ _sliceDuration = Math.floor( this.duration / this.slices),
+ _results = _(_.range(this.slices)).map(function(_i) {
+ return _(_annotations).filter(function(_a){
+ return (_a.begin <= (1 + _i) * _sliceDuration) && (_a.end >= _i * _sliceDuration) && (!_this.cinecast_version || _a.type == "cinecast:UserAnnotation")
+ }).length;
+ });
}
- }
-
+ var _max = Math.max(1, _(_results).max()),
+ _h = this.height,
+ _scale = (_h - this.lineWidth) / _max,
+ _width = this.width / this.slices,
+ _y = _(_results).map(function(_v) {
+ return _h - (_scale * _v);
+ }),
+ _d = _(_y).reduce(function(_memo, _v, _k) {
+ return _memo + ( _k
+ ? 'C' + (_k * _width) + ' ' + _y[_k - 1] + ' ' + (_k * _width) + ' ' + _v + ' ' + ((_k + .5) * _width) + ' ' + _v
+ : 'M0 ' + _v + 'L' + (.5*_width) + ' ' + _v )
+ },'') + 'L' + this.width + ' ' + _y[_y.length - 1],
+ _d2 = _d + 'L' + this.width + ' ' + this.height + 'L0 ' + this.height;
+ this.paper.path(_d2).attr({
+ "stroke" : "none",
+ "fill" : this.fillColor
+ });
+
+ this.paper.path(_d).attr({
+ "fill" : "none",
+ "stroke" : this.lineColor,
+ "stroke-width" : this.lineWidth
+ });
+
+ this.rectangleProgress = this.paper.rect(0,0,0,this.height)
+ .attr({
+ "stroke" : "none",
+ "fill" : "#808080",
+ "opacity" : .3
+ });
+ this.ligneProgress = this.paper.path("M0 0L0 "+this.height).attr({"stroke":"#ff00ff", "line-width" : 2});
// save the results in an array so that we can re-use them when a new annotation
// is added.
- this._results = results;
-
- this.selector.append(templ);
- this.selector.find(".Ldt-sparkLine").css("background", "#c7c8cc");
- this.selector.find(".Ldt-sparkLine").sparkline(results, {lineColor: "#7492b4", fillColor: "#aeaeb8",
- spotColor: "#b70056",
- width: this.width, height: this.height});
+ this._results = _results;
+
this._Popcorn.listen("timeupdate", IriSP.wrap(this, this.timeUpdateHandler));
- this._Popcorn.listen("IriSP.createAnnotationWidget.addedAnnotation", IriSP.wrap(this, this.handleNewAnnotation));
-
- IriSP.jQuery(".Ldt-sparkLineClickOverlay").click(IriSP.wrap(this, this.clickHandler));
+// this._Popcorn.listen("IriSP.createAnnotationWidget.addedAnnotation", IriSP.wrap(this, this.handleNewAnnotation));
+
+ this.selector.click(IriSP.wrap(this, this.clickHandler));
};
/** react to a timeupdate event */
IriSP.SparklineWidget.prototype.timeUpdateHandler = function() {
- var currentTime = this._Popcorn.currentTime();
- var duration = this._serializer.getDuration() / 1000;
- var proportion = ((currentTime / duration) * 100).toFixed(4);
-
- IriSP.jQuery(".Ldt-sparkLinePositionMarker").css("width", proportion + "%");
+ var _currentTime = this._Popcorn.currentTime(),
+ _x = (1000 * _currentTime / this.duration) * this.width;
+ this.rectangleProgress.attr({
+ "width" : _x
+ });
+ this.ligneProgress.attr({
+ "path" : "M" + _x + " 0L" + _x + " " + this.height
+ });
+
}
/** handle clicks on the widget */
IriSP.SparklineWidget.prototype.clickHandler = function(event) {
- /* this piece of code is a little bit convoluted - here's how it works :
- we want to handle clicks on the progress bar and convert those to seeks in the media.
- However, jquery only gives us a global position, and we want a number of pixels relative
- to our container div, so we get the parent position, and compute an offset to this position,
- and finally compute the progress ratio in the media.
- Finally we multiply this ratio with the duration to get the correct time
- */
-
- var parentOffset = this.selector.offset();
- var width = this.selector.width();
- var relX = event.pageX - parentOffset.left;
-
- var duration = this._serializer.getDuration() / 1000;
- var newTime = ((relX / width) * duration).toFixed(2);
+ var relX = event.pageX - this.selector.offset().left;
+ var newTime = ((relX / this.width) * this.duration/1000).toFixed(2);
this._Popcorn.trigger("IriSP.SparklineWidget.clicked", newTime);
- this._Popcorn.currentTime(newTime);
+ this._Popcorn.currentTime(newTime);
};
/** react when a new annotation is added */
IriSP.SparklineWidget.prototype.handleNewAnnotation = function(annotation) {
- var num_columns = this._results.length;
- var duration = this._serializer.getDuration();
- var time_step = Math.round(duration / num_columns); /* the time interval between two columns */
- var begin = +annotation.begin;
- var end = +annotation.end;
-
- /* increment all the values between the beginning and the end of the annotation */
- var index_begin = Math.floor(begin / time_step);
- var index_end = Math.floor(end / time_step);
-
- for (var i = index_begin; i < Math.min(index_end, this._results.length); i++) {
- this._results[i]++;
- }
-
- this.selector.find(".Ldt-sparkLine").sparkline(this._results, {lineColor: "#7492b4", fillColor: "#aeaeb8",
- spotColor: "#b70056",
- width: this.width, height: this.height});
+// var num_columns = this._results.length;
+// var duration = this._serializer.getDuration();
+// var time_step = Math.round(duration / num_columns); /* the time interval between two columns */
+// var begin = +annotation.begin;
+// var end = +annotation.end;
+//
+// /* increment all the values between the beginning and the end of the annotation */
+// var index_begin = Math.floor(begin / time_step);
+// var index_end = Math.floor(end / time_step);
+//
+// for (var i = index_begin; i < Math.min(index_end, this._results.length); i++) {
+// this._results[i]++;
+// }
+//
+// this.selector.find(".Ldt-sparkLine").sparkline(this._results, {lineColor: "#7492b4", fillColor: "#aeaeb8",
+// spotColor: "#b70056",
+// width: this.width, height: this.height});
};IriSP.StackGraphWidget = function(Popcorn, config, Serializer) {
IriSP.Widget.call(this, Popcorn, config, Serializer);
}
@@ -4986,7 +5213,7 @@
return _g.length
}).length,
_scale = this.height / _max,
- _width = this.width / this.sliceCount
+ _width = this.width / this.sliceCount,
_showTitle = !this._config.excludeTitle,
_showDescription = !this._config.excludeDescription;
@@ -5084,14 +5311,19 @@
var _this = this;
this.selector
.click(IriSP.wrap(this, this.clickHandler))
- .mousemove(function(event) {
- _this.updateTooltip(event);
-
- // Also tell the world where the mouse is hovering.
- var relX = event.pageX - _this.selector.offset().left;
- var duration = _this._serializer.getDuration();
- var Time = ((relX / _this.width) * duration).toFixed(2);
- _this._Popcorn.trigger("IriSP.StackGraphWidget.mouseOver", Time);
+ .mousemove(function(_e) {
+ _this.updateTooltip(_e);
+ // Trace
+ var relX = _e.pageX - _this.selector.offset().left;
+ var _duration = _this._serializer.getDuration();
+ var _time = parseInt((relX / _this.width) * _duration);
+ _this._Popcorn.trigger("IriSP.TraceWidget.MouseEvents", {
+ "widget" : "StackGraphWidget",
+ "type": "mousemove",
+ "x": _e.pageX,
+ "y": _e.pageY,
+ "time": _time
+ });
})
.mouseout(function() {
@@ -5124,7 +5356,7 @@
};
IriSP.StackGraphWidget.prototype.updateTooltip = function(event) {
- var _segment = Math.floor(this.sliceCount * (event.pageX - this.selector.offset().left)/this.width),
+ var _segment = Math.max(0,Math.min(this.groups.length - 1, Math.floor(this.sliceCount * (event.pageX - this.selector.offset().left)/this.width))),
_valeurs = this.groups[_segment],
_width = this.width / this.sliceCount,
_html = '
' + IriSP._(this.tagconf).map(function(_tag, _i) {
@@ -5155,9 +5387,9 @@
var _urlRegExp = /https?:\/\/[0-9a-zA-Z\.%\/-_]+/g,
_stopWords = [
- 'aussi', 'and', 'avec', 'aux', 'bien', 'car', 'cette', 'comme', 'dans', 'donc', 'des', 'elle', 'encore', 'est',
+ 'aussi', 'and', 'avec', 'aux', 'bien', 'car', 'cette', 'comme', 'dans', 'donc', 'des', 'elle', 'encore', 'entre', 'est',
'être', 'eux', 'faire', 'fait', 'http', 'ici', 'ils', 'les', 'leur', 'leurs', 'mais', 'mes', 'même', 'mon', 'notre',
- 'non', 'nos', 'nous', 'ont', 'par', 'pas', 'peu', 'peut', 'plus', 'pour', 'que', 'qui', 'ses' ,'son', 'sont', 'sur',
+ 'non', 'nos', 'nous', 'ont', 'par', 'pas', 'peu', 'peut', 'plus', 'pour', 'que', 'qui', 'sans', 'ses' ,'son', 'sont', 'sur',
'tes', 'très', 'the', 'ton', 'tous', 'tout', 'une', 'votre', 'vos', 'vous' ],
_regexpword = /[^\s\.&;,'"!\?\d\(\)\+\[\]\\\…\-«»:\/]{3,}/g,
_words = {},
@@ -5208,7 +5440,7 @@
.shuffle()
.map(function(_word) {
var _size = 10 + _scale * Math.sqrt(_word.count - _min);
- return ''
+ _word.word
@@ -5228,7 +5460,7 @@
var _rgxp = new RegExp("(" + searchString.replace(/(\W)/g,'\\$1') + ")","gi");
this.selector.find("li").each(function(_i, _e) {
_e.innerHTML = searchString.length ?
- _e.textContent.replace(_rgxp,'$1 ')
+ _e.textContent.replace(_rgxp,'$1 ')
: _e.textContent;
});
}));
@@ -5264,6 +5496,10 @@
"position": "relative"
});
this.selector.append(templ);
+ var _this = this;
+ this.selector.mouseover(function() {
+ _this.hide();
+ });
this.hide();
};
@@ -5297,103 +5533,133 @@
IriSP.Widget.call(this, Popcorn, config, Serializer);
this.lastEvent = "";
var _this = this,
- _listeners = [
- "IriSP.ArrowWidget.releaseArrow",
- "IriSP.SliceWidget.hide",
- "IriSP.AnnotationsWidget.show",
- "IriSP.AnnotationsWidget.hide",
- "IriSP.ArrowWidget.blockArrow",
- "IriSP.SliceWidget.position",
- "IriSP.SliceWidget.show",
- "IriSP.SliceWidget.hide",
- "IriSP.createAnnotationWidget.addedAnnotation",
-// "IriSP.PlayerWidget.AnnotateButton.clicked",
-// "IriSP.PlayerWidget.MouseOver",
-// "IriSP.PlayerWidget.MouseOut",
- "IriSP.search.open",
- "IriSP.search.closed",
- "IriSP.search",
- "IriSP.search.cleared",
-// "IriSP.PolemicTweet.click",
- "IriSP.search.matchFound",
- "IriSP.search.noMatchFound",
-// "IriSP.SegmentsWidget.click",
- "IriSP.SliceWidget.zoneChange",
-// "IriSP.SparklineWidget.clicked",
-// "IriSP.StackGraphWidget.mouseOver",
-// "IriSP.StackGraphWidget.clicked",
- "IriSP.search.triggeredSearch",
- "IriSP.Widget.MouseEvents",
- "play",
- "pause",
- "volumechange",
- "timeupdate",
- "seeked",
- "play",
- "pause"
- ];
- IriSP._(_listeners).each(function(_listener) {
- _this._Popcorn.listen(_listener, function() {
- _this.eventHandler(_listener, arguments);
- });
+ _listeners = {
+ "IriSP.createAnnotationWidget.addedAnnotation" : 0,
+ "IriSP.search.open" : 0,
+ "IriSP.search.closed" : 0,
+ "IriSP.search" : 0,
+ "IriSP.search.cleared" : 0,
+ "IriSP.search.matchFound" : 0,
+ "IriSP.search.noMatchFound" : 0,
+ "IriSP.search.triggeredSearch" : 0,
+ "IriSP.TraceWidget.MouseEvents" : 0,
+ "play" : 0,
+ "pause" : 0,
+ "volumechange" : 0,
+ "seeked" : 0,
+ "play" : 0,
+ "pause" : 0,
+ "timeupdate" : 2000
+ };
+ IriSP._(_listeners).each(function(_ms, _listener) {
+ var _f = function(_arg) {
+ _this.eventHandler(_listener, _arg);
+ }
+ if (_ms) {
+ _f = IriSP.underscore.throttle(_f, _ms);
+ }
+ _this._Popcorn.listen(_listener, _f);
});
-
+ this._Popcorn.listen("timeupdate", IriSP.underscore.throttle(function(_arg) {
+ _this.eventHandler(_listener, _arg);
+ }));
+
+ this.tracer = IriSP.TraceManager(IriSP.jQuery).init_trace("test", this._config);
+ this.tracer.set_default_subject("default_subject");
+ this.tracer.trace("StartTracing", { "hello": "world" });
+
}
IriSP.TraceWidget.prototype = new IriSP.Widget();
IriSP.TraceWidget.prototype.draw = function() {
+ this.mouseLocation = '';
+ var _this = this;
+ IriSP.jQuery(".Ldt-Widget").bind("click mouseover mouseout dragstart dragstop", function(_e) {
+ var _widget = IriSP.jQuery(this).attr("widget-type"),
+ _class = _e.target.className;
+ var _data = {
+ "type": _e.type,
+ "x": _e.clientX,
+ "y": _e.clientY,
+ "widget": _widget
+ }
+ if (typeof _class == "string" && _class.indexOf('Ldt-TraceMe') != -1) {
+ var _name = _e.target.localName,
+ _id = _e.target.id,
+ _text = _e.target.textContent.trim(),
+ _title = _e.target.title,
+ _value = _e.target.value;
+ _data.target = _name + (_id.length ? '#' + IriSP.jqEscape(_id) : '') + (_class.length ? ('.' + IriSP.jqEscape(_class).replace(/\s/g,'.')).replace(/\.Ldt-(Widget|TraceMe)/g,'') : '');
+ if (typeof _title == "string" && _title.length && _title.length < 140) {
+ _data.title = _title;
+ }
+ if (typeof _text == "string" && _text.length && _text.length < 140) {
+ _data.text = _text;
+ }
+ if (typeof _value == "string" && _value.length) {
+ _data.value = _value;
+ }
+ _this._Popcorn.trigger('IriSP.TraceWidget.MouseEvents', _data);
+ } else {
+ //console.log(_e.type+','+_this.mouseLocation+','+_widget);
+ if (_e.type == "mouseover") {
+ if (_this.mouseLocation != _widget) {
+ _this._Popcorn.trigger('IriSP.TraceWidget.MouseEvents', _data);
+ } else {
+ if (typeof _this.moTimeout != "undefined") {
+ clearTimeout(_this.moTimeout);
+ delete _this.moTimeout;
+ }
+ }
+ }
+ if (_e.type == "click") {
+ _this._Popcorn.trigger('IriSP.TraceWidget.MouseEvents', _data);
+ }
+ if (_e.type == "mouseout") {
+ if (typeof _this.moTimeout != "undefined") {
+ clearTimeout(_this.moTimeout);
+ }
+ _this.moTimeout = setTimeout(function() {
+ if (_data.widget != _this.mouseLocation) {
+ _this._Popcorn.trigger('IriSP.TraceWidget.MouseEvents', _data);
+ }
+ },100);
+ }
+ }
+ _this.mouseLocation = _widget;
+ });
}
-IriSP.TraceWidget.prototype.eventHandler = function(_listener, _args) {
- var _traceName = 'Mdp_',
- _data = {};
-
- function packArgs() {
- for (var _i = 0; _i < _args.length; _i++) {
- _data[_i] = _args[_i];
- }
+IriSP.TraceWidget.prototype.eventHandler = function(_listener, _arg) {
+ var _traceName = 'Mdp_';
+ if (typeof _arg == "string" || typeof _arg == "number") {
+ _arg = { "value" : _arg }
}
-
+ if (typeof _arg == "undefined") {
+ _arg = {}
+ }
switch(_listener) {
- case 'IriSP.Widget.MouseEvents':
- var _type = _args[0].type,
- _name = _args[0].target_name,
- _class = _args[0].target_class,
- _id = _args[0].target_id,
- _widget = _args[0].widget.match(/[^_]+widget/i)[0];
- _traceName += _widget + '_' + _type;
- _data.x = _args[0].x;
- _data.y = _args[0].y;
- _data.target = _name + (_id.length ? '#' + _id : '') + (_class.length ? '.' + _class.replace(/\s/g,'.') : '');
- if (typeof _args[0].value == "string" && _args[0].value.length) {
- _data.value = _args[0].value;
- }
- if ((_name == "button" || /button/.test(_class)) && typeof _args[0].text == "string" && _args[0].text.length) {
- _data.text = _args[0].text;
- }
- if (typeof _args[0].title == "string" && _args[0].title.length) {
- _data.title = _args[0].title;
- }
- // Filtrer les événements mouseover quand on se déplace vers des éléments non pertinents
- if (!_id.length && !_class.length && ( _type == 'mouseover' || _type == 'mouseout' ) && this.lastEvent.search('Mdp_' + _widget) == 0) {
- return;
- }
+ case 'IriSP.TraceWidget.MouseEvents':
+ _traceName += _arg.widget + '_' + _arg.type;
+ delete _arg.widget;
+ delete _arg.type;
break;
+ case 'timeupdate':
case 'play':
case 'pause':
+ _arg.time = this._Popcorn.currentTime() * 1000;
case 'seeked':
- case 'timeupdate':
case 'volumechange':
- _traceName += 'Popcorn' + _listener;
- packArgs();
+ _traceName += 'Popcorn_' + _listener;
break;
default:
_traceName += _listener.replace('IriSP.','').replace('.','_');
- packArgs();
}
this.lastEvent = _traceName;
- console.log("trace('" + _traceName + "', " + JSON.stringify(_data) + ");");
+ this.tracer.trace(_traceName, _arg);
+ console.log("trace('" + _traceName + "', " + JSON.stringify(_arg) + ");");
+
}
/* a widget that displays tweet - used in conjunction with the polemicWidget */
{{/user_avatar}} {{#user_avatar}}