update widgets after enhance in annotation platform.
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/src/widgets/AdaptivePlayer.js Thu Jan 02 16:40:25 2014 +0100
@@ -0,0 +1,33 @@
+IriSP.Widgets.AdaptivePlayer = function(player, config) {
+ IriSP.Widgets.Widget.call(this, player, config);
+};
+
+IriSP.Widgets.AdaptivePlayer.prototype = new IriSP.Widgets.Widget();
+
+IriSP.Widgets.AdaptivePlayer.prototype.defaults = {
+ mime_type: "video/mp4",
+ normal_player: "HtmlPlayer",
+ fallback_player: "JwpPlayer"
+};
+
+IriSP.Widgets.AdaptivePlayer.prototype.draw = function() {
+
+ if (typeof this.video === "undefined") {
+ this.video = this.media.video;
+ }
+
+ var _props = [ "autostart", "video", "height", "width", "url_transform" ],
+ _opts = {},
+ _canPlayType = document.createElement('video').canPlayType(this.mime_type);
+
+ _opts.type = (_canPlayType == "maybe" || _canPlayType == "probably") ? this.normal_player : this.fallback_player;
+
+ for (var i = 0; i < _props.length; i++) {
+ if (typeof this[_props[i]] !== "undefined") {
+ _opts[_props[i]] = this[_props[i]];
+ }
+ }
+
+ this.insertSubwidget(this.$, _opts);
+
+};
\ No newline at end of file
--- a/src/widgets/Annotation.css Thu Aug 30 14:45:23 2012 +0200
+++ b/src/widgets/Annotation.css Thu Jan 02 16:40:25 2014 +0100
@@ -23,6 +23,11 @@
font-weight: bold;
}
+.Ldt-Annotation-Description {
+ max-height: 150px;
+ overflow: auto;
+}
+
.Ldt-Annotation-Cleared {
clear: both;
}
@@ -54,6 +59,11 @@
.Ldt-Annotation-Title, .Ldt-Annotation-MashupMedia {
color: #0068c4;
+ text-decoration: none;
+}
+
+.Ldt-Annotation-Type {
+ color: #8080A0;
}
.Ldt-Annotation-Time {
@@ -62,6 +72,7 @@
.Ldt-Annotation-Inner p {
font-size: 12px;
+ line-height: 16px;
}
.Ldt-Annotation-Label {
--- a/src/widgets/Annotation.js Thu Aug 30 14:45:23 2012 +0200
+++ b/src/widgets/Annotation.js Thu Jan 02 16:40:25 2014 +0100
@@ -13,29 +13,36 @@
fr: {
watching: "Je regarde ",
on_site: " sur ",
- tags_: "Mots-clés :",
- description_: "Description :",
- excerpt_from: "Extrait de :"
+ tags_: "Mots-clés\u00a0:",
+ description_: "Description\u00a0:",
+ creator_: "Créé par\u00a0:",
+ excerpt_from: "Extrait de\u00a0:",
+ untitled: "Segment sans titre"
},
en: {
watching: "I'm watching ",
on_site: " on ",
tags_: "Keywords:",
description_: "Description:",
- excerpt_from: "Excerpt from:"
+ creator_: "Created by\u00a0:",
+ excerpt_from: "Excerpt from:",
+ untitled: "Untitled segment"
}
-}
+};
IriSP.Widgets.Annotation.prototype.template =
- '<div class="Ldt-Annotation-Widget {{#show_top_border}}Ldt-Annotation-ShowTop{{/show_top_border}}">'
+ '{{#show_arrow}}<div class="Ldt-Annotation-Arrow"></div>{{/show_arrow}}'
+ + '<div class="Ldt-Annotation-Widget {{^show_arrow}}Ldt-Annotation-ShowTop{{/show_arrow}}">'
+ '<div class="Ldt-Annotation-Inner Ldt-Annotation-Empty{{#start_minimized}} Ldt-Annotation-Minimized{{/start_minimized}}">'
+ '<div class="Ldt-Annotation-HiddenWhenEmpty Ldt-Annotation-MaxMinButton"></div>'
- + '<div class="Ldt-Annotation-Social Ldt-Annotation-HiddenWhenMinimized Ldt-Annotation-HiddenWhenEmpty"></div>'
- + '<h3 class="Ldt-Annotation-HiddenWhenEmpty"><span class="Ldt-Annotation-Title"></span> <span class="Ldt-Annotation-Time">'
- + '( <span class="Ldt-Annotation-Begin"></span> - <span class="Ldt-Annotation-End"></span> )</span></h3>'
- + '<h3 class="Ldt-Annotation-MashupOrigin Ldt-Annotation-HiddenWhenEmpty">{{l10n.excerpt_from}} <span class="Ldt-Annotation-MashupMedia"></span> <span class="Ldt-Annotation-Time">'
- + '( <span class="Ldt-Annotation-MashupBegin"></span> - <span class="Ldt-Annotation-MashupEnd"></span> )</span></h3>'
- + '<div class="Ldt-Annotation-Cleared Ldt-Annotation-HiddenWhenMinimized Ldt-Annotation-HiddenWhenEmpty Ldt-Annotation-Description-Block"><div class="Ldt-Annotation-Label">{{l10n.description_}}</div>'
+ + '{{#show_social}}<div class="Ldt-Annotation-Social Ldt-Annotation-HiddenWhenMinimized Ldt-Annotation-HiddenWhenEmpty"></div>{{/show_social}}'
+ + '<h3 class="Ldt-Annotation-HiddenWhenEmpty">{{#show_annotation_type}}<span class="Ldt-Annotation-Type"></span> » {{/show_annotation_type}}<a class="Ldt-Annotation-Title" href="#"></a> <span class="Ldt-Annotation-Time Ldt-Annotation-HiddenWhenMinimized">'
+ + '(<span class="Ldt-Annotation-Begin"></span> - <span class="Ldt-Annotation-End"></span>)</span></h3>'
+ + '<h3 class="Ldt-Annotation-MashupOrigin Ldt-Annotation-HiddenWhenEmpty">{{l10n.excerpt_from}} <span class="Ldt-Annotation-MashupMedia"></span> <span class="Ldt-Annotation-Time Ldt-Annotation-HiddenWhenMinimized">'
+ + '(<span class="Ldt-Annotation-MashupBegin"></span> - <span class="Ldt-Annotation-MashupEnd"></span>)</span></h3>'
+ + '<div class="Ldt-Annotation-Cleared Ldt-Annotation-HiddenWhenMinimized Ldt-Annotation-HiddenWhenEmpty Ldt-Annotation-Creator-Block"><div class="Ldt-Annotation-Label">{{l10n.creator_}}</div>'
+ + '{{#show_creator}}<p class="Ldt-Annotation-Labelled Ldt-Annotation-Creator"></p></div>'
+ + '<div class="Ldt-Annotation-Cleared Ldt-Annotation-HiddenWhenMinimized Ldt-Annotation-HiddenWhenEmpty Ldt-Annotation-Description-Block"><div class="Ldt-Annotation-Label">{{l10n.description_}}</div>{{/show_creator}}'
+ '<p class="Ldt-Annotation-Labelled Ldt-Annotation-Description"></p></div>'
+ '<div class="Ldt-Annotation-Tags-Block Ldt-Annotation-HiddenWhenMinimized Ldt-Annotation-HiddenWhenEmpty Ldt-Annotation-Cleared">'
+ '<div class="Ldt-Annotation-Label">{{l10n.tags_}}</div><ul class="Ldt-Annotation-Labelled Ldt-Annotation-Tags"></ul>'
@@ -43,113 +50,169 @@
IriSP.Widgets.Annotation.prototype.defaults = {
annotation_type : "chap",
- start_minimized: true,
- show_top_border : false,
- site_name : "Lignes de Temps"
-}
+ start_minimized: false,
+ show_arrow : true,
+ show_creator: true,
+ arrow_position: .5,
+ site_name : "Lignes de Temps",
+ search_on_tag_click: true,
+ show_social: true,
+ show_annotation_type: false
+};
IriSP.Widgets.Annotation.prototype.draw = function() {
+
+ var _this = this,
+ currentAnnotation;
+
+ function timeupdate(_time) {
+ var _list = _this.getWidgetAnnotationsAtTime();
+ if (!_list.length) {
+ _this.$.find(".Ldt-Annotation-Inner").addClass("Ldt-Annotation-Empty");
+ if (_this.arrow) {
+ _this.arrow.moveToTime(_time);
+ }
+ _this.bounds = [ _time, _time ];
+ _this.sendBounds();
+ }
+ }
+
+ function highlightTitleAndDescription() {
+ if (!currentAnnotation) {
+ return;
+ }
+ var title = currentAnnotation.title,
+ description = currentAnnotation.description.replace(/(^\s+|\s+$)/g,''),
+ rx = (currentAnnotation.found ? (_this.source.getAnnotations().regexp || false) : false);
+ _this.$.find(".Ldt-Annotation-Title").html(IriSP.textFieldHtml(title,rx) || "(" + _this.l10n.untitled + ")");
+ if (description) {
+ _this.$.find(".Ldt-Annotation-Description-Block").removeClass("Ldt-Annotation-EmptyBlock");
+ _this.$.find(".Ldt-Annotation-Description").html(IriSP.textFieldHtml(description,rx));
+ } else {
+ _this.$.find(".Ldt-Annotation-Description-Block").addClass("Ldt-Annotation-EmptyBlock");
+ }
+ }
+
+ function drawAnnotation(_annotation) {
+ currentAnnotation = _annotation;
+ var _url = (typeof _annotation.url !== "undefined"
+ ? _annotation.url
+ : (document.location.href.replace(/#.*$/,'') + '#id=' + _annotation.id)),
+ _text = _this.l10n.watching + _annotation.title + (_this.site_name ? _this.l10n.on_site + _this.site_name : ''),
+ _tags = _annotation.getTags(),
+ _tagblock = _this.$.find(".Ldt-Annotation-Tags");
+ _tagblock.empty();
+ if (_tags.length) {
+ _this.$.find(".Ldt-Annotation-Tags-Block").removeClass("Ldt-Annotation-EmptyBlock");
+ _tags.forEach(function(_tag) {
+ var _trimmedTitle = _tag.title.replace(/(^\s+|\s+$)/g,'');
+ if (_trimmedTitle) {
+ var _el = IriSP.jQuery('<li class="Ldt-Annotation-TagLabel"></li>').append(IriSP.jQuery('<span>').text(_trimmedTitle));
+ _el.click(function() {
+ if (_this.search_on_tag_click) {
+ _this.source.getAnnotations().search(_trimmedTitle);
+ }
+ _tag.trigger("click");
+ });
+ _tagblock.append(_el);
+ }
+ });
+ } else {
+ _this.$.find(".Ldt-Annotation-Tags-Block").addClass("Ldt-Annotation-EmptyBlock");
+ }
+ highlightTitleAndDescription();
+ if (_this.show_creator) {
+ _this.$.find(".Ldt-Annotation-Creator").text(_annotation.creator);
+ }
+ if (_this.show_annotation_type) {
+ _this.$.find(".Ldt-Annotation-Type").text(_annotation.getAnnotationType().title);
+ }
+ _this.$.find(".Ldt-Annotation-Begin").text(_annotation.begin.toString());
+ _this.$.find(".Ldt-Annotation-End").text(_annotation.end.toString());
+ if (_annotation.elementType === "mashedAnnotation") {
+ _this.$.find('.Ldt-Annotation-Inner').addClass("Ldt-Annotation-isMashup");
+ _this.$.find(".Ldt-Annotation-MashupMedia").text(_annotation.getMedia().title);
+ _this.$.find(".Ldt-Annotation-MashupBegin").text(_annotation.annotation.begin.toString());
+ _this.$.find(".Ldt-Annotation-MashupEnd").text(_annotation.annotation.end.toString());
+ } else {
+ _this.$.find('.Ldt-Annotation-Inner').removeClass("Ldt-Annotation-isMashup");
+ }
+ if (typeof _this.socialWidget !== "undefined") {
+ _this.socialWidget.updateUrls(_url, _text);
+ } else {
+ setTimeout(function() {
+ if (typeof _this.socialWidget !== "undefined") {
+ _this.socialWidget.updateUrls(_url, _text);
+ }
+ },800);
+ }
+ _this.$.find(".Ldt-Annotation-Inner").removeClass("Ldt-Annotation-Empty");
+ _this.bounds = [ _annotation.begin, _annotation.end ];
+ if (_this.arrow) {
+ _this.arrow.moveToTime((1 - _this.arrow_position) * _annotation.begin + _this.arrow_position * _annotation.end);
+ }
+ _this.sendBounds();
+ }
+
this.renderTemplate();
- this.insertSubwidget(this.$.find(".Ldt-Annotation-Social"), "socialWidget", { type: "Social" });
- this.bindPopcorn("timeupdate","onTimeupdate");
- this.bindPopcorn("IriSP.Annotation.hide","hide");
- this.bindPopcorn("IriSP.Annotation.show","show");
- this.bindPopcorn("IriSP.Annotation.minimize","minimize");
- this.bindPopcorn("IriSP.Annotation.maximize","maximize");
- this.bindPopcorn("IriSP.Annotation.getBounds","sendBounds");
+
+ this.$.find(".Ldt-Annotation-Title").click(function() {
+ if (currentAnnotation) {
+ _this.media.setCurrentTime(currentAnnotation.begin);
+ }
+ return false;
+ });
+
+ if (this.show_social) {
+ this.insertSubwidget(this.$.find(".Ldt-Annotation-Social"), { type: "Social" }, "socialWidget");
+ }
+
+ if (this.show_arrow) {
+ this.insertSubwidget(this.$.find(".Ldt-Annotation-Arrow"), { type: "Arrow", width: this.width }, "arrow");
+ }
+ this.onMediaEvent("timeupdate",timeupdate);
+ this.onMdpEvent("Annotation.hide","hide");
+ this.onMdpEvent("Annotation.show","show");
+ this.onMdpEvent("Annotation.minimize","minimize");
+ this.onMdpEvent("Annotation.maximize","maximize");
+ this.onMdpEvent("Annotation.getBounds","sendBounds");
this.$.find(".Ldt-Annotation-MaxMinButton").click(this.functionWrapper("toggleSize"));
- this.onTimeupdate();
-}
-
-IriSP.Widgets.Annotation.prototype.onTimeupdate = function() {
- var _time = Math.floor(this.player.popcorn.currentTime() * 1000),
- _list = this.getWidgetAnnotationsAtTime();
- if (_list.length) {
- if (_list[0].id !== this.lastAnnotation) {
- this.drawAnnotation(_list[0]);
- this.bounds = [ _list[0].begin.valueOf(), _list[0].end.valueOf() ];
- }
- this.player.popcorn.trigger("IriSP.Arrow.updatePosition",{widget: this.type, time: ( _list[0].begin + _list[0].end ) / 2});
- }
- else {
- this.lastAnnotation = false;
- this.$.find(".Ldt-Annotation-Inner").addClass("Ldt-Annotation-Empty");
- this.player.popcorn.trigger("IriSP.Arrow.updatePosition",{widget: this.type, time: _time});
- this.bounds = [ _time, _time ];
- }
- this.sendBounds();
-}
+ this.getWidgetAnnotations().forEach(function(_a) {
+ _a.on("enter", function() {
+ drawAnnotation(_a);
+ });
+ });
+ this.source.getAnnotations().on("found", highlightTitleAndDescription);
+ this.source.getAnnotations().on("not-found", highlightTitleAndDescription);
+ this.source.getAnnotations().on("search-cleared", highlightTitleAndDescription);
+ IriSP.attachDndData(this.$.find("h3"), function() {
+ return {
+ title: currentAnnotation.title,
+ description: currentAnnotation.description,
+ image: currentAnnotation.thumbnail,
+ uri: (typeof currentAnnotation.url !== "undefined"
+ ? currentAnnotation.url
+ : (document.location.href.replace(/#.*$/,'') + '#id=' + currentAnnotation.id))
+ };
+ });
+};
IriSP.Widgets.Annotation.prototype.sendBounds = function() {
- this.player.popcorn.trigger("IriSP.Annotation.boundsChanged",this.bounds);
-}
+ this.player.trigger("Annotation.boundsChanged",this.bounds);
+};
IriSP.Widgets.Annotation.prototype.drawAnnotation = function(_annotation) {
this.lastAnnotation = _annotation.id;
- var _url = (typeof _annotation.url !== "undefined"
- ? _annotation.url
- : (document.location.href.replace(/#.*$/,'') + '#id=' + _annotation.id));
- var _text = this.l10n.watching + _annotation.title + (this.site_name ? this.l10n.on_site + this.site_name : '');
- var _tags = _annotation.getTagTexts();
- if (_tags.length) {
- var _html = IriSP._(_tags).map(function(_tag) {
- return '<li class="Ldt-Annotation-TagLabel"><span>' + _tag + '</span></li>';
- }).join("");
- this.$.find(".Ldt-Annotation-Tags").html(_html);
- this.$.find(".Ldt-Annotation-Tags-Block").removeClass("Ldt-Annotation-EmptyBlock");
-
- /* Correct the empty tag bug */
- this.$.find('.Ldt-Annotation-TagLabel').each(function() {
- var _el = IriSP.jQuery(this);
- if (!_el.text().replace(/(^\s+|\s+$)/g,'')) {
- _el.detach();
- }
- });
-
- this.$.find('.Ldt-Annotation-TagLabel').click(function() {
- _this.player.popcorn.trigger("IriSP.search.triggeredSearch", IriSP.jQuery(this).text().replace(/(^\s+|\s+$)/g,''));
- });
- } else {
- this.$.find(".Ldt-Annotation-Tags-Block").addClass("Ldt-Annotation-EmptyBlock");
- }
- this.$.find(".Ldt-Annotation-Title").html(_annotation.title);
- var _desc = _annotation.description.replace(/(^\s+|\s+$)/g,'');
- if (_desc) {
- this.$.find(".Ldt-Annotation-Description-Block").removeClass("Ldt-Annotation-EmptyBlock");
- this.$.find(".Ldt-Annotation-Description").html(_desc);
- } else {
- this.$.find(".Ldt-Annotation-Description-Block").addClass("Ldt-Annotation-EmptyBlock");
- }
- this.$.find(".Ldt-Annotation-Begin").html(_annotation.begin.toString());
- this.$.find(".Ldt-Annotation-End").html(_annotation.end.toString());
- if (_annotation.elementType === "mashedAnnotation") {
- this.$.find('.Ldt-Annotation-Inner').addClass("Ldt-Annotation-isMashup");
- this.$.find(".Ldt-Annotation-MashupMedia").html(_annotation.getMedia().title);
- this.$.find(".Ldt-Annotation-MashupBegin").html(_annotation.annotation.begin.toString());
- this.$.find(".Ldt-Annotation-MashupEnd").html(_annotation.annotation.end.toString());
- } else {
- this.$.find('.Ldt-Annotation-Inner').removeClass("Ldt-Annotation-isMashup");
- }
- if (typeof this.socialWidget !== "undefined") {
- this.socialWidget.updateUrls(_url, _text);
- } else {
- var _this = this;
- setTimeout(function() {
- if (typeof _this.socialWidget !== "undefined") {
- _this.socialWidget.updateUrls(_url, _text);
- }
- },800);
- }
- this.$.find(".Ldt-Annotation-Inner").removeClass("Ldt-Annotation-Empty");
-}
+
+};
IriSP.Widgets.Annotation.prototype.hide = function() {
this.$.slideUp();
-}
+};
IriSP.Widgets.Annotation.prototype.show = function() {
this.$.slideDown();
-}
+};
IriSP.Widgets.Annotation.prototype.toggleSize = function() {
if (this.minimized) {
@@ -157,14 +220,14 @@
} else {
this.minimize();
}
-}
+};
IriSP.Widgets.Annotation.prototype.minimize = function() {
this.minimized = true;
this.$.find('.Ldt-Annotation-Inner').addClass("Ldt-Annotation-Minimized");
-}
+};
IriSP.Widgets.Annotation.prototype.maximize = function() {
this.minimized = false;
this.$.find('.Ldt-Annotation-Inner').removeClass("Ldt-Annotation-Minimized");
-}
\ No newline at end of file
+};
\ No newline at end of file
--- a/src/widgets/AnnotationsList.css Thu Aug 30 14:45:23 2012 +0200
+++ b/src/widgets/AnnotationsList.css Thu Jan 02 16:40:25 2014 +0100
@@ -8,6 +8,11 @@
.Ldt-AnnotationsListWidget a {
text-decoration: none;
}
+
+.Ldt-AnnotationsList-Audio {
+ width: 1px; height: 1px;
+}
+
ul.Ldt-AnnotationsList-ul {
list-style: none;
padding: 2px;
@@ -23,10 +28,6 @@
.Ldt-AnnotationsList-li.selected {
background-image: url(img/pinstripe-grey.png);
}
-.Ldt-AnnotationsList-highlight {
- background: #F7268E;
- color: #ffffff;
-}
.Ldt-AnnotationsList-ThumbContainer {
float: left;
width: 80px;
@@ -53,14 +54,25 @@
margin: 2px 2px 0 82px;
font-weight: bold;
}
-h3.Ldt-AnnotationsList-Title a {
+
+.Ldt-AnnotationsList-Title a {
color: #0068c4;
}
+
p.Ldt-AnnotationsList-Description {
margin: 2px 0 2px 82px;
font-size: 12px;
color: #333333;
}
+
+.Ldt-AnnotationsList-Description a {
+ color: #0068c4;
+}
+
+.Ldt-AnnotationsList-Description a:hover {
+ text-decoration: underline; color: #800000;
+}
+
ul.Ldt-AnnotationsList-Tags {
list-style: none;
padding: 0;
@@ -84,4 +96,14 @@
.Ldt-AnnotationsList-Tag-Li:hover span {
background-position: right -23px;
+}
+
+.Ldt-AnnotationsList-Play {
+ width: 125px; height: 20px; margin: 2px 0 2px 82px; text-align: center;
+ padding: 3px 5px 0 20px; font-size: 12px; cursor: pointer;
+ background: url(img/voiceannotation.png); color: #333333;
+}
+
+.Ldt-AnnotationsList-Play:hover {
+ background-position: 0 bottom;
}
\ No newline at end of file
--- a/src/widgets/AnnotationsList.js Thu Aug 30 14:45:23 2012 +0200
+++ b/src/widgets/AnnotationsList.js Thu Jan 02 16:40:25 2014 +0100
@@ -1,12 +1,12 @@
IriSP.Widgets.AnnotationsList = function(player, config) {
IriSP.Widgets.Widget.call(this, player, config);
- this.searchString = false;
this.lastIds = [];
var _this = this;
this.throttledRefresh = IriSP._.throttle(function() {
_this.refresh(false);
- }, 1500);
- this.mashupMode = (this.source.currentMedia.elementType === "mashup");
+ }, 800);
+ this.searchString = false;
+ this.lastSearch = false;
};
IriSP.Widgets.AnnotationsList.prototype = new IriSP.Widgets.Widget();
@@ -18,7 +18,7 @@
ajax_url : false,
/* number of milliseconds before/after the current timecode when calling the segment API
*/
- ajax_granularity : 300000,
+ ajax_granularity : 600000,
default_thumbnail : "",
/* URL when the annotation is not in the current project,
* e.g. http://ldt.iri.centrepompidou.fr/ldtplatform/ldt/front/player/{{media}}/{{project}}/{{annotationType}}#id={{annotation}}
@@ -26,8 +26,9 @@
foreign_url : "",
annotation_type : false,
refresh_interval : 0,
- limit_count : 10,
+ limit_count : 20,
newest_first : false,
+ show_audio: true,
polemics : [{
keyword: "++",
background_color: "#c9ecc6"
@@ -43,8 +44,20 @@
}]
};
+IriSP.Widgets.AnnotationsList.prototype.messages = {
+ en: {
+ voice_annotation: "Voice Annotation",
+ now_playing: "Now playing..."
+ },
+ fr: {
+ voice_annotation: "Annotation Vocale",
+ now_playing: "Lecture en cours..."
+ }
+};
+
IriSP.Widgets.AnnotationsList.prototype.template =
'<div class="Ldt-AnnotationsListWidget">'
+ + '{{#show_audio}}<div class="Ldt-AnnotationsList-Audio"></div>{{/show_audio}}'
+ '<ul class="Ldt-AnnotationsList-ul">'
+ '</ul>'
+ '</div>';
@@ -52,15 +65,15 @@
IriSP.Widgets.AnnotationsList.prototype.annotationTemplate =
'<li class="Ldt-AnnotationsList-li Ldt-TraceMe" trace-info="annotation-id:{{id}}, media-id:{{media_id}}" style="{{specific_style}}">'
+ '<div class="Ldt-AnnotationsList-ThumbContainer">'
- + '<a href="{{url}}">'
+ + '<a href="{{url}}" draggable="true">'
+ '<img class="Ldt-AnnotationsList-Thumbnail" src="{{thumbnail}}" />'
+ '</a>'
+ '</div>'
+ '<div class="Ldt-AnnotationsList-Duration">{{begin}} - {{end}}</div>'
- + '<h3 class="Ldt-AnnotationsList-Title">'
- + '<a href="{{url}}">{{title}}</a>'
+ + '<h3 class="Ldt-AnnotationsList-Title" draggable="true">'
+ + '<a href="{{url}}">{{{htitle}}}</a>'
+ '</h3>'
- + '<p class="Ldt-AnnotationsList-Description">{{description}}</p>'
+ + '<p class="Ldt-AnnotationsList-Description">{{{hdescription}}}</p>'
+ '{{#tags.length}}'
+ '<ul class="Ldt-AnnotationsList-Tags">'
+ '{{#tags}}'
@@ -72,30 +85,15 @@
+ '{{/tags}}'
+ '</ul>'
+ '{{/tags.length}}'
+ + '{{#audio}}<div class="Ldt-AnnotationsList-Play" data-annotation-id="{{id}}">{{l10n.voice_annotation}}</div>{{/audio}}'
+ '</li>';
-IriSP.Widgets.AnnotationsList.prototype.onSearch = function(searchString) {
- this.searchString = typeof searchString !== "undefined" ? searchString : '';
- var _n = this.refresh(true);
- if (this.searchString) {
- if (_n) {
- this.player.popcorn.trigger("IriSP.search.matchFound");
- } else {
- this.player.popcorn.trigger("IriSP.search.noMatchFound");
- }
- }
-}
-
//obj.url = this.project_url + "/" + media + "/" + annotations[i].meta.project + "/" + annotations[i].meta["id-ref"] + '#id=' + annotations[i].id;
IriSP.Widgets.AnnotationsList.prototype.ajaxSource = function() {
- var _currentTime = this.player.popcorn.currentTime(),
- _duration = this.source.getDuration();
- if (typeof _currentTime == "undefined") {
- _currentTime = 0;
- }
+ var _currentTime = this.media.getCurrentTime(),
+ _duration = this.media.duration;
this.lastAjaxQuery = _currentTime;
- _currentTime = Math.floor(1000 * _currentTime);
var _url = Mustache.to_html(this.ajax_url, {
media : this.source.currentMedia.id,
begin : Math.max(0, _currentTime - this.ajax_granularity),
@@ -104,14 +102,11 @@
this.currentSource = this.player.loadMetadata(IriSP._.defaults({
"url" : _url
}, this.metadata));
-}
+};
IriSP.Widgets.AnnotationsList.prototype.ajaxMashup = function() {
- var _currentTime = this.player.popcorn.currentTime();
- if (typeof _currentTime == "undefined") {
- _currentTime = 0;
- }
- var _currentAnnotation = this.source.currentMedia.getAnnotationAtTime(_currentTime * 1000);
+ var _currentTime = this.media.getCurrentTime();
+ var _currentAnnotation = this.source.currentMedia.getAnnotationAtTime(_currentTime);
if (typeof _currentAnnotation !== "undefined" && _currentAnnotation.id !== this.lastMashupAnnotation) {
this.lastMashupAnnotation = _currentAnnotation.id;
var _currentMedia = _currentAnnotation.getMedia(),
@@ -124,7 +119,7 @@
"url" : _url
}, this.metadata));
}
-}
+};
IriSP.Widgets.AnnotationsList.prototype.refresh = function(_forceRedraw) {
_forceRedraw = (typeof _forceRedraw !== "undefined" && _forceRedraw);
@@ -132,28 +127,26 @@
return 0;
}
var _this = this,
- _currentTime = this.player.popcorn.currentTime();
- if (typeof _currentTime == "undefined") {
- _currentTime = 0;
- }
+ _currentTime = this.media.getCurrentTime();
var _list = this.annotation_type ? this.currentSource.getAnnotationsByTypeTitle(this.annotation_type) : this.currentSource.getAnnotations();
if (this.mashupMode) {
- var _currentAnnotation = this.source.currentMedia.getAnnotationAtTime(_currentTime * 1000);
+ var _currentAnnotation = this.source.currentMedia.getAnnotationAtTime(_currentTime);
if (typeof _currentAnnotation !== "undefined") {
- _currentTime = _currentTime - _currentAnnotation.begin.getSeconds() + _currentAnnotation.annotation.begin.getSeconds();
+ _currentTime = _currentTime - _currentAnnotation.begin + _currentAnnotation.annotation.begin;
var _mediaId = _currentAnnotation.getMedia().id;
_list = _list.filter(function(_annotation) {
return _annotation.getMedia().id === _mediaId;
});
}
}
- if (this.searchString) {
- _list = _list.searchByTextFields(this.searchString);
- }
+ _list = _list.filter(function(_annotation) {
+ return _annotation.found !== false;
+ });
if (this.limit_count) {
+ /* Get the n annotations closest to current timecode */
_list = _list.sortBy(function(_annotation) {
- return Math.abs(_annotation.begin.getSeconds() - _currentTime);
- }).slice(0, this.limit_count)
+ return Math.abs((_annotation.begin + _annotation.end) / 2 - _currentTime);
+ }).slice(0, this.limit_count);
}
if (this.newest_first) {
_list = _list.sortBy(function(_annotation) {
@@ -167,8 +160,9 @@
var _ids = _list.idIndex;
- if (_forceRedraw || !IriSP._.isEqual(_ids, this.lastIds)) {
+ if (_forceRedraw || !IriSP._.isEqual(_ids, this.lastIds) || this.searchString !== this.lastSearch) {
/* This part only gets executed if the list needs updating */
+ this.lastSearch = this.searchString;
this.lastIds = _ids;
this.list_$.html("");
_list.forEach(function(_annotation) {
@@ -186,17 +180,22 @@
annotationType : _annotation.annotationType.id
}
)
- : '#id=' + _annotation.id
+ : document.location.href.replace(/#.*$/,'') + '#id=' + _annotation.id
)
);
- var _title = (_annotation.title || "").replace(_annotation.description,''),
- _description = _annotation.description;
- if (!_annotation.title) {
- _title = _annotation.creator;
+ var _title = "",
+ _description = _annotation.description,
+ _thumbnail = (typeof _annotation.thumbnail !== "undefined" && _annotation.thumbnail ? _annotation.thumbnail : _this.default_thumbnail);
+ // Update : display creator
+ if (_annotation.creator) {
+ _title = _annotation.creator;
}
- if (!_annotation.description && _annotation.creator) {
- _description = _annotation.title;
- _title = _annotation.creator;
+ if (_annotation.title) {
+ var tempTitle = _annotation.title;
+ if( tempTitle.substr(0, _title.length + 1) == (_title + ":") ){
+ _title = "";
+ }
+ _title = _title + ( (_title=="") ? "" : ": ") + _annotation.title;
}
var _bgcolor;
IriSP._(_this.polemics).each(function(_polemic) {
@@ -208,17 +207,54 @@
var _data = {
id : _annotation.id,
media_id : _annotation.getMedia().id,
- title : _title,
- description : _description,
+ htitle : IriSP.textFieldHtml(_title),
+ hdescription : IriSP.textFieldHtml(_description),
begin : _annotation.begin.toString(),
end : _annotation.end.toString(),
- thumbnail : typeof _annotation.thumbnail !== "undefined" && _annotation.thumbnail ? _annotation.thumbnail : _this.default_thumbnail,
+ thumbnail : _thumbnail,
url : _url,
tags : _annotation.getTagTexts(),
- specific_style : (typeof _bgcolor !== "undefined" ? "background-color: " + _bgcolor : "")
+ specific_style : (typeof _bgcolor !== "undefined" ? "background-color: " + _bgcolor : ""),
+ l10n: _this.l10n
};
- var _html = Mustache.to_html(_this.annotationTemplate, _data);
- var _el = IriSP.jQuery(_html);
+ if (_this.show_audio && _annotation.audio && _annotation.audio.href && _annotation.audio.href != "null") {
+ _data.audio = true;
+ if (!_this.jwplayers[_annotation.id]) {
+ var _audiofile = _annotation.audio.href;
+ if (_this.audio_url_transform) {
+ _audiofile = _this.audio_url_transform(_annotation.audio.href);
+ }
+ var _tmpId = "jwplayer-" + IriSP.Model.getUID();
+ _this.jwplayers[_annotation.id] = _tmpId;
+ _this.$.find(".Ldt-AnnotationsList-Audio").append(IriSP.jQuery("<div>").attr("id", _tmpId));
+ jwplayer(_tmpId).setup({
+ flashplayer: IriSP.getLib("jwPlayerSWF"),
+ file: _audiofile,
+ fallback: false,
+ primary: "flash",
+ controls: false,
+ width: 1,
+ height: 1,
+ events: {
+ onPause: function() {
+ _this.$.find(".Ldt-AnnotationsList-Play[data-annotation-id=" + _annotation.id + "]").text(_this.l10n.voice_annotation);
+ },
+ onPlay: function() {
+ _this.$.find(".Ldt-AnnotationsList-Play[data-annotation-id=" + _annotation.id + "]").text(_this.l10n.now_playing);
+ }
+ }
+ });
+ }
+ }
+ var _html = Mustache.to_html(_this.annotationTemplate, _data),
+ _el = IriSP.jQuery(_html),
+ _onselect = function() {
+ _this.$.find('.Ldt-AnnotationsList-li').removeClass("selected");
+ _el.addClass("selected");
+ },
+ _onunselect = function() {
+ _this.$.find('.Ldt-AnnotationsList-li').removeClass("selected");
+ };
_el.mouseover(function() {
_annotation.trigger("select");
})
@@ -226,35 +262,47 @@
_annotation.trigger("unselect");
})
.appendTo(_this.list_$);
- _annotation.on("select", function() {
- _this.annotations_$.removeClass("selected");
- _el.addClass("selected");
+ IriSP.attachDndData(_el.find("[draggable]"), {
+ title: _title,
+ description: _description,
+ uri: _url,
+ image: _annotation.thumbnail
});
- _annotation.on("unselect", function() {
- _this.annotations_$.removeClass("selected");
- });;
+ _el.on("remove", function() {
+ _annotation.off("select", _onselect);
+ _annotation.off("unselect", _onunselect);
+ });
+ _annotation.on("select", _onselect);
+ _annotation.on("unselect", _onunselect);
});
- this.annotations_$ = this.$.find('.Ldt-AnnotationsList-li');
-
/* Correct the empty tag bug */
this.$.find('.Ldt-AnnotationsList-Tag-Li').each(function() {
var _el = IriSP.jQuery(this);
if (!_el.text().replace(/(^\s+|\s+$)/g,'')) {
- _el.detach();
+ _el.remove();
}
});
this.$.find('.Ldt-AnnotationsList-Tag-Li').click(function() {
- _this.player.popcorn.trigger("IriSP.search.triggeredSearch", IriSP.jQuery(this).text().replace(/(^\s+|\s+$)/g,''));
- })
+ _this.source.getAnnotations().search(IriSP.jQuery(this).text().replace(/(^\s+|\s+$)/g,''));
+ });
- if(this.searchString) {
- var _searchRe = IriSP.Model.regexpFromTextOrArray(this.searchString);
+ this.$.find(".Ldt-AnnotationsList-Play").click(function() {
+ var _el = IriSP.jQuery(this),
+ _annid = _el.attr("data-annotation-id");
+ if (_this.jwplayers[_annid]) {
+ jwplayer(_this.jwplayers[_annid]).play();
+ }
+ _this.media.pause();
+ });
+
+ if (this.source.getAnnotations().searching) {
+ var rx = _this.source.getAnnotations().regexp || false;
this.$.find(".Ldt-AnnotationsList-Title a, .Ldt-AnnotationsList-Description").each(function() {
var _$ = IriSP.jQuery(this);
- _$.html(_$.text().replace(/(^\s+|\s+$)/g,'').replace(_searchRe, '<span class="Ldt-AnnotationsList-highlight">$1</span>'))
- })
+ _$.html(IriSP.textFieldHtml(_$.text(), rx));
+ });
}
}
@@ -262,26 +310,59 @@
if (this.mashupMode) {
this.ajaxMashup();
} else {
- if (Math.abs(_currentTime - this.lastAjaxQuery) > (this.ajax_granularity / 2000)) {
+ if (Math.abs(_currentTime - this.lastAjaxQuery) > (this.ajax_granularity)) {
this.ajaxSource();
}
}
}
return _list.length;
-}
+};
IriSP.Widgets.AnnotationsList.prototype.draw = function() {
+ this.jwplayers = {};
+ this.mashupMode = (this.media.elementType === "mashup");
+
this.renderTemplate();
+ var _this = this;
+
this.list_$ = this.$.find(".Ldt-AnnotationsList-ul");
- this.bindPopcorn("IriSP.search", "onSearch");
- this.bindPopcorn("IriSP.search.closed", "onSearch");
- this.bindPopcorn("IriSP.search.cleared", "onSearch");
- this.bindPopcorn("IriSP.AnnotationsList.refresh","refresh");
- var _this = this;
+ this.source.getAnnotations().on("search", function(_text) {
+ _this.searchString = _text;
+ if (_this.source !== _this.currentSource) {
+ _this.currentSource.getAnnotations().search(_text);
+ _this.throttledRefresh();
+ }
+ });
+ this.source.getAnnotations().on("found", function() {
+ _this.throttledRefresh();
+ });
+ this.source.getAnnotations().on("not-found", function() {
+ _this.throttledRefresh();
+ });
+ this.source.getAnnotations().on("clear-search", function() {
+ _this.searchString = false;
+ if (_this.source !== _this.currentSource) {
+ _this.currentSource.getAnnotations().trigger("clear-search");
+ }
+ });
+ this.source.getAnnotations().on("search-cleared", function() {
+ _this.throttledRefresh();
+ });
+
+ this.onMdpEvent("AnnotationsList.refresh", function() {
+ if (_this.ajax_url) {
+ if (_this.mashupMode) {
+ _this.ajaxMashup();
+ } else {
+ _this.ajaxSource();
+ }
+ }
+ _this.throttledRefresh();
+ });
if (this.ajax_url) {
if (this.mashupMode) {
@@ -295,18 +376,18 @@
if (this.refresh_interval) {
window.setInterval(function() {
- _this.currentSource.get()
+ _this.currentSource.get();
}, this.refresh_interval);
}
+ this.onMdpEvent("createAnnotationWidget.addedAnnotation");
var _events = [
- "IriSP.createAnnotationWidget.addedAnnotation",
"timeupdate",
"seeked",
"loadedmetadata"
];
for (var _i = 0; _i < _events.length; _i++) {
- this.player.popcorn.listen(_events[_i], this.throttledRefresh);
+ this.onMediaEvent(_events[_i], this.throttledRefresh);
}
this.throttledRefresh();
--- a/src/widgets/Arrow.js Thu Aug 30 14:45:23 2012 +0200
+++ b/src/widgets/Arrow.js Thu Jan 02 16:40:25 2014 +0100
@@ -6,25 +6,25 @@
IriSP.Widgets.Arrow.prototype = new IriSP.Widgets.Widget();
IriSP.Widgets.Arrow.prototype.defaults = {
- arrow_height : 16,
- arrow_width : 24,
+ arrow_height : 12,
+ arrow_width : 20,
base_height : 0,
base_curve : 0,
fill_url: IriSP.widgetsDir + '/img/pinstripe.png',
fill_color: "#ffffff", //Gradients can be used, e.g. "90-#000-#fff" for vertical white-to-black
stroke_color: "#b7b7b7",
stroke_width: 1.5,
- animation_speed: 20,
- pilot_widget: "Annotation"
-}
+ animation_speed: 20
+};
IriSP.Widgets.Arrow.prototype.draw = function() {
this.height = this.arrow_height + this.base_height;
this.$.addClass("Ldt-Arrow").css({
- height: this.height + "px",
- "margin-top": "1px"
+ height: (1+this.height) + "px",
+ "margin-top": "1px",
+ overflow: "hidden"
});
- this.paper = new Raphael(this.container, this.width, this.height );
+ this.paper = new Raphael(this.container, this.width, 1+this.height );
window.myArrow = this;
this.svgArrow = this.paper.path('M0,' + this.height + 'L' + this.width + ',' + this.height);
this.svgArrow.attr({
@@ -32,14 +32,11 @@
"stroke-width": this.stroke_width,
fill: this.fill_url ? ( 'url(' + this.fill_url + ')' ) : this.fill_color
});
- this.moveTo(0);
- this.bindPopcorn("IriSP.Arrow.updatePosition","onUpdatePosition");
- this.bindPopcorn("IriSP.Arrow.takeover","onTakeover");
- this.bindPopcorn("IriSP.Arrow.release","onRelease");
-}
+ this.moveToX(0);
+};
IriSP.Widgets.Arrow.prototype.drawAt = function(_x) {
- _x = Math.floor(Math.max(0, Math.min(_x, this.width)));
+ _x = Math.max(0, Math.min(_x, this.width));
var _d = 'M0,' + this.height
+ 'L0,' + Math.min( this.height, this.arrow_height + this.base_curve)
+ 'Q0,' + this.arrow_height
@@ -56,18 +53,22 @@
this.svgArrow.attr({
path: _d
});
-}
+};
-IriSP.Widgets.Arrow.prototype.moveTo = function(_x) {
- this.targetX = Math.floor(Math.max(0, Math.min(_x, this.width)));
+IriSP.Widgets.Arrow.prototype.moveToX = function(_x) {
+ this.targetX = Math.max(0, Math.min(_x, this.width));
if (typeof this.animInterval === "undefined") {
this.animInterval = window.setInterval(
this.functionWrapper("increment"),
40
- )
+ );
}
this.increment();
-}
+};
+
+IriSP.Widgets.Arrow.prototype.moveToTime = function(_t) {
+ this.moveToX(this.width * _t / this.media.duration);
+};
IriSP.Widgets.Arrow.prototype.increment = function() {
if (typeof this.currentX === "undefined") {
@@ -84,22 +85,4 @@
this.animInterval = undefined;
}
this.drawAt(this.currentX);
-}
-
-IriSP.Widgets.Arrow.prototype.onUpdatePosition = function(_param) {
- if (_param.widget === this.current_pilot_widget) {
- if (typeof _param.x !== "undefined") {
- this.moveTo(_param.x);
- } else {
- this.moveTo(this.width * _param.time / this.source.getDuration());
- }
- }
-}
-
-IriSP.Widgets.Arrow.prototype.onTakeover = function(_widget) {
- this.current_pilot_widget = _widget;
-}
-
-IriSP.Widgets.Arrow.prototype.onRelease = function(_widget) {
- this.current_pilot_widget = this.pilot_widget;
-}
+};
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/src/widgets/AutoPlayer.js Thu Jan 02 16:40:25 2014 +0100
@@ -0,0 +1,76 @@
+IriSP.Widgets.AutoPlayer = function(player, config) {
+ IriSP.Widgets.Widget.call(this, player, config);
+};
+
+IriSP.Widgets.AutoPlayer.prototype = new IriSP.Widgets.Widget();
+
+IriSP.Widgets.AutoPlayer.prototype.defaults = {
+ default_type: "JwpPlayer"
+};
+
+IriSP.Widgets.AutoPlayer.prototype.draw = function() {
+
+ if (typeof this.video === "undefined") {
+ this.video = this.media.video;
+ }
+
+ var _props = [ "live", "provider", "autostart", "streamer", "video", "height", "width", "url_transform" ],
+ _opts = {},
+ _types = [
+ {
+ regexp: /^rtmp:\/\//,
+ type: "JwpPlayer"
+ },
+ {
+ regexp: /\.(mp4|m4v)$/,
+ type: "AdaptivePlayer"
+ },
+ {
+ regexp: /\.(ogg|ogv|webm)$/,
+ type: "HtmlPlayer"
+ },
+ {
+ regexp: /^(https?:\/\/)?(www\.)?youtube\.com/,
+ type: "PopcornPlayer"
+ },
+ {
+ regexp: /^(https?:\/\/)?(www\.)?vimeo\.com/,
+ type: "PopcornPlayer"
+ },
+ {
+ regexp: /^(https?:\/\/)?(www\.)?dailymotion\.com/,
+ type: "DailymotionPlayer"
+ }
+ ],
+ _rtmprgx = /^rtmp:\/\//;
+
+ for (var i = 0; i < _types.length; i++) {
+ if (_types[i].regexp.test(this.video)) {
+ _opts.type = _types[i].type;
+ break;
+ }
+ }
+
+ if (typeof _opts.type === "undefined") {
+ _opts.type = this.default_type;
+ }
+
+ if (_opts.type === "AdaptivePlayer") {
+ var _canPlayType = document.createElement('video').canPlayType("video/mp4");
+ _opts.type = (_canPlayType == "maybe" || _canPlayType == "probably") ? "HtmlPlayer" : "JwpPlayer";
+ }
+
+ if (_rtmprgx.test(this.video)) {
+ _opts.provider = "rtmp";
+ _opts.live = true;
+ }
+
+ for (var i = 0; i < _props.length; i++) {
+ if (typeof this[_props[i]] !== "undefined") {
+ _opts[_props[i]] = this[_props[i]];
+ }
+ }
+
+ this.insertSubwidget(this.$, _opts);
+
+};
\ No newline at end of file
--- a/src/widgets/Controller.css Thu Aug 30 14:45:23 2012 +0200
+++ b/src/widgets/Controller.css Thu Jan 02 16:40:25 2014 +0100
@@ -9,7 +9,7 @@
}
.Ldt-Ctrl-Left {
- float:left;
+ float:left; width: 300px;
}
.Ldt-Ctrl-Right {
@@ -82,13 +82,12 @@
}
.Ldt-Ctrl-Search {
- display: none;
- width: 165px;
- height: 25px;
- border: 1px;
- border-color: #CFCFCF;
- float: left;
- text-align: center;
+ width: 0; float: left; overflow: hidden;
+}
+
+input.Ldt-Ctrl-SearchInput {
+ width: 145px; height: 13px; margin: 2px; padding: 3px;
+ border: 1px solid #8080a0; border-radius: 3px; font-size: 13px;
}
.Ldt-Ctrl-Time {
--- a/src/widgets/Controller.js Thu Aug 30 14:45:23 2012 +0200
+++ b/src/widgets/Controller.js Thu Jan 02 16:40:25 2014 +0100
@@ -1,17 +1,17 @@
/* Displays Play and Pause buttons, Search Button and Form, Volume Control */
IriSP.Widgets.Controller = function(player, config) {
- IriSP.Widgets.Widget.call(this, player, config);
-
- this._searchLastValue = "";
+ IriSP.Widgets.Widget.call(this, player, config);
+ this.lastSearchValue = "";
};
IriSP.Widgets.Controller.prototype = new IriSP.Widgets.Widget();
IriSP.Widgets.Controller.prototype.defaults = {
disable_annotate_btn: false,
- disable_search_btn: false
-}
+ disable_search_btn: false,
+ disable_ctrl_f: false
+};
IriSP.Widgets.Controller.prototype.template =
'<div class="Ldt-Ctrl">'
@@ -56,7 +56,7 @@
annotate: "Annotate",
search: "Search",
elapsed_time: "Elapsed time",
- total_time: "Total time",
+ total_time: "Total duration",
volume: "Volume",
volume_control: "Volume control"
},
@@ -69,7 +69,7 @@
unmute: "Activer le son",
annotate: "Annoter",
search: "Rechercher",
- elapsed_time: "Durée écoulée",
+ elapsed_time: "Temps écoulé",
total_time: "Durée totale",
volume: "Niveau sonore",
volume_control: "Réglage du niveau sonore"
@@ -87,25 +87,21 @@
this.$volumeBar = this.$.find(".Ldt-Ctrl-Volume-Bar");
// handle events
- this.bindPopcorn("play","playButtonUpdater");
- this.bindPopcorn("pause","playButtonUpdater");
- this.bindPopcorn("volumechange","volumeUpdater");
- this.bindPopcorn("timeupdate","timeDisplayUpdater");
- this.bindPopcorn("loadedmetadata","timeDisplayUpdater");
- this.bindPopcorn("loadedmetadata","volumeUpdater");
- this.bindPopcorn("IriSP.search.matchFound","searchMatch");
- this.bindPopcorn("IriSP.search.noMatchFound","searchNoMatch");
- this.bindPopcorn("IriSP.search.triggeredSearch","triggeredSearch");
+ this.onMediaEvent("play","playButtonUpdater");
+ this.onMediaEvent("pause","playButtonUpdater");
+ this.onMediaEvent("volumechange","volumeUpdater");
+ this.onMediaEvent("timeupdate","timeDisplayUpdater");
+ this.onMediaEvent("loadedmetadata","volumeUpdater");
// handle clicks
this.$playButton.click(this.functionWrapper("playHandler"));
this.$.find(".Ldt-Ctrl-Annotate").click(function() {
- _this.player.popcorn.trigger("IriSP.CreateAnnotation.toggle");
+ _this.player.trigger("CreateAnnotation.toggle");
});
this.$.find(".Ldt-Ctrl-SearchBtn").click(this.functionWrapper("searchButtonHandler"));
- this.$searchInput.keyup(this.functionWrapper("searchHandler") );
+ this.$searchInput.keyup(this.functionWrapper("searchHandler"));
var _volctrl = this.$.find(".Ldt-Ctrl-Volume-Control");
this.$.find('.Ldt-Ctrl-Sound')
@@ -121,13 +117,28 @@
}).mouseout(function() {
_volctrl.hide();
});
-
+
+ // Handle CTRL-F
+ if (!this.disable_ctrl_f) {
+ var _fKey = "F".charCodeAt(0),
+ _lastCtrlFTime = 0;
+ IriSP.jQuery(document).keydown(function(_event) {
+ if (_event.keyCode === _fKey && (_event.ctrlKey || _event.metaKey)) {
+ var _time = IriSP.jQuery.now();
+ if (_time - _lastCtrlFTime > 2000) {
+ _this.searchButtonHandler();
+ }
+ _lastCtrlFTime = _time;
+ return false;
+ }
+ });
+ }
// Allow Volume Cursor Dragging
this.$volumeBar.slider({
slide: function(event, ui) {
_this.$volumeBar.attr("title",_this.l10n.volume+': ' + ui.value + '%');
- _this.player.popcorn.volume(ui.value / 100);
+ _this.media.setVolume(ui.value / 100);
},
stop: this.functionWrapper("volumeUpdater")
});
@@ -135,33 +146,38 @@
// trigger an IriSP.Player.MouseOver to the widgets that are interested (i.e : sliderWidget)
this.$.hover(
function() {
- _this.player.popcorn.trigger("IriSP.Player.MouseOver");
+ _this.player.trigger("Player.MouseOver");
},
function() {
- _this.player.popcorn.trigger("IriSP.Player.MouseOut");
+ _this.player.trigger("Player.MouseOut");
});
- /* some players - including jwplayer - save the state of the mute button between sessions */
-
- window.setTimeout(this.functionWrapper("volumeUpdater"), 1000);
+
+ this.timeDisplayUpdater(new IriSP.Model.Time(0));
+
+ var annotations = this.source.getAnnotations();
+ annotations.on("search", function(_text) {
+ _this.$searchInput.val(_text);
+ _this.showSearchBlock();
+ });
+ annotations.on("found", function(_text) {
+ _this.$searchInput.css('background-color','#e1ffe1');
+ });
+ annotations.on("not-found", function(_text) {
+ _this.$searchInput.css('background-color', "#d62e3a");
+ });
+ annotations.on("search-cleared", function() {
+ _this.hideSearchBlock();
+ });
};
/* Update the elasped time div */
-IriSP.Widgets.Controller.prototype.timeDisplayUpdater = function() {
- var _curTime = this.player.popcorn.roundTime();
- if (typeof this._previousSecond !== "undefined" && _curTime === this._previousSecond) {
- return;
- }
+IriSP.Widgets.Controller.prototype.timeDisplayUpdater = function(_time) {
// we get it at each call because it may change.
- var _totalTime = this.source.getDuration(),
- _elapsedTime = new IriSP.Model.Time();
-
- _elapsedTime.setSeconds(_curTime);
-
- this.$.find(".Ldt-Ctrl-Time-Elapsed").html(_elapsedTime.toString());
+ var _totalTime = this.media.duration;
+ this.$.find(".Ldt-Ctrl-Time-Elapsed").html(_time.toString());
this.$.find(".Ldt-Ctrl-Time-Total").html(_totalTime.toString());
- this._previousSecond = _curTime;
};
/* update the icon of the button - separate function from playHandler
@@ -169,10 +185,7 @@
the jwplayer window) we have to change the icon without playing/pausing
*/
IriSP.Widgets.Controller.prototype.playButtonUpdater = function() {
-
- var status = this.player.popcorn.media.paused;
-
- if (status) {
+ if (this.media.getPaused()) {
/* the background sprite is changed by adding/removing the correct classes */
this.$playButton
.attr("title", this.l10n.play)
@@ -188,23 +201,20 @@
IriSP.Widgets.Controller.prototype.playHandler = function() {
-
- var status = this.player.popcorn.media.paused;
-
- if (status) {
- this.player.popcorn.play();
+ if (this.media.getPaused()) {
+ this.media.play();
} else {
- this.player.popcorn.pause();
+ this.media.pause();
}
};
IriSP.Widgets.Controller.prototype.muteHandler = function() {
- this.player.popcorn.muted(!this.player.popcorn.muted());
+ this.media.setMuted(!this.media.getMuted());
};
IriSP.Widgets.Controller.prototype.volumeUpdater = function() {
- var _muted = this.player.popcorn.muted(),
- _vol = this.player.popcorn.volume();
+ var _muted = this.media.getMuted(),
+ _vol = this.media.getVolume();
if (_vol === false) {
_vol = .5;
}
@@ -215,43 +225,29 @@
.addClass("Ldt-Ctrl-Sound-Mute");
} else {
_soundCtl.attr("title", this.l10n.mute)
- .addClass(_vol < .5 ? "Ldt-Ctrl-Sound-Half" : "Ldt-Ctrl-Sound-Full" )
+ .addClass(_vol < .5 ? "Ldt-Ctrl-Sound-Half" : "Ldt-Ctrl-Sound-Full" );
}
this.$volumeBar.slider("value", _muted ? 0 : 100 * _vol);
};
IriSP.Widgets.Controller.prototype.showSearchBlock = function() {
- this.$searchBlock.show("blind", { direction: "horizontal"}, 100);
+ this.$searchBlock.animate({ width:"160px" }, 200);
this.$searchInput.css('background-color','#fff');
-
this.$searchInput.focus();
-
- // we need this variable because some widgets can find a match in
- // their data while at the same time others don't. As we want the
- // search field to become green when there's a match, we need a
- // variable to remember that we had one.
- this._positiveMatch = false;
-
- // tell the world the field is open
- this.player.popcorn.trigger("IriSP.search.open");
};
IriSP.Widgets.Controller.prototype.hideSearchBlock = function() {
- this._searchLastValue = this.$searchInput.val();
- this.$searchInput.val('');
- this.$searchBlock.hide("blind", { direction: "horizontal"}, 75);
-
- this._positiveMatch = false;
-
- this.player.popcorn.trigger("IriSP.search.closed");
+ this.$searchBlock.animate( { width: 0 }, 200);
};
/** react to clicks on the search button */
IriSP.Widgets.Controller.prototype.searchButtonHandler = function() {
- if ( this.$searchBlock.is(":hidden") ) {
+ if ( !this.$searchBlock.width() ) {
this.showSearchBlock();
- this.$searchInput.val(this._searchLastValue);
- this.player.popcorn.trigger("IriSP.search", this._searchLastValue); // trigger the search to make it more natural.
+ var _val = this.$searchInput.val();
+ if (_val) {
+ this.source.getAnnotations().search(_val);
+ }
} else {
this.hideSearchBlock();
}
@@ -260,40 +256,22 @@
/** this handler is called whenever the content of the search
field changes */
IriSP.Widgets.Controller.prototype.searchHandler = function() {
- this._searchLastValue = this.$searchInput.val();
+ if ( !this.$searchBlock.width() ) {
+ this.$searchBlock.css({ width:"160px" });
+ this.$searchInput.css('background-color','#fff');
+ }
+ var _val = this.$searchInput.val();
this._positiveMatch = false;
-
+
// do nothing if the search field is empty, instead of highlighting everything.
- if (this._searchLastValue == "") {
- this.player.popcorn.trigger("IriSP.search.cleared");
- this.$searchInput.css('background-color','');
- } else {
- this.player.popcorn.trigger("IriSP.search", this._searchLastValue);
+ if (_val !== this.lastSearchValue) {
+ if (_val) {
+ this.source.getAnnotations().search(_val);
+ } else {
+ this.source.getAnnotations().trigger("clear-search");
+ this.$searchInput.css('background-color','');
+ }
}
+ this.lastSearchValue = _val;
};
-/**
- handler for the IriSP.search.found message, which is sent by some views when they
- highlight a match.
-*/
-IriSP.Widgets.Controller.prototype.searchMatch = function() {
- this._positiveMatch = true;
- this.$searchInput.css('background-color','#e1ffe1');
-};
-
-/** the same, except that no value could be found */
-IriSP.Widgets.Controller.prototype.searchNoMatch = function() {
- if (this._positiveMatch !== true) {
- this.$searchInput.css('background-color', "#d62e3a");
- }
-};
-
-/** react to an IriSP.Player.triggeredSearch - that is, when
- a widget ask the.Player to do a search on his behalf */
-IriSP.Widgets.Controller.prototype.triggeredSearch = function(searchString) {
- this.showSearchBlock();
- this.$searchInput.attr('value', searchString);
- this.player.popcorn.trigger("IriSP.search", searchString); // trigger the search to make it more natural.
-};
-
-
--- a/src/widgets/CreateAnnotation.css Thu Aug 30 14:45:23 2012 +0200
+++ b/src/widgets/CreateAnnotation.css Thu Jan 02 16:40:25 2014 +0100
@@ -11,13 +11,11 @@
}
.Ldt-CreateAnnotation-Inner {
- background: url(img/pinstripe.png);
- padding: 5px;
- margin: 0;
+ background: url(img/pinstripe.png); padding: 5px; margin: 0; position: relative;
}
.Ldt-CreateAnnotation-Inner h3 {
- margin: 5px 0; font-size: 14px; font-weight: bold; text-align: right;
+ margin: 5px 0; font-size: 14px; font-weight: bold; text-align: right; clear:both; color: #0068c4;
}
.Ldt-CreateAnnotation-h3Left {
@@ -36,6 +34,11 @@
border-radius: 2px;
}
+.Ldt-CreateAnnotation-Title.empty, .Ldt-CreateAnnotation-Creator.empty {
+ font-style: italic;
+ color: #90b0d0;
+}
+
.Ldt-CreateAnnotation-Times {
color: #ff3b77
}
@@ -69,6 +72,10 @@
border-radius: 2px;
}
+.Ldt-CreateAnnotation-Description.empty {
+ font-style: italic; color: #999999;
+}
+
.Ldt-CreateAnnotation-Avatar {
float: right;
width: 48px;
@@ -86,11 +93,11 @@
border: 1px solid #bbbbbb;
}
-.Ldt-CreateAnnotation-Tags, .Ldt-CreateAnnotation-Polemics {
- width: 520px;
+.Ldt-CreateAnnotation-RecBlock {
+ width: 220px; float: left;
}
-.Ldt-CreateAnnotation-TagTitle, .Ldt-CreateAnnotation-PolemicTitle {
+.Ldt-CreateAnnotation-TagTitle, .Ldt-CreateAnnotation-PolemicTitle, .Ldt-CreateAnnotation-RecLabel {
display: block; margin: 5px 0 2px; font-size: 12px;
}
--- a/src/widgets/CreateAnnotation.js Thu Aug 30 14:45:23 2012 +0200
+++ b/src/widgets/CreateAnnotation.js Thu Jan 02 16:40:25 2014 +0100
@@ -1,4 +1,4 @@
-/* TODO: Add Social Network Sharing, Finish Current Timecode Sync & Arrow Takeover */
+/* TODO: Add Social Network Sharing */
IriSP.Widgets.CreateAnnotation = function(player, config) {
IriSP.Widgets.Widget.call(this, player, config);
@@ -7,12 +7,14 @@
IriSP.Widgets.CreateAnnotation.prototype = new IriSP.Widgets.Widget();
IriSP.Widgets.CreateAnnotation.prototype.defaults = {
- show_title_field : false, /* For the moment, titles can't be sent to ldtplatform */
+ show_title_field : true,
show_creator_field : true,
start_visible : true,
always_visible : false,
- sync_on_slice_widget : true, /* If false, syncs on current timecode */
- takeover_arrow : false,
+ show_slice : true,
+ show_arrow : true,
+ show_mic_record: false,
+ show_mic_play: false,
minimize_annotation_widget : true,
creator_name : "",
creator_avatar : "",
@@ -37,13 +39,15 @@
background_color: "#f0e000",
text_color: "#000000"
}],
+ slice_annotation_type: "chap",
annotation_type: "Contributions",
api_serializer: "ldt_annotate",
api_endpoint_template: "",
- api_method: "PUT",
+ api_method: "POST",
after_send_timeout: 0,
close_after_send: false,
-}
+ tag_prefix: "#"
+};
IriSP.Widgets.CreateAnnotation.prototype.messages = {
en: {
@@ -52,59 +56,85 @@
at_time: "at",
submit: "Submit",
add_keywords_: "Add keywords:",
- add_polemic_keywords_: "Add polemic keywords:",
+ add_polemic_keywords_: "Add polemic attributes :",
your_name_: "Your name:",
- no_title: "Annotate this video",
+ annotate_video: "Annotate this video",
type_title: "Annotation title",
- type_description: "Type the full description of your annotation here.",
- wait_while_processing: "Please wait while your request is being processed...",
+ type_description: "Type the full contents of your annotation here.",
+ wait_while_processing: "Please wait while your annotation 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",
- more_tags: "More tags",
- cancel: "Cancel",
- close_widget: "Cacher la zone de création d'annotations"
+ close_widget: "Hide the annotation form",
+ "polemic++": "Agree",
+ "polemic--": "Disagree",
+ "polemic??": "Question",
+ "polemic==": "Reference"
},
fr: {
from_time: "de",
to_time: "à",
at_time: "à",
submit: "Envoyer",
- add_keywords_: "Ajouter des mots-clés :",
- add_polemic_keywords_: "Ajouter des mots-clés polémiques :",
- your_name_: "Votre nom :",
- no_title: "Annoter cette vidéo",
+ add_keywords_: "Ajouter des mots-clés\u00a0:",
+ add_polemic_keywords_: "Ajouter des attributs polémiques\u00a0:",
+ your_name_: "Votre nom\u00a0:",
+ annotate_video: "Annoter cette vidéo",
type_title: "Titre de l'annotation",
- type_description: "Rédigez le contenu de votre annotation ici.",
- wait_while_processing: "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.",
+ type_description: "Rédigez ici le contenu de votre annotation.",
+ wait_while_processing: "Veuillez patienter pendant le traitement de votre annotation...",
+ error_while_contacting: "Une erreur s'est produite en contactant le serveur. Votre annotation n'a pas été enregistrée.",
annotation_saved: "Merci, votre annotation a été enregistrée.",
share_annotation: "Souhaitez-vous la partager sur les réseaux sociaux ?",
- share_on: "Partager sur",
- more_tags: "Plus de mots-clés",
- cancel: "Cancel",
- close_widget: "Hide the annotation creating block"
+ close_widget: "Cacher le formulaire de création d'annotations",
+ "polemic++": "Accord",
+ "polemic--": "Désaccord",
+ "polemic??": "Question",
+ "polemic==": "Référence"
}
-}
+};
IriSP.Widgets.CreateAnnotation.prototype.template =
- '<div class="Ldt-CreateAnnotation"><div class="Ldt-CreateAnnotation-Inner">'
+ '{{#show_slice}}<div class="Ldt-CreateAnnotation-Slice"></div>{{/show_slice}}'
+ + '{{^show_slice}}{{#show_arrow}}<div class="Ldt-CreateAnnotation-Arrow"></div>{{/show_arrow}}{{/show_slice}}'
+ + '<div class="Ldt-CreateAnnotation"><div class="Ldt-CreateAnnotation-Inner">'
+ '<form class="Ldt-CreateAnnotation-Screen Ldt-CreateAnnotation-Main">'
- + '<h3><span class="Ldt-CreateAnnotation-h3Left">{{#show_title_field}}<input class="Ldt-CreateAnnotation-Title" placeholder="{{l10n.type_title}}" />{{/show_title_field}}'
- + '{{^show_title_field}}<span class="Ldt-CreateAnnotation-NoTitle">{{l10n.no_title}} </span>{{/show_title_field}}'
- + ' <span class="Ldt-CreateAnnotation-Times">{{#sync_on_slice_widget}}{{l10n.from_time}} {{/sync_on_slice_widget}}{{^sync_on_slice_widget}}{{l10n.at_time}} {{/sync_on_slice_widget}} <span class="Ldt-CreateAnnotation-Begin">00:00</span>'
- + '{{#sync_on_slice_widget}} {{l10n.to_time}} <span class="Ldt-CreateAnnotation-End">00:00</span>{{/sync_on_slice_widget}}</span></span>'
- + '{{#show_creator_field}}{{l10n.your_name_}} <input class="Ldt-CreateAnnotation-Creator" value="{{creator_name}}" /></h3>{{/show_creator_field}}'
- + '<textarea class="Ldt-CreateAnnotation-Description" placeholder="{{l10n.type_description}}"></textarea>'
+ + '<h3><span class="Ldt-CreateAnnotation-h3Left">{{l10n.annotate_video}}{{#show_title_field}}</span></h3>'
+ + '<h3><span class="Ldt-CreateAnnotation-h3Left"><input class="Ldt-CreateAnnotation-Title empty" placeholder="{{l10n.type_title}}" />{{/show_title_field}}'
+ + '<span class="Ldt-CreateAnnotation-Times"> {{#show_slice}}{{l10n.from_time}} {{/show_slice}}{{^show_slice}}{{l10n.at_time}} {{/show_slice}} <span class="Ldt-CreateAnnotation-Begin">00:00</span>'
+ + '{{#show_slice}} {{l10n.to_time}} <span class="Ldt-CreateAnnotation-End">{{end}}</span>{{/show_slice}}</span></span>'
+ + '{{#show_creator_field}}{{l10n.your_name_}} <input class="Ldt-CreateAnnotation-Creator empty" value="{{creator_name}}" />{{/show_creator_field}}</h3>'
+ + '<textarea class="Ldt-CreateAnnotation-Description empty" placeholder="{{l10n.type_description}}"></textarea>'
+ '<div class="Ldt-CreateAnnotation-Avatar"><img src="{{creator_avatar}}" title="{{creator_name}}"></img></div>'
+ '<input type="submit" class="Ldt-CreateAnnotation-Submit" value="{{l10n.submit}}" />'
+ + '{{#show_mic_record}}<div class="Ldt-CreateAnnotation-RecBlock"><div class="Ldt-CreateAnnotation-RecLabel">Add voice annotation</div>'
+ + ' <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="220" height="160">'
+ + ' <param name="movie" value="{{record_swf}}" />'
+ + ' <param name="quality" value="high" />'
+ + ' <param name="bgcolor" value="#ffffff" />'
+ + ' <param name="play" value="true" />'
+ + ' <param name="loop" value="true" />'
+ + ' <param name="wmode" value="transparent" />'
+ + ' <param name="scale" value="showall" />'
+ + ' <param name="menu" value="true" />'
+ + ' <param name="devicefont" value="false" />'
+ + ' <param name="salign" value="" />'
+ + ' <param name="allowScriptAccess" value="always" />'
+ + ' <param name="allowFullScreen" value="true" />'
+ + ' <param name="flashvars" value="playVisible={{show_mic_play}}">'
+ + ' <embed src="{{record_swf}}"" quality="high" bgcolor="#ffffff"'
+ + ' width="220" height="160" name="ExternalInterfaceExample" align="middle"'
+ + ' play="true" loop="false" quality="high" allowScriptAccess="always" '
+ + ' type="application/x-shockwave-flash" allowFullScreen="true" wmode="transparent" '
+ + ' flashvars="playVisible={{show_mic_play}}"'
+ + ' pluginspage="http://www.macromedia.com/go/getflashplayer">'
+ + ' </embed>'
+ + ' </object>'
+ + '</div>{{/show_mic_record}}'
+ '{{#tags.length}}<div class="Ldt-CreateAnnotation-Tags"><div class="Ldt-CreateAnnotation-TagTitle">{{l10n.add_keywords_}}</div><ul class="Ldt-CreateAnnotation-TagList">'
- + '{{#tags}}<li class="Ldt-CreateAnnotation-TagLi" tag-id="{{id}}"><span class="Ldt-CreateAnnotation-TagButton">{{title}}</span></li>{{/tags}}</ul></div>{{/tags.length}}'
+ + '{{#tags}}<li class="Ldt-CreateAnnotation-TagLi" tag-id="{{id}}" data-text="{{tag_prefix}}{{title}}"><span class="Ldt-CreateAnnotation-TagButton">{{title}}</span></li>{{/tags}}</ul></div>{{/tags.length}}'
+ '{{#polemics.length}}<div class="Ldt-CreateAnnotation-Polemics"><div class="Ldt-CreateAnnotation-PolemicTitle">{{l10n.add_polemic_keywords_}}</div><ul class="Ldt-CreateAnnotation-PolemicList">'
- + '{{#polemics}}<li class="Ldt-CreateAnnotation-PolemicLi" style="background-color: {{background_color}}; color: {{text_color}}">{{keyword}}</li>{{/polemics}}</ul></div>{{/polemics.length}}'
+ + '{{#polemics}}<li class="Ldt-CreateAnnotation-PolemicLi" style="background-color: {{background_color}}; color: {{text_color}}" data-text="{{keyword}}">{{keyword}}</li>{{/polemics}}</ul></div>{{/polemics.length}}'
+ '<div style="clear: both;"></div></form>'
+ '<div class="Ldt-CreateAnnotation-Screen Ldt-CreateAnnotation-Wait"><div class="Ldt-CreateAnnotation-InnerBox">{{l10n.wait_while_processing}}</div></div>'
+ '<div class="Ldt-CreateAnnotation-Screen Ldt-CreateAnnotation-Error">{{^always_visible}}<a title="{{l10n.close_widget}}" class="Ldt-CreateAnnotation-Close" href="#"></a>{{/always_visible}}<div class="Ldt-CreateAnnotation-InnerBox">{{l10n.error_while_contacting}}</div></div>'
@@ -113,18 +143,31 @@
IriSP.Widgets.CreateAnnotation.prototype.draw = function() {
var _this = this;
+
+ this.begin = new IriSP.Model.Time();
+ this.end = this.source.getDuration();
+
+ this.tag_prefix = this.tag_prefix || "";
+
if (this.tag_titles && !this.tags) {
- this.tags = IriSP._(this.tag_titles).map(function(_tag_title) {
- var _tag,
- _tags = _this.source.getTags().searchByTitle(_tag_title);
- if (_tags.length) {
- _tag = _tags[0];
- } else {
- _tag = new IriSP.Model.Tag(false, _this.source);
- _tag.title = _tag_title;
- }
- return _tag;
- });
+ if(!(this.tag_titles.length==1 && this.tag_titles[0]=="")){
+ this.tags = IriSP._(this.tag_titles).map(function(_tag_title) {
+ var _tag,
+ _tags = _this.source.getTags().searchByTitle(_tag_title, true);
+ if (_tags.length) {
+ _tag = _tags[0];
+ } else {
+ _tag = new IriSP.Model.Tag(false, _this.source);
+ _this.source.getTags().push(_tag);
+ _tag.title = _tag_title;
+ }
+ return _tag;
+ });
+ }
+ else{
+ // we forced no tags if this.tag_titles = [''] (and not false)
+ this.tags = true;
+ }
}
if (!this.tags) {
this.tags = this.source.getTags()
@@ -137,7 +180,44 @@
});
/* We have to use the map function because Mustache doesn't like our tags object */
}
+ this.record_swf = IriSP.getLib("recordMicSwf");
this.renderTemplate();
+ if (this.show_mic_record) {
+ this.recorder = this.$.find("embed")[0];
+
+ window.setAudioUrl = function(_url) {
+ _this.audio_url = _url;
+ }
+ }
+ if (this.show_slice) {
+ this.insertSubwidget(
+ this.$.find(".Ldt-CreateAnnotation-Slice"),
+ {
+ type: "Slice",
+ show_arrow: this.show_arrow,
+ annotation_type: this.slice_annotation_type,
+ onBoundsChanged: function(_from, _to) {
+ _this.begin = new IriSP.Model.Time(_from || 0);
+ _this.end = new IriSP.Model.Time(_to || 0);
+ _this.$.find(".Ldt-CreateAnnotation-Begin").html(_this.begin.toString());
+ _this.$.find(".Ldt-CreateAnnotation-End").html(_this.end.toString());
+ }
+ },
+ "slice"
+ );
+ } else {
+ if (this.show_arrow) {
+ this.insertSubwidget(this.$.find(".Ldt-CreateAnnotation-Arrow"), {type: "Arrow"},"arrow");
+ }
+ this.onMediaEvent("timeupdate", function(_time) {
+ _this.begin = new IriSP.Model.Time(_time || 0);
+ _this.end = new IriSP.Model.Time(_time || 0);
+ _this.$.find(".Ldt-CreateAnnotation-Begin").html(_this.begin.toString());
+ if (_this.arrow) {
+ _this.arrow.moveToTime(_time);
+ }
+ });
+ }
this.$.find(".Ldt-CreateAnnotation-Close").click(function() {
_this.close_after_send
? _this.hide()
@@ -145,9 +225,17 @@
return false;
});
this.$.find(".Ldt-CreateAnnotation-TagLi, .Ldt-CreateAnnotation-PolemicLi").click(function() {
- _this.addKeyword(IriSP.jQuery(this).text().replace(/(^\s+|\s+$)/g,''));
+ _this.addKeyword(IriSP.jQuery(this).attr("data-text"));
return false;
});
+ this.$.find(".Ldt-CreateAnnotation-PolemicLi").each(function() {
+ var _el = IriSP.jQuery(this),
+ _kw = _el.attr("data-text"),
+ _msg = _this.l10n["polemic" + _kw];
+ if (_msg) {
+ _el.attr("title",_msg);
+ }
+ });
this.$.find(".Ldt-CreateAnnotation-Description").bind("change keyup input paste", this.functionWrapper("onDescriptionChange"));
if (this.show_title_field) {
this.$.find(".Ldt-CreateAnnotation-Title").bind("change keyup input paste", this.functionWrapper("onTitleChange"));
@@ -163,12 +251,9 @@
this.hide();
}
- this.bindPopcorn("IriSP.CreateAnnotation.toggle","toggle");
- this.bindPopcorn("IriSP.Slice.boundsChanged","onBoundsChanged");
- this.begin = new IriSP.Model.Time();
- this.end = this.source.getDuration();
+ this.onMdpEvent("CreateAnnotation.toggle","toggle");
this.$.find("form").submit(this.functionWrapper("onSubmit"));
-}
+};
IriSP.Widgets.CreateAnnotation.prototype.showScreen = function(_screenName) {
this.$.find('.Ldt-CreateAnnotation-' + _screenName).show()
@@ -178,31 +263,35 @@
IriSP.Widgets.CreateAnnotation.prototype.show = function() {
this.visible = true;
this.showScreen('Main');
- this.$.find(".Ldt-CreateAnnotation-Description").val("").css("border-color", "#666666");
+ this.$.find(".Ldt-CreateAnnotation-Description").val("").css("border-color", "#666666").addClass("empty");
if (this.show_title_field) {
- this.$.find(".Ldt-CreateAnnotation-Title").val("").css("border-color", "#666666");
+ this.$.find(".Ldt-CreateAnnotation-Title").val("").css("border-color", "#666666").addClass("empty");
}
if (this.show_creator_field) {
this.$.find(".Ldt-CreateAnnotation-Creator").val(this.creator_name).css("border-color", "#666666");
+ if (!this.creator_name) {
+ this.$.find(".Ldt-CreateAnnotation-Creator").addClass("empty");
+ }
}
this.$.find(".Ldt-CreateAnnotation-TagLi, .Ldt-CreateAnnotation-PolemicLi").removeClass("selected");
this.$.slideDown();
if (this.minimize_annotation_widget) {
- this.player.popcorn.trigger("IriSP.Annotation.minimize");
+ this.player.trigger("Annotation.minimize");
}
- this.player.popcorn.trigger("IriSP.Slice.show");
-}
+};
IriSP.Widgets.CreateAnnotation.prototype.hide = function() {
+ if (this.recorder) {
+ this.recorder.stopRecord();
+ }
if (!this.always_visible) {
this.visible = false;
this.$.slideUp();
if (this.minimize_annotation_widget) {
- this.player.popcorn.trigger("IriSP.Annotation.maximize");
+ this.player.trigger("Annotation.maximize");
}
- this.player.popcorn.trigger("IriSP.Slice.hide");
}
-}
+};
IriSP.Widgets.CreateAnnotation.prototype.toggle = function() {
if (!this.always_visible) {
@@ -212,14 +301,7 @@
this.show();
}
}
-}
-
-IriSP.Widgets.CreateAnnotation.prototype.onBoundsChanged = function(_values) {
- this.begin = new IriSP.Model.Time(_values[0] || 0);
- this.end = new IriSP.Model.Time(_values[1] || 0);
- this.$.find(".Ldt-CreateAnnotation-Begin").html(this.begin.toString());
- this.$.find(".Ldt-CreateAnnotation-End").html(this.end.toString());
-}
+};
IriSP.Widgets.CreateAnnotation.prototype.addKeyword = function(_keyword) {
var _field = this.$.find(".Ldt-CreateAnnotation-Description"),
@@ -231,20 +313,25 @@
);
_field.val(_contents.replace(/\s{2,}/g,' ').replace(/(^\s+|\s+$)/g,''));
this.onDescriptionChange();
-}
+};
IriSP.Widgets.CreateAnnotation.prototype.pauseOnWrite = function() {
- if (this.pause_on_write && !this.player.popcorn.media.paused) {
- this.player.popcorn.pause();
+ if (this.pause_on_write && !this.media.getPaused()) {
+ this.media.pause();
}
-}
+};
IriSP.Widgets.CreateAnnotation.prototype.onDescriptionChange = function() {
var _field = this.$.find(".Ldt-CreateAnnotation-Description"),
_contents = _field.val();
_field.css("border-color", !!_contents ? "#666666" : "#ff0000");
+ if (!!_contents) {
+ _field.removeClass("empty");
+ } else {
+ _field.addClass("empty");
+ }
this.$.find(".Ldt-CreateAnnotation-TagLi, .Ldt-CreateAnnotation-PolemicLi").each(function() {
- var _rx = IriSP.Model.regexpFromTextOrArray(IriSP.jQuery(this).text().replace(/(^\s+|\s+$)/g,''));
+ var _rx = IriSP.Model.regexpFromTextOrArray(IriSP.jQuery(this).attr("data-text"));
if (_contents.match(_rx)) {
IriSP.jQuery(this).addClass("selected");
} else {
@@ -253,36 +340,51 @@
});
this.pauseOnWrite();
return !!_contents;
-}
+};
IriSP.Widgets.CreateAnnotation.prototype.onTitleChange = function() {
var _field = this.$.find(".Ldt-CreateAnnotation-Title"),
_contents = _field.val();
_field.css("border-color", !!_contents ? "#666666" : "#ff0000");
+ if (!!_contents) {
+ _field.removeClass("empty");
+ } else {
+ _field.addClass("empty");
+ }
this.pauseOnWrite();
return !!_contents;
-}
+};
IriSP.Widgets.CreateAnnotation.prototype.onCreatorChange = function() {
var _field = this.$.find(".Ldt-CreateAnnotation-Creator"),
_contents = _field.val();
_field.css("border-color", !!_contents ? "#666666" : "#ff0000");
+ if (!!_contents) {
+ _field.removeClass("empty");
+ } else {
+ _field.addClass("empty");
+ }
this.pauseOnWrite();
return !!_contents;
-}
+};
/* Fonction effectuant l'envoi des annotations */
IriSP.Widgets.CreateAnnotation.prototype.onSubmit = function() {
/* Si les champs obligatoires sont vides, on annule l'envoi */
if (!this.onDescriptionChange() || (this.show_title_field && !this.onTitleChange()) || (this.show_creator_field && !this.onCreatorChange())) {
- return;
+ return false;
}
- var _exportedAnnotations = new IriSP.Model.List(this.player.sourceManager), /* Création d'une liste d'annotations contenant une annotation afin de l'envoyer au serveur */
+ if (this.recorder) {
+ this.recorder.stopRecord();
+ }
+
+ var _this = this,
+ _exportedAnnotations = new IriSP.Model.List(this.player.sourceManager), /* Création d'une liste d'annotations contenant une annotation afin de l'envoyer au serveur */
_export = this.player.sourceManager.newLocalSource({serializer: IriSP.serializers[this.api_serializer]}), /* Création d'un objet source utilisant un sérialiseur spécifique pour l'export */
_annotation = new IriSP.Model.Annotation(false, _export), /* Création d'une annotation dans cette source avec un ID généré à la volée (param. false) */
- _annotationTypes = this.source.getAnnotationTypes().searchByTitle(this.annotation_type), /* Récupération du type d'annotation dans lequel l'annotation doit être ajoutée */
+ _annotationTypes = this.source.getAnnotationTypes().searchByTitle(this.annotation_type, true), /* Récupération du type d'annotation dans lequel l'annotation doit être ajoutée */
_annotationType = (_annotationTypes.length ? _annotationTypes[0] : new IriSP.Model.AnnotationType(false, _export)), /* Si le Type d'Annotation n'existe pas, il est créé à la volée */
_url = Mustache.to_html(this.api_endpoint_template, {id: this.source.projectId}); /* Génération de l'URL à laquelle l'annotation doit être envoyée, qui doit inclure l'ID du projet */
@@ -298,9 +400,9 @@
* Nous remplissons les données de l'annotation générée à la volée
* ATTENTION: Si nous sommes sur un MASHUP, ces éléments doivent se référer AU MEDIA D'ORIGINE
* */
+ _annotation.setMedia(this.source.currentMedia.id); /* Id du média annoté */
_annotation.setBegin(this.begin); /*Timecode de début */
_annotation.setEnd(this.end); /* Timecode de fin */
- _annotation.setMedia(this.source.currentMedia.id); /* Id du média annoté */
_annotation.setAnnotationType(_annotationType.id); /* Id du type d'annotation */
if (this.show_title_field) {
@@ -309,16 +411,42 @@
}
_annotation.created = new Date(); /* Date de création de l'annotation */
_annotation.description = this.$.find(".Ldt-CreateAnnotation-Description").val(); /* Champ description */
- _annotation.setTags(this.$.find(".Ldt-CreateAnnotation-TagLi.selected")
- .map(function() { return IriSP.jQuery(this).attr("tag-id")})); /*Liste des ids de tags */
-
- /* Les données créateur/date de création sont envoyées non pas dans l'annotation, mais dans le projet */
+
+ var tagIds = Array.prototype.map.call(
+ this.$.find(".Ldt-CreateAnnotation-TagLi.selected"),
+ function(el) { return IriSP.jQuery(el).attr("tag-id")}
+ );
+
+ IriSP._(_annotation.description.match(/#[^\s#.,;]+/g)).each(function(_tt) {
+ var _tag,
+ _tag_title = _tt.replace(/^#/,''),
+ _tags = _this.source.getTags().searchByTitle(_tag_title, true);
+ if (_tags.length) {
+ _tag = _tags[0];
+ } else {
+ _tag = new IriSP.Model.Tag(false, _this.source);
+ _this.source.getTags().push(_tag);
+ _tag.title = _tag_title;
+ }
+ if (tagIds.indexOf(_tag.id) === -1) {
+ tagIds.push(_tag.id);
+ }
+
+ })
+
+ _annotation.setTags(IriSP._(tagIds).uniq()); /*Liste des ids de tags */
+ if (this.audio_url) {
+ _annotation.audio = {
+ src: "mic",
+ mimetype: "audio/mp3",
+ href: this.audio_url
+ };
+ }
if (this.show_creator_field) {
- _export.creator = this.$.find(".Ldt-CreateAnnotation-Creator").val();
+ _annotation.creator = this.$.find(".Ldt-CreateAnnotation-Creator").val();
} else {
- _export.creator = this.creator_name;
+ _annotation.creator = this.creator_name;
}
- _export.created = new Date();
_exportedAnnotations.push(_annotation); /* Ajout de l'annotation à la liste à exporter */
_export.addList("annotation",_exportedAnnotations); /* Ajout de la liste à exporter à l'objet Source */
@@ -336,7 +464,7 @@
function() {
_this.close_after_send
? _this.hide()
- : _this.showScreen("Main");
+ : _this.show();
},
_this.after_send_timeout
);
@@ -344,10 +472,10 @@
_export.getAnnotations().removeElement(_annotation, true); /* Pour éviter les doublons, on supprime l'annotation qui a été envoyée */
_export.deSerialize(_data); /* On désérialise les données reçues pour les réinjecter */
_this.source.merge(_export); /* On récupère les données réimportées dans l'espace global des données */
- if (_this.pause_on_write && _this.player.popcorn.media.paused) {
- _this.player.popcorn.play();
+ if (_this.pause_on_write && _this.media.getPaused()) {
+ _this.media.play();
}
- _this.player.popcorn.trigger("IriSP.AnnotationsList.refresh"); /* On force le rafraîchissement du widget AnnotationsList */
+ _this.player.trigger("AnnotationsList.refresh"); /* On force le rafraîchissement du widget AnnotationsList */
},
error: function(_xhr, _error, _thrown) {
IriSP.log("Error when sending annotation", _thrown);
@@ -362,5 +490,5 @@
this.showScreen('Wait');
return false;
-}
+};
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/src/widgets/DailymotionPlayer.js Thu Jan 02 16:40:25 2014 +0100
@@ -0,0 +1,104 @@
+IriSP.Widgets.DailymotionPlayer = function(player, config) {
+ IriSP.Widgets.Widget.call(this, player, config);
+};
+
+IriSP.Widgets.DailymotionPlayer.prototype = new IriSP.Widgets.Widget();
+
+IriSP.Widgets.DailymotionPlayer.prototype.defaults = {
+ aspect_ratio: 14/9
+};
+
+IriSP.Widgets.DailymotionPlayer.prototype.draw = function() {
+
+ if (typeof this.video === "undefined") {
+ this.video = this.media.video;
+ }
+
+ this.height = this.height || Math.floor(this.width / this.aspect_ratio);
+
+ var _media = this.media,
+ _this = this,
+ _pauseState = true;
+
+ /* Dailymotion utilise un système de fonctions référencées dans
+ * des variables globales pour la gestion des événements.
+ */
+
+ window.onDailymotionPlayerReady = function() {
+
+ var _player = document.getElementById(_this.container);
+
+ _media.getCurrentTime = function() {
+ return new IriSP.Model.Time(1000*_player.getCurrentTime());
+ };
+ _media.getVolume = function() {
+ return _player.getVolume() / 100;
+ };
+ _media.getPaused = function() {
+ return _pauseState;
+ };
+ _media.getMuted = function() {
+ return _player.isMuted();
+ };
+ _media.setCurrentTime = function(_milliseconds) {
+ _seekPause = _pauseState;
+ return _player.seekTo(_milliseconds / 1000);
+ };
+ _media.setVolume = function(_vol) {
+ return _player.setVolume(Math.floor(_vol*100));
+ };
+ _media.mute = function() {
+ return _player.mute();
+ };
+ _media.unmute = function() {
+ return _player.unMute();
+ };
+ _media.play = function() {
+ return _player.playVideo();
+ };
+ _media.pause = function() {
+ return _player.pauseVideo();
+ };
+
+ _player.addEventListener("onStateChange", "onDailymotionStateChange");
+ _player.addEventListener("onVideoProgress", "onDailymotionVideoProgress");
+
+ _player.cueVideoByUrl(_this.video);
+
+ _media.trigger("loadedmetadata");
+ };
+
+ window.onDailymotionStateChange = function(_state) {
+ switch(_state) {
+ case 1:
+ _media.trigger("play");
+ _pauseState = false;
+ break;
+
+ case 2:
+ _media.trigger("pause");
+ _pauseState = true;
+ break;
+
+ case 3:
+ _media.trigger("seeked");
+ break;
+ }
+ };
+
+ window.onDailymotionVideoProgress = function(_progress) {
+ _media.trigger("timeupdate", new IriSP.Model.Time(_progress.mediaTime * 1000));
+ };
+
+ var params = {
+ "allowScriptAccess" : "always",
+ "wmode": "opaque"
+ };
+
+ var atts = {
+ id : this.container
+ };
+
+ swfobject.embedSWF("http://www.dailymotion.com/swf?chromeless=1&enableApi=1", this.container, this.width, this.height, "8", null, null, params, atts);
+
+};
\ No newline at end of file
--- a/src/widgets/HelloWorld.js Thu Aug 30 14:45:23 2012 +0200
+++ b/src/widgets/HelloWorld.js Thu Jan 02 16:40:25 2014 +0100
@@ -7,13 +7,13 @@
IriSP.Widgets.HelloWorld = function(player, config) {
console.log("Calling IriSP.Widget's constructor from IriSP.HelloWorldWidget");
IriSP.Widgets.Widget.call(this, player, config);
-}
+};
IriSP.Widgets.HelloWorld.prototype = new IriSP.Widgets.Widget();
IriSP.Widgets.HelloWorld.prototype.defaults = {
text: "world"
-}
+};
IriSP.Widgets.HelloWorld.prototype.template =
'<div class="Ldt-HelloWorld"><p>{{l10n.Hello}} {{text}}</p><p>Looks like we have {{source.contents.annotation.length}} annotations in this feed</p></div>';
@@ -25,9 +25,9 @@
"en" : {
"Hello" : "Hello,"
}
-}
+};
IriSP.Widgets.HelloWorld.prototype.draw = function() {
this.renderTemplate();
console.log("HelloWorldWidget was drawn");
-}
\ No newline at end of file
+};
\ No newline at end of file
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/src/widgets/HtmlPlayer.js Thu Jan 02 16:40:25 2014 +0100
@@ -0,0 +1,15 @@
+IriSP.Widgets.HtmlPlayer = function(player, config) {
+ IriSP.Widgets.Widget.call(this, player, config);
+};
+
+IriSP.Widgets.HtmlPlayer.prototype = new IriSP.Widgets.Widget();
+
+
+IriSP.Widgets.HtmlPlayer.prototype.defaults = {
+};
+
+IriSP.Widgets.HtmlPlayer.prototype.draw = function() {
+
+ IriSP.htmlPlayer(this.media, this.$, this);
+
+};
\ No newline at end of file
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/src/widgets/JwpPlayer.js Thu Jan 02 16:40:25 2014 +0100
@@ -0,0 +1,122 @@
+IriSP.Widgets.JwpPlayer = function(player, config) {
+ IriSP.Widgets.Widget.call(this, player, config);
+};
+
+IriSP.Widgets.JwpPlayer.prototype = new IriSP.Widgets.Widget();
+
+IriSP.Widgets.JwpPlayer.prototype.defaults = {
+};
+
+IriSP.Widgets.JwpPlayer.prototype.draw = function() {
+
+ var _opts = {},
+ _player = jwplayer(this.$[0]),
+ _seekPause = false,
+ _pauseState = true;
+
+ if (typeof this.video === "undefined") {
+ this.video = this.media.video;
+ }
+
+ _opts.file = this.video;
+ _opts.flashplayer = IriSP.getLib("jwPlayerSWF");
+ _opts.primary = "flash";
+ _opts.fallback = false;
+ _opts.controls = false;
+ _opts.width = this.width;
+ if (this.height) {
+ _opts.height = this.height;
+ }
+
+ if (this.autostart) { // There seems to be an autostart bug
+ //_opts.autostart = true;
+ //_pauseState = false;
+ //this.media.trigger("play");
+ }
+
+ if (this.url_transform) {
+ _opts.file = this.url_transform(_opts.file);
+ }
+
+ // Binding functions to jwplayer
+
+ var _media = this.media;
+
+ _media.on("setcurrenttime", function(_milliseconds) {
+ _seekPause = _pauseState;
+ _player.seek(_milliseconds / 1000);
+ });
+
+ _media.on("setvolume", function(_vol) {
+ _player.setVolume(Math.floor(_vol*100));
+ _media.volume = _vol;
+ });
+
+ _media.on("setmuted", function(_muted) {
+ _player.setMute(_muted);
+ _media.muted = _muted;
+ });
+
+ _media.on("setplay", function() {
+ _player.play(true);
+ _media.paused = false;
+ });
+
+ _media.on("setpause", function() {
+ _player.pause(true);
+ _media.paused = true;
+ });
+
+ // Binding jwplater events to media
+
+ function getVolume() {
+ _media.muted = _player.getMute();
+ _media.volume = _player.getVolume() / 100;
+ }
+
+ _opts.events = {
+ onReady: function() {
+ getVolume();
+ _media.currentTime = new IriSP.Model.Time(1000*_player.getPosition() || 0);
+ _media.trigger("loadedmetadata");
+ },
+ onTime: function(_progress) {
+ if (_seekPause) {
+ _player.pause(true);
+ _seekPause = false;
+ } else {
+ if (_pauseState && _player.getState() === "PLAYING") {
+ _pauseState = false;
+ _media.trigger("play");
+ }
+ }
+ _media.trigger("timeupdate", new IriSP.Model.Time(_progress.position * 1000));
+ },
+ onPlay: function() {
+ if (!_seekPause) {
+ _pauseState = false;
+ _media.trigger("play");
+ }
+ },
+ onPause: function() {
+ _pauseState = true;
+ _media.trigger("pause");
+ },
+ onSeek: function() {
+ _media.trigger("seeked");
+ },
+ onMute: function(_event) {
+ _media.muted = _event.mute;
+ _media.trigger("volumechange");
+ },
+ onVolume: function(_event) {
+ _media.volume = _event.volume / 100;
+ _media.trigger("volumechange");
+ }
+ };
+
+ _player = _player.setup(_opts);
+
+ this.jwplayer = _player;
+
+};
\ No newline at end of file
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/src/widgets/KnowledgeConcierge.css Thu Jan 02 16:40:25 2014 +0100
@@ -0,0 +1,97 @@
+.Ldt-Kc-Slider {
+ width: 100%; height: 8px; margin: 3px 0; font-size: 8px;
+}
+
+.Ldt-Kc-Canvas {
+ border: 1px solid #999999;
+}
+
+.Ldt-Kc-Related {
+ display: none;
+}
+
+.Ldt-Kc-Related-Empty {
+ text-align: center; font-weight: bold; font-style: italic;
+ font-size: 14px; color: #999999; margin: 5px 0;
+}
+
+.Ldt-Kc-Related h2 {
+ border: none;
+ color: #330099;
+ font-size: 18px;
+ margin: 8px 0 2px;
+ padding: 0 5px;
+}
+
+h3.Ldt-Kc-For-Keywords {
+ border-bottom: 1px solid #666666;
+ color: #000000;
+ font-size: 12px;
+ margin: 2px 0 5px;
+ padding: 0 5px 5px;
+ text-align: right;
+}
+
+.Ldt-Kc-Keywords {
+ color: #d000c0; font-weight: bold;
+}
+
+.Ldt-Kc-Related-Item {
+ width: 235px; float: left; margin: 4px 0; padding: 4px 0;
+}
+
+.Ldt-Kc-Related-Item:hover {
+ background: #e8e8e8;
+}
+
+.Ldt-Kc-Related-Item:nth-child(even) {
+ margin-left: 10px;
+}
+
+.Ldt-Kc-Related-Item a {
+ text-decoration: none;
+}
+
+.Ldt-Kc-Related-Item img {
+ max-width: 80px; max-height: 60px; float: left;
+}
+
+.Ldt-Kc-Related-Item h3, .Ldt-Kc-Related-Item p {
+ margin: 0 0 5px 85px;
+}
+
+.Ldt-Kc-Related-Item h3 {
+ font-size: 14px; font-weight: 600;
+}
+
+.Ldt-Kc-Related-Item h3 a {
+ color: #330099;
+}
+
+.Ldt-Kc-Related-Item h3 a:hover {
+ text-decoration: underline;
+}
+
+.Ldt-Kc-Related-Item p {
+ font-size: 12px;
+}
+
+.Ldt-Kc-Item-Duration {
+ color: #c00000;
+}
+
+.Ldt-Kc-Row {
+ border-bottom: 1px solid #CCCCCC;
+ clear: both; float: left; width: 100%;
+}
+
+.Ldt-Kc-Clearer {
+ clear: both;
+}
+
+.Ldt-Kc-Waiting {
+ display: none;
+ height: 128px;
+ width: 100%;
+ background:url(img/loader.gif) center no-repeat;
+}
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/src/widgets/KnowledgeConcierge.js Thu Jan 02 16:40:25 2014 +0100
@@ -0,0 +1,333 @@
+IriSP.Widgets.KnowledgeConcierge = function(player, config) {
+ IriSP.Widgets.Widget.call(this, player, config);
+};
+
+IriSP.Widgets.KnowledgeConcierge.prototype = new IriSP.Widgets.Widget();
+
+IriSP.Widgets.KnowledgeConcierge.prototype.defaults = {
+ width: 600,
+ height: 500,
+ sketch_path: "tmgraph",
+ sketch_files: [ "tmgraph.pde", "physics.pde", "model.pde", "javascript.pde", "menu.pde", "event.pde", "constants.pde", "initialdata.pde"],
+ kc_api_root: "/kn-concierge/",
+ related_api_endpoint: "",
+ use_word_boundaries: false,
+ related_data_type: 'json', // SET TO "jsonp" FOR CROSS-DOMAIN OPERATION
+ related_count: 8,
+};
+
+IriSP.Widgets.KnowledgeConcierge.prototype.messages = {
+ "fr": {
+ related_videos: "Vidéos liées",
+ duration_: "Durée\u00a0:",
+ for_keywords_: "pour le(s) mots-clé(s)\u00a0:",
+ no_matching_videos: "Pas de vidéos correspondantes"
+ },
+ "en": {
+ related_videos: "Related Videos",
+ duration_: "Duration:",
+ for_keywords_: "for keyword(s):",
+ no_matching_videos: "No matching videos"
+ }
+};
+
+IriSP.Widgets.KnowledgeConcierge.prototype.template =
+ '<div class="Ldt-Kc-Slider"></div><canvas class="Ldt-Kc-Canvas" />'
+ + '<div class="Ldt-Kc-Related"><h2>{{ l10n.related_videos }}</h2>'
+ + '<h3 class="Ldt-Kc-For-Keywords">{{l10n.for_keywords_}} <span class="Ldt-Kc-Keywords"></span></h3>'
+ + '<div class="Ldt-Kc-Waiting"></div>'
+ + '<div class="Ldt-Kc-Related-List"></div></div>';
+
+IriSP.Widgets.KnowledgeConcierge.prototype.draw = function() {
+ this.renderTemplate();
+ var _canvasHeight = this.height - 16,
+ _canvasWidth = this.width - 2,
+ _canvas = this.$.find(".Ldt-Kc-Canvas"),
+ _tmpId = IriSP._.uniqueId("Processing-"),
+ _slider = this.$.find(".Ldt-Kc-Slider"),
+ radius = .375 * Math.min(_canvasHeight, _canvasWidth);
+ _canvas.attr({
+ width: _canvasWidth,
+ height: _canvasHeight,
+ id: _tmpId
+ }).css({
+ width: _canvasWidth,
+ height: _canvasHeight
+ });
+ var _this = this,
+ _pjsfiles = IriSP._(this.sketch_files).map(function(_f) { return _this.sketch_path + "/" + _f; }),
+ _selectedText = "",
+ currentNodesList = "",
+ relatedCache = {},
+ relatedRequests = {},
+ relatedTemplate = '<div class="Ldt-Kc-Related-Item"><a href="{{ widget.video_url_base }}{{ media.iri_id }}#keyword={{ escaped_keyword }}"><img src="{{ media.image }}"></a>'
+ + '<h3><a href="{{ widget.video_url_base }}{{ media.iri_id }}#keyword={{ escaped_keyword }}">{{ media.title }}</a></h3><p>{{ description }}</p>'
+ + '<p>{{ widget.l10n.duration_ }} <span class="Ldt-Kc-Item-Duration">{{ duration }}</span></p>'
+ + '</a><div class="Ldt-Kc-Clearer"></div></div>';
+
+ Processing.loadSketchFromSources(_canvas[0],_pjsfiles);
+
+ function renderRelated() {
+ var keywords = currentNodesList;
+ _this.$.find(".Ldt-Kc-Related").show();
+ if (typeof relatedCache[keywords] === "undefined") {
+ return;
+ }
+ _this.$.find(".Ldt-Kc-Waiting").hide();
+ if (relatedCache[keywords].length) {
+ var _html = '<div class="Ldt-Kc-Row">';
+ IriSP._(relatedCache[keywords]).each(function(media, i) {
+ var _tmpldata = {
+ widget: _this,
+ media: media,
+ description: media.description.replace(/(\n|\r|\r\n)/mg,' ').replace(/(^.{120,140})[\s].+$/m,'$1…'),
+ duration: new IriSP.Model.Time(media.duration).toString(),
+ escaped_keyword: encodeURIComponent(keywords.split(",")[0])
+ };
+ _html += Mustache.to_html(relatedTemplate, _tmpldata);
+ if (i % 2) {
+ _html += '</div><div class="Ldt-Kc-Row">';
+ }
+ });
+ _html += '</div>';
+ _this.$.find(".Ldt-Kc-Related-List").html(_html);
+ } else {
+ _this.$.find(".Ldt-Kc-Related-List").html("<p class='Ldt-Kc-Related-Empty'>" + _this.l10n.no_matching_videos + "</p>");
+ }
+ }
+
+ function triggerSearch(text) {
+ if (_selectedText !== text) {
+ _selectedText = text;
+ _this.source.getAnnotations().search(text);
+ }
+ }
+
+ function searchNodes(tags) {
+ var _tlist = (_this.use_word_boundaries ? IriSP._(tags).map(function(t) { return "\\\\y" + t + "\\\\y" }) : tags),
+ _q = "(?i)(" + _tlist.join("|") + ")";
+ jQuery.getJSON(
+ _this.kc_api_root + "topics.jsp",
+ {
+ proj: _this.project_id,
+ q: _q
+ },
+ function(data) {
+ if (data && data.items && data.items.length) {
+ for (var i=0, l=data.items.length; i<l; i++) {
+ var node = data.items[i];
+ if (i == 0) {
+ _pjs.initNode(node.id, node.name, node.grp, node.uid, node.proj);
+ var node = _pjs.findNode(node.id, node.proj);
+ } else {
+ var node = _pjs.newNode(node.id, node.name, node.grp, node.uid, node.proj);
+ node.root = true;
+ node.fix();
+ }
+ _fns.countassoc(node.id, node.proj);
+ if (l > 1) {
+ node.position(Math.floor(radius*Math.sin(2 * Math.PI * i / l)),Math.floor(radius*Math.cos(2 * Math.PI * i / l)));
+ }
+ }
+ }
+ }
+ );
+ }
+
+ function showRelated(nodetexts) {
+ currentNodesList = nodetexts;
+ _this.$.find(".Ldt-Kc-Related-List").html("");
+ _this.$.find(".Ldt-Kc-Keywords").html(nodetexts.replace(/\,/g,", "));
+ if (typeof relatedCache[nodetexts] === "undefined") {
+ _this.$.find(".Ldt-Kc-Waiting").show();
+ if (relatedRequests[nodetexts]) {
+ return;
+ }
+ relatedRequests[nodetexts] = true;
+ IriSP.jQuery.ajax({
+ url: _this.related_api_endpoint,
+ data: {
+ format: _this.related_data_type,
+ keywords: nodetexts
+ },
+ dataType: _this.related_data_type,
+ success: function(data) {
+ relatedCache[nodetexts] = IriSP._(data.objects)
+ .chain()
+ .filter(function(o) {
+ return o.iri_id !== _this.media.id;
+ })
+ .sortBy(function(o) {
+ return - o.score;
+ })
+ .first(_this.related_count)
+ .value();
+ renderRelated();
+ }
+ });
+ } else {
+ renderRelated();
+ }
+ }
+
+ function rootNode(id, proj) {
+ jQuery.getJSON(
+ _this.kc_api_root + "topic.jsp",
+ {
+ id: id,
+ proj: proj
+ },
+ function(response) {
+ if (response != null && response.items.length > 0){
+ item = response.items[0];
+ _pjs.initNode(item.id, item.name, item.grp, item.uid, item.proj);
+ _fns.countassoc(item.id, item.proj);
+ }
+ }
+ );
+ }
+
+ function bindJavascript() {
+ _pjs = Processing.getInstanceById(_tmpId);
+ if (_pjs && typeof _pjs.bindJavascript === "function") {
+ setTimeout(function() {
+ _pjs.bindJavascript(_fns);
+ _pjs.setSize(_canvasWidth,_canvasHeight);
+ var _edit = false,
+ _teamMode = true;
+ _pjs.saveMode("en",false,_teamMode,false,"both",_edit);
+ rootNode(_this.topic_id, _this.project_id);
+ _slider.slider({
+ min: -20,
+ max: 20,
+ value: 0,
+ range: "min",
+ slide: function(event, ui) {
+ _pjs.zoom(Math.exp(ui.value / 10));
+ }
+ });
+ }, 1000);
+ } else {
+ setTimeout(bindJavascript, 1000);
+ }
+ }
+ var currentSelection = null;
+ var _fns = {
+ adjacentnodes: function(id, proj, adj, both) {
+ jQuery.ajax({
+ url: _this.kc_api_root + "associations-bd.jsp",
+ cache: false,
+ data: {
+ id: id,
+ proj: proj,
+ both: both,
+ adj: adj
+ },
+ success: function(response) {
+ if (response.items.length > 0){
+ for(i = 0, end = response.items.length; i < end; i++) {
+ item = response.items[i];
+ _pjs.addEdge(item.asc_id, item.id, item.from_proj, item.to_id, item.to_proj,
+ item.r_name, item.r_from, item.r_to, item.uid, item.proj);
+ _pjs.setNodeName( item.id, item.from_proj,item.name);
+ _pjs.setNodeValue(item.id, item.from_proj,item.name, item.grp, item.abst, item.from_uid);
+ if (item.from_assoc!=null) {
+ _pjs.setNodeAssoc(item.id, item.from_proj, item.from_assoc);
+ }
+ _pjs.setNodeName( item.to_id,item.to_proj, item.to_name);
+ _pjs.setNodeValue(item.to_id,item.to_proj, item.to_name,item.to_grp,item.to_abst,item.to_uid);
+ if (item.to_assoc!=null) {
+ _pjs.setNodeAssoc(item.to_id, item.to_proj, item.to_assoc);
+ }
+ }
+ return response;
+ } else {
+ //.debug('No such topic.');
+ return null;
+ }
+ }
+ });
+ },
+ setscale: function(scl){
+ _slider.slider("value", 10*Math.log(scl));
+ },
+ countassoc: function(id, proj) {
+ jQuery.ajax({
+ url: _this.kc_api_root + "count-assoc.jsp",
+ data: {
+ id: id,
+ proj: proj
+ },
+ success: function(response) {
+ if (response.items.length > 0){
+ for(i = 0, end = response.items.length; i < end; i++) {
+ item = response.items[i];
+ _pjs.setNodeValue(item.id, item.proj, item.name, item.grp, item.abst);
+ if (item.assoc!=null) _pjs.setNodeAssoc(item.id, item.proj, item.assoc);
+ if (item.mass!=null) _pjs.setNodeMass( item.id, item.proj, item.mass);
+ }
+ }
+ }
+ });
+ },
+ username: function() {
+ var nodes = _pjs.getNodes().values().toArray(),
+ nodetexts = IriSP._(nodes).chain().pluck("name").sortBy().value().join(",");
+ showRelated(nodetexts);
+ },
+ mousemove: function(selection) {
+ if (selection !== currentSelection) {
+ if (selection) {
+ triggerSearch(selection.name);
+ }
+ currentSelection = selection;
+ }
+ },
+ click: function(selection) {
+ if (selection) {
+ triggerSearch(selection.name);
+ showRelated(selection.name);
+ } else {
+ triggerSearch();
+ }
+ }
+ };
+ var uselessfuncts = [
+ "selectnode", "selectedge", "topicnode","group_shapes",
+ "allbackup", "allretrieve", "new_topic", "pedia", "set_mode",
+ "new_relation", "startexpand", "endexpand", "new_select" //, "mouseover" //, "username"
+ ];
+
+ IriSP._(uselessfuncts).each(function(funcname) {
+ _fns[funcname] = function() {
+// console.log("Function", funcname, "called with arguments", arguments);
+ }
+ });
+
+ this.getWidgetAnnotations().forEach(function(annotation) {
+ annotation.on("click", function() {
+ var _tags = annotation.getTagTexts();
+ if (_tags.length) {
+ searchNodes(_tags);
+ }
+ });
+ });
+
+ this.source.getTags().forEach(function(tag) {
+ tag.on("click", function() {
+ if (tag.title) {
+ searchNodes([tag.title]);
+ }
+ });
+ });
+
+ var keywmatch = document.location.hash.match(/keyword=([^#?&]+)/);
+ if (keywmatch) {
+ this.player.on("widgets-loaded", function() {
+ triggerSearch(decodeURIComponent(keywmatch[1]));
+ });
+ }
+
+ bindJavascript();
+
+};
--- a/src/widgets/MediaList.js Thu Aug 30 14:45:23 2012 +0200
+++ b/src/widgets/MediaList.js Thu Jan 02 16:40:25 2014 +0100
@@ -7,16 +7,16 @@
IriSP.Widgets.MediaList.prototype.messages = {
"fr": {
- now_playing: "Média en cours",
- all_media: "Tous les medias",
- other_media: "Autres médias"
+ now_playing: "Vidéo en cours",
+ all_media: "Toutes les vidéos",
+ other_media: "Autres vidéos"
},
"en": {
now_playing: "Now playing",
- all_media: "All media",
- other_media: "Other media"
+ all_media: "All videos",
+ other_media: "Other videos"
}
-}
+};
IriSP.Widgets.MediaList.prototype.defaults = {
default_thumbnail : "http://ldt.iri.centrepompidou.fr/static/site/ldt/css/imgs/video_sequence.png",
@@ -49,17 +49,22 @@
var _n = this.refresh(true);
if (this.searchString) {
if (_n) {
- this.player.popcorn.trigger("IriSP.search.matchFound");
+ this.player.trigger("search.matchFound");
} else {
- this.player.popcorn.trigger("IriSP.search.noMatchFound");
+ this.player.trigger("search.noMatchFound");
}
}
-}
+};
IriSP.Widgets.MediaList.prototype.draw = function() {
- this.bindPopcorn("timeupdate","onTimeupdate");
this.$.addClass("Ldt-MediaListWidget")
this.renderTemplate();
+ var _this = this;
+ if (typeof this.media.getMedias === "function") {
+ this.media.on("enter-annotation", function(_a) {
+ _this.redraw(_a.getMedia());
+ });
+ }
this.redraw();
};
@@ -76,9 +81,9 @@
left: _scale * _annotation.begin,
width: _scale * (_annotation.end - _annotation.begin),
color: ( typeof _annotation.color !== "undefined" && _annotation.color ? _annotation.color : _this.default_color )
- }
- })
-}
+ };
+ });
+};
IriSP.Widgets.MediaList.prototype.redraw = function(_media) {
if (typeof _media !== "undefined") {
@@ -116,21 +121,10 @@
title: _media.title,
description: _media.description,
segments: _this.getSegments(_media)
- })
+ });
}).join("");
this.$.find('.Ldt-MediaList-OtherList').html(_html);
} else {
this.$.find('.Ldt-MediaList-Other').hide();
}
};
-
-IriSP.Widgets.MediaList.prototype.onTimeupdate = function() {
- var _media = this.source.currentMedia;
- if (_media.elementType === "mashup") {
- _media = _media.getMediaAtTime(this.player.popcorn.currentTime() * 1000);
- }
- if (typeof _media !== "undefined" && _media.id !== this.lastMedia) {
- this.lastMedia = _media.id;
- this.redraw(_media);
- }
-}
--- a/src/widgets/Mediafragment.js Thu Aug 30 14:45:23 2012 +0200
+++ b/src/widgets/Mediafragment.js Thu Jan 02 16:40:25 2014 +0100
@@ -4,23 +4,33 @@
this.last_hash_value = "";
window.onhashchange = this.functionWrapper("goToHash");
if (typeof window.addEventListener !== "undefined") {
+ var _this = this;
window.addEventListener('message', function(_msg) {
if (/^#/.test(_msg.data)) {
- this.setWindowHash(_msg.data);
+ _this.setWindowHash(_msg.data);
}
- })
+ });
};
- this.bindPopcorn("pause","setHashToTime");
- this.bindPopcorn("seeked","setHashToTime");
- this.bindPopcorn("IriSP.Mediafragment.setHashToAnnotation","setHashToAnnotation");
+ this.onMdpEvent("Mediafragment.setHashToAnnotation","setHashToAnnotation");
this.blocked = false;
-}
+};
IriSP.Widgets.Mediafragment.prototype = new IriSP.Widgets.Widget();
IriSP.Widgets.Mediafragment.prototype.draw = function() {
- this.goToHash();
-}
+ this.onMediaEvent("setpause","setHashToTime");
+ var _this = this;
+ this.getWidgetAnnotations().forEach(function(_annotation) {
+ _annotation.on("click", function() {
+ _this.setHashToAnnotation(_annotation.id);
+ });
+ });
+ if (this.media.loadedMetadata) {
+ this.goToHash();
+ } else {
+ this.onMediaEvent("loadedmetadata","goToHash");
+ }
+};
IriSP.Widgets.Mediafragment.prototype.setWindowHash = function(_hash) {
if (typeof window.history !== "undefined" && typeof window.history.replaceState !== "undefined") {
@@ -28,7 +38,7 @@
} else {
document.location.hash = _hash;
}
-}
+};
IriSP.Widgets.Mediafragment.prototype.getLastHash = function() {
var _tab = document.location.hash.replace(/^#/,'').split('&');
@@ -39,7 +49,7 @@
_tab.push(this.last_hash_key + '=' + this.last_hash_value);
}
return '#' + _tab.join('&');
-}
+};
IriSP.Widgets.Mediafragment.prototype.goToHash = function() {
if (document.location.hash !== this.getLastHash()) {
@@ -52,27 +62,25 @@
if (this.last_hash_key == "id") {
var _annotation = this.source.getElement(this.last_hash_value);
if (typeof _annotation !== "undefined") {
- this.player.popcorn.currentTime(_annotation.begin.getSeconds());
+ this.media.setCurrentTime(_annotation.begin);
}
}
if (this.last_hash_key == "t") {
- this.player.popcorn.currentTime(this.last_hash_value);
+ this.media.setCurrentTime(1000*this.last_hash_value);
}
break;
}
}
}
-}
+};
IriSP.Widgets.Mediafragment.prototype.setHashToAnnotation = function(_annotationId) {
this.setHash( 'id', _annotationId );
-}
+};
-IriSP.Widgets.Mediafragment.prototype.setHashToTime = function(_time) {
- if (_time !== NaN) {
- this.setHash( 't', this.player.popcorn.currentTime() );
- }
-}
+IriSP.Widgets.Mediafragment.prototype.setHashToTime = function() {
+ this.setHash( 't', this.media.getCurrentTime().getSeconds() );
+};
IriSP.Widgets.Mediafragment.prototype.setHash = function(_key, _value) {
if (!this.blocked && (this.last_hash_key !== _key || this.last_hash_value !== _value)) {
@@ -81,11 +89,11 @@
var _hash = this.getLastHash();
this.setWindowHash(_hash);
if (window.parent !== window) {
- window.parent.postMessage(_hash,"*")
+ window.parent.postMessage(_hash,"*");
}
this.block();
}
-}
+};
IriSP.Widgets.Mediafragment.prototype.unblock = function() {
if (typeof this.blockTimeout !== "undefined") {
@@ -93,12 +101,12 @@
}
this.blockTimeout = undefined;
this.blocked = false;
-}
+};
IriSP.Widgets.Mediafragment.prototype.block = function() {
if (typeof this.blockTimeout !== "undefined") {
window.clearTimeout(this.blockTimeout);
}
this.blocked = true;
- this.blockTimeout = window.setTimeout(this.functionWrapper("unblock"), 1000);
-}
+ this.blockTimeout = window.setTimeout(this.functionWrapper("unblock"), 1500);
+};
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/src/widgets/MultiSegments.js Thu Jan 02 16:40:25 2014 +0100
@@ -0,0 +1,136 @@
+IriSP.Widgets.MultiSegments = function(player, config) {
+ IriSP.Widgets.Widget.call(this, player, config);
+};
+
+IriSP.Widgets.MultiSegments.prototype = new IriSP.Widgets.Widget();
+
+IriSP.Widgets.MultiSegments.prototype.defaults = {
+ annotation_show_arrow: true,
+ annotation_start_minimized: false,
+ annotation_show_annotation_type: true,
+ show_all: false
+};
+
+IriSP.Widgets.MultiSegments.prototype.draw = function() {
+ var _this = this,
+ lines = [],
+ currentLine = null,
+ segmentsopts = {},
+ annotationopts = {};
+ IriSP._(this).each(function(_v,_k) {
+ if (/^segments_/.test(_k)) {
+ segmentsopts[_k.replace(/^segments_/,"")] = _v;
+ }
+ if (/^annotation_/.test(_k)) {
+ annotationopts[_k.replace(/^annotation_/,"")] = _v;
+ }
+ });
+ this.source.getAnnotationTypes().forEach(function(_anntype) {
+ var segments = _anntype.getAnnotations().filter(function(_ann) {
+ return _ann.getDuration() > 0;
+ });
+ if (segments.length) {
+
+ var visible = false;
+
+ var line = {
+ segmentWidget: IriSP.jQuery("<div>"),
+ annotationWidget: IriSP.jQuery("<div>"),
+ hasSegmentsNow: function() {
+ var _time = _this.media.getCurrentTime();
+ return !!segments.filter(function(_annotation) {
+ return _annotation.begin <= _time && _annotation.end > _time;
+ }).length;
+ },
+ hide: function() {
+ if (visible) {
+ visible = false;
+ this.annotationWidget.slideUp();
+ }
+ },
+ show: function() {
+ if (!visible) {
+ visible = true;
+ this.annotationWidget.slideDown();
+ }
+ }
+ };
+
+
+ line.segmentWidget
+ .addClass("Ldt-MultiSegments-Segment")
+ .appendTo(_this.$);
+
+ if (!_this.show_all) {
+ line.segmentWidget.mouseenter(function() {
+ if (line.hasSegmentsNow()) {
+ currentLine = line;
+ checkVisibilities();
+ }
+ });
+ }
+
+ line.annotationWidget
+ .addClass("Ldt-MultiSegments-Annotation")
+ .appendTo(_this.$)
+ .hide();
+
+ _this.insertSubwidget(
+ line.segmentWidget,
+ IriSP._({
+ type: "Segments",
+ annotation_type: _anntype,
+ width: _this.width
+ }).extend(segmentsopts)
+ );
+
+ _this.insertSubwidget(
+ line.annotationWidget,
+ IriSP._({
+ type: "Annotation",
+ annotation_type: _anntype,
+ width: _this.width
+ }).extend(annotationopts)
+ );
+
+ lines.push(line);
+ }
+ });
+
+ // open line on segment click
+ $j(document).on("click",".Ldt-Segments-Segment",function(e){
+ if (!_this.show_all && currentLine && !currentLine.hasSegmentsNow()) {
+ currentLine = undefined;
+ }
+ IriSP._(lines).each(function(line) {
+ if($j(e.target).parent().parent()[0]==line.segmentWidget[0]){
+ currentLine = line;
+ line.show();
+ } else {
+ line.hide();
+ }
+ });
+ });
+
+ //var _annotationWidgets = _this.$.find(".Ldt-MultiSegments-Annotation");
+
+ function checkVisibilities(_time) {
+ /*if (!_this.show_all && currentLine && !currentLine.hasSegmentsNow()) {
+ currentLine = undefined;
+ }
+ IriSP._(lines).each(function(line) {
+ if (line.hasSegmentsNow()) {
+ if (!_this.show_all && !currentLine) {
+ currentLine = line;
+ }
+ if (_this.show_all || line === currentLine) {
+ line.show();
+ } else {
+ line.hide();
+ }
+ } else {
+ line.hide();
+ }
+ });*/
+ }
+};
\ No newline at end of file
--- a/src/widgets/Polemic.js Thu Aug 30 14:45:23 2012 +0200
+++ b/src/widgets/Polemic.js Thu Jan 02 16:40:25 2014 +0100
@@ -15,11 +15,12 @@
_to_: " to ",
_annotations: " annotation(s)"
}
-}
+};
+
IriSP.Widgets.Polemic.prototype.defaults = {
element_width : 5,
element_height : 5,
- max_elements : 15,
+ max_elements: 20,
annotation_type : "tweet",
defaultcolor : "#585858",
foundcolor : "#fc00ff",
@@ -47,45 +48,9 @@
]
};
-IriSP.Widgets.Polemic.prototype.onSearch = function(searchString) {
- this.searchString = typeof searchString !== "undefined" ? searchString : '';
- var _found = 0,
- _re = IriSP.Model.regexpFromTextOrArray(searchString, true),
- _this = this;
- this.$tweets.each(function() {
- var _el = IriSP.jQuery(this);
- if (_this.searchString) {
- if (_re.test(_el.attr("tweet-title"))) {
- _el.css({
- "background" : _this.foundcolor,
- "opacity" : 1
- });
- _found++;
- } else {
- _el.css({
- "background" : _el.attr("polemic-color"),
- "opacity" : .3
- });
- }
- } else {
- _el.css({
- "background" : _el.attr("polemic-color"),
- "opacity" : 1
- });
- }
- });
- if (this.searchString) {
- if (_found) {
- this.player.popcorn.trigger("IriSP.search.matchFound");
- } else {
- this.player.popcorn.trigger("IriSP.search.noMatchFound");
- }
- }
-}
-
IriSP.Widgets.Polemic.prototype.draw = function() {
- this.bindPopcorn("timeupdate", "onTimeupdate");
+ this.onMediaEvent("timeupdate", "onTimeupdate");
this.$zone = IriSP.jQuery('<div>');
this.$zone.addClass("Ldt-Polemic");
this.$.append(this.$zone);
@@ -102,6 +67,7 @@
this.$zone.append(this.$elapsed);
+ // we don't filter with null duration anymore
var _slices = [],
_slice_count = Math.floor( this.width / this.element_width ),
_duration = this.source.getDuration(),
@@ -117,10 +83,10 @@
begin : _begin.toString(),
end : _end.toString(),
annotations : _list.filter(function(_annotation) {
- return _annotation.begin >= _begin && _annotation.end < _end;
+ return _annotation.begin >= _begin && _annotation.begin < _end;
}),
polemicStacks : []
- }
+ };
for (var _j = 0; _j < this.polemics.length; _j++) {
var _polemic = _res.annotations.searchByDescription(this.polemics[_j].keywords);
@@ -149,7 +115,7 @@
function displayAnnotation(_elx, _ely, _pol, _col, _annotation) {
var _html = Mustache.to_html(
- '<div class="Ldt-Polemic-TweetDiv Ldt-TraceMe" trace-info="annotation-id:{{id}}, media-id={{media_id}}, polemic={{polemic}}" polemic-color="{{color}}"'
+ '<div class="Ldt-Polemic-TweetDiv Ldt-TraceMe" trace-info="annotation-id:{{id}}, media-id:{{media_id}}, polemic:{{polemic}}, time:{{time}}" polemic-color="{{color}}"'
+ ' tweet-title="{{title}}" annotation-id="{{id}}" style="width: {{width}}px; height: {{height}}px; top: {{top}}px; left: {{left}}px; background: {{color}}"></div>',
{
id: _annotation.id,
@@ -160,7 +126,8 @@
color: _col,
width: (_this.element_width-1),
height: _this.element_height,
- title: _annotation.title
+ title: _annotation.title,
+ time: _annotation.begin.toString()
});
var _el = IriSP.jQuery(_html);
_el.mouseover(function() {
@@ -168,16 +135,34 @@
}).mouseout(function() {
_annotation.trigger("unselect");
}).click(function() {
- _this.player.popcorn.trigger("IriSP.Mediafragment.setHashToAnnotation", _annotation.id);
- _this.player.popcorn.trigger("IriSP.Tweet.show", _annotation.id);
+ _annotation.trigger("click");
+ return false;
});
+ IriSP.attachDndData(_el, {
+ title: _annotation.title,
+ description: _annotation.description,
+ image: _annotation.thumbnail,
+ uri: (typeof _annotation.url !== "undefined"
+ ? _annotation.url
+ : (document.location.href.replace(/#.*$/,'') + '#id=' + _annotation.id))
+ });
+ // test if annotation has several colors.
+ var colAr = [];
+ for (var _j = 0; _j < _this.polemics.length; _j++) {
+ if( IriSP.Model.regexpFromTextOrArray( _this.polemics[_j].keywords ).test( _annotation.title ) ){
+ colAr.push(_this.polemics[_j].color);
+ }
+ }
+ // display annotation
_annotation.on("select", function() {
- _this.tooltip.show(
- Math.floor(_elx + (_this.element_width - 1) / 2),
- _ely,
- _annotation.title,
- _col
- );
+ if (_this.tooltip) {
+ _this.tooltip.show(
+ + Math.floor(_elx + (_this.element_width - 1) / 2),
+ + _ely,
+ _annotation.title,
+ ( (colAr.length>1) ? colAr : _col )
+ );
+ }
_this.$tweets.each(function() {
var _e = IriSP.jQuery(this);
_e.css(
@@ -187,9 +172,23 @@
});
});
_annotation.on("unselect", function() {
- _this.tooltip.hide();
+ if (_this.tooltip) {
+ _this.tooltip.hide();
+ }
_this.$tweets.css("opacity",1);
});
+ _annotation.on("found", function() {
+ _el.css({
+ "background" : _this.foundcolor,
+ "opacity" : 1
+ });
+ });
+ _annotation.on("not-found", function() {
+ _el.css({
+ "background" : _col,
+ "opacity" : .3
+ });
+ });
_this.$zone.append(_el);
}
@@ -214,9 +213,15 @@
this.$tweets = this.$.find(".Ldt-Polemic-TweetDiv");
- this.bindPopcorn("IriSP.search", "onSearch");
- this.bindPopcorn("IriSP.search.closed", "onSearch");
- this.bindPopcorn("IriSP.search.cleared", "onSearch");
+ this.source.getAnnotations().on("search-cleared", function() {
+ _this.$tweets.each(function() {
+ var _el = IriSP.jQuery(this);
+ _el.css({
+ "background" : _el.attr("polemic-color"),
+ "opacity" : 1
+ });
+ });
+ });
} else {
this.$zone.hide();
@@ -257,7 +262,7 @@
IriSP._(_slices).forEach(function(_slice) {
var _y = _this.height,
_nums = _slice.annotations.length + "," + IriSP._(_slice.polemicStacks).map(function(_annotations) {
- return _annotations.length
+ return _annotations.length;
}).join(",");
if (_slice.annotations.length) {
var _h = Math.ceil(_scale * _slice.annotations.length);
@@ -287,15 +292,19 @@
_html = '<p>' + _this.l10n.from_ + _el.attr("begin-time") + _this.l10n._to_ + _el.attr("end-time") + '</p>';
for (var _i = 0; _i <= _this.polemics.length; _i++) {
var _color = _i ? _this.polemics[_i - 1].color : _this.defaultcolor;
- _html += '<div class="Ldt-Tooltip-Color" style="background: ' + _color + '"></div><p>' + _nums[_i] + _this.l10n._annotations + '</p>'
+ _html += '<div class="Ldt-Tooltip-AltColor" style="background: ' + _color + '"></div><p>' + _nums[_i] + _this.l10n._annotations + '</p>';
}
- _this.tooltip.show(_el.attr("pos-x"), _el.attr("pos-y"), _html);
+ if (_this.tooltip) {
+ _this.tooltip.show(+ _el.attr("pos-x"), + _el.attr("pos-y"), _html);
+ }
})
.mouseout(function() {
- _this.tooltip.hide();
- })
+ if (_this.tooltip) {
+ _this.tooltip.hide();
+ }
+ });
- }
+ };
this.$position = IriSP.jQuery('<div>').addClass("Ldt-Polemic-Position");
@@ -303,20 +312,28 @@
this.$zone.click(function(_e) {
var _x = _e.pageX - _this.$zone.offset().left;
- _this.player.popcorn.currentTime(_this.source.getDuration().getSeconds() * _x / _this.width);
+ _this.media.setCurrentTime(_this.media.duration * _x / _this.width);
});
this.$.append('<div class="Ldt-Polemic-Tooltip"></div>');
- this.insertSubwidget(this.$.find(".Ldt-Polemic-Tooltip"), "tooltip", { type: "Tooltip" });
-}
+ this.insertSubwidget(
+ this.$.find(".Ldt-Polemic-Tooltip"),
+ {
+ type: "Tooltip",
+ min_x: 0,
+ max_x: this.width
+ },
+ "tooltip"
+ );
+};
-IriSP.Widgets.Polemic.prototype.onTimeupdate = function() {
- var _x = Math.floor( this.width * this.player.popcorn.currentTime() / this.source.getDuration().getSeconds());
+IriSP.Widgets.Polemic.prototype.onTimeupdate = function(_time) {
+ var _x = Math.floor( this.width * _time / this.media.duration);
this.$elapsed.css({
width: _x + "px"
});
this.$position.css({
left: _x + "px"
- })
-}
+ });
+};
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/src/widgets/PopcornPlayer.js Thu Jan 02 16:40:25 2014 +0100
@@ -0,0 +1,138 @@
+IriSP.Widgets.PopcornPlayer = function(player, config) {
+ IriSP.Widgets.Widget.call(this, player, config);
+};
+
+IriSP.Widgets.PopcornPlayer.prototype = new IriSP.Widgets.Widget();
+
+/* A Popcorn-based player for HTML5 Video, Youtube and Vimeo */
+
+IriSP.Widgets.PopcornPlayer.prototype.defaults = {
+};
+
+IriSP.Widgets.PopcornPlayer.prototype.draw = function() {
+
+
+ if (typeof this.video === "undefined") {
+ this.video = this.media.video;
+ }
+
+ if (this.url_transform) {
+ this.video = this.url_transform(this.video);
+ }
+
+ if (/^(https?:\/\/)?(www\.)?vimeo\.com/.test(this.video)) {
+
+ /* VIMEO */
+
+ var _popcorn = Popcorn.vimeo(this.container, this.video);
+
+ } else if (/^(https?:\/\/)?(www\.)?youtube\.com/.test(this.video)) {
+
+ /* YOUTUBE */
+
+ var _urlparts = this.video.split(/[?&]/),
+ _params = {};
+ for (var i = 1; i < _urlparts.length; i++) {
+ var _ppart = _urlparts[i].split('=');
+ _params[_ppart[0]] = decodeURIComponent(_ppart[1]);
+ }
+ _params.controls = 0;
+ _params.modestbranding = 1;
+ if (this.autostart || this.autoplay) {
+ _params.autoplay = 1;
+ }
+ _url = _urlparts[0] + '?' + IriSP.jQuery.param(_params);
+
+ var _popcorn = Popcorn.youtube(this.container, _url);
+
+ } else {
+
+ /* DEFAULT HTML5 */
+
+ var _tmpId = IriSP._.uniqueId("popcorn"),
+ _videoEl = IriSP.jQuery('<video>');
+ _videoEl.attr({
+ id : _tmpId,
+ width : this.width,
+ height : this.height || undefined
+ });
+ if(typeof this.video === "string"){
+ _videoEl.attr("src",this.video);
+ } else {
+ for (var i = 0; i < this.video.length; i++) {
+ var _srcNode = IriSP.jQuery('<source>');
+ _srcNode.attr({
+ src: this.video[i].src,
+ type: this.video[i].type
+ });
+ _videoEl.append(_srcNode);
+ }
+ }
+ this.$.html(_videoEl);
+ var _popcorn = Popcorn("#" + _tmpId);
+ if (this.autostart || this.autoplay) {
+ _popcorn.autoplay(true);
+ }
+ }
+
+ var _media = this.media;
+
+ // Binding functions to Popcorn
+
+ _media.on("setcurrenttime", function(_milliseconds) {
+ _popcorn.currentTime(_milliseconds / 1000);
+ });
+
+ _media.on("setvolume", function(_vol) {
+ _popcorn.volume(_vol);
+ _media.volume = _vol;
+ });
+
+ _media.on("setmuted", function(_muted) {
+ _popcorn.muted(_muted);
+ _media.muted = _muted;
+ });
+
+ _media.on("setplay", function() {
+ _popcorn.play();
+ });
+
+ _media.on("setpause", function() {
+ _popcorn.pause();
+ });
+
+ // Binding Popcorn events to media
+
+ function getVolume() {
+ _media.muted = _popcorn.muted();
+ _media.volume = _popcorn.volume();
+ }
+
+ _popcorn.on("loadedmetadata", function() {
+ getVolume();
+ _media.trigger("loadedmetadata");
+ _media.trigger("volumechange");
+ });
+
+ _popcorn.on("timeupdate", function() {
+ _media.trigger("timeupdate", new IriSP.Model.Time(1000*_popcorn.currentTime()));
+ });
+
+ _popcorn.on("volumechange", function() {
+ getVolume();
+ _media.trigger("volumechange");
+ });
+
+ _popcorn.on("play", function() {
+ _media.trigger("play");
+ });
+
+ _popcorn.on("pause", function() {
+ _media.trigger("pause");
+ });
+
+ _popcorn.on("seeked", function() {
+ _media.trigger("seeked");
+ });
+
+};
\ No newline at end of file
--- a/src/widgets/Segments.css Thu Aug 30 14:45:23 2012 +0200
+++ b/src/widgets/Segments.css Thu Jan 02 16:40:25 2014 +0100
@@ -2,28 +2,17 @@
* Segments Widget
*/
-.Ldt-Segments-List {
- width: 100%; height: 100%;
-}
-
.Ldt-Segments-Segment {
- position: absolute; height: 100%; opacity: .5; filter:alpha(opacity=50); margin-left: -1px; border-left: 1px solid #ffffff;
-}
-
-.Ldt-Segments-Segment.inactive, .Ldt-Segments-Segment.unfound {
- opacity: .2; filter:alpha(opacity=20);
-}
-
-.Ldt-Segments-Segment.active, .Ldt-Segments-Segment.found {
- opacity: 1; filter:alpha(opacity=100);
+ position: absolute; margin-left: -1px; border: 1px solid #ffffff;
}
.Ldt-Segments-Position {
background: #fc00ff;
position: absolute;
- top: 0;
+ top: -1px;
left: 0;
margin-left: -1px;
width: 2px;
- height: 100%;
+ bottom: -1px;
+ z-index: 80000;
}
\ No newline at end of file
--- a/src/widgets/Segments.js Thu Aug 30 14:45:23 2012 +0200
+++ b/src/widgets/Segments.js Thu Jan 02 16:40:25 2014 +0100
@@ -9,7 +9,11 @@
IriSP.Widgets.Segments.prototype.defaults = {
annotation_type : "chap",
colors: ["#1f77b4","#aec7e8","#ff7f0e","#ffbb78","#2ca02c","#98df8a","#d62728","#ff9896","#9467bd","#c5b0d5","#8c564b","#c49c94","#e377c2","#f7b6d2","#7f7f7f","#c7c7c7","#bcbd22","#dbdb8d","#17becf","#9edae5"],
- height: 10
+ line_height: 8,
+ background: "#e0e0e0",
+ overlap: .25,
+ found_color: "#FF00FC",
+ faded_found_color: "#ff80fc"
};
IriSP.Widgets.Segments.prototype.template =
@@ -18,41 +22,70 @@
+ '<div class="Ldt-Segments-Tooltip"></div>';
IriSP.Widgets.Segments.prototype.annotationTemplate =
- '<div class="Ldt-Segments-Segment Ldt-TraceMe" trace-info="segment-id:{{id}}, media-id:{{media_id}}" segment-text="{{text}}"'
- + 'style="left:{{left}}px; width:{{width}}px; background:{{color}}"></div>'
+ '<div class="Ldt-Segments-Segment Ldt-TraceMe" trace-info="segment-id:{{id}}, media-id:{{media_id}}, from:{{from}}, to:{{to}}" segment-text="{{text}}"'
+ + 'style="top:{{top}}px; height:{{height}}px; left:{{left}}px; width:{{width}}px; background:{{medcolor}}" data-base-color="{{color}}" data-low-color="{{lowcolor}}" data-medium-color="{{medcolor}}"></div>';
IriSP.Widgets.Segments.prototype.draw = function() {
- this.bindPopcorn("IriSP.search", "onSearch");
- this.bindPopcorn("IriSP.search.closed", "onSearch");
- this.bindPopcorn("IriSP.search.cleared", "onSearch");
- this.bindPopcorn("timeupdate", "onTimeupdate");
-
+ this.onMediaEvent("timeupdate", "onTimeupdate");
this.renderTemplate();
- var _list = this.getWidgetAnnotations(),
+ var _list = this.getWidgetAnnotations().filter(function(_ann) {
+ return _ann.getDuration() > 0;
+ }),
_this = this,
- _scale = this.width / this.source.getDuration();
- this.$.css({
- width : this.width + "px",
- height : (this.height - 2) + "px",
- margin : "1px 0"
- });
- this.list_$ = this.$.find('.Ldt-Segments-List');
+ _scale = this.width / this.source.getDuration(),
+ list_$ = this.$.find('.Ldt-Segments-List'),
+ lines = [],
+ zindex = 1,
+ searching = false;
+
+ function saturate(r, g, b, s) {
+ function satcomp(c) {
+ return Math.floor(240 * (1 - s) + c * s);
+ }
+ var res = ( 0x10000 * satcomp(r) + 0x100 * satcomp(g) + satcomp(b)).toString(16);
+ while (res.length < 6) {
+ res = "0" + res;
+ }
+ return "#" + res;
+ }
_list.forEach(function(_annotation, _k) {
var _left = _annotation.begin * _scale,
_width = ( _annotation.getDuration() ) * _scale,
_center = Math.floor( _left + _width / 2 ),
_fulltext = _annotation.title + ( _annotation.description ? ( '<br/>' + _annotation.description ) : '' ),
- _beginseconds = _annotation.begin.getSeconds();
+ line = IriSP._(lines).find(function(line) {
+ return !IriSP._(line.annotations).find(function(a) {
+ return a.begin < _annotation.end && a.end > _annotation.begin;
+ });
+ });
+ if (!line) {
+ line = { index: lines.length, annotations: []};
+ lines.push(line);
+ }
+ line.annotations.push(_annotation);
+ var _top = ((1 - _this.overlap) * line.index) * _this.line_height,
+ color = ( typeof _annotation.color !== "undefined" && _annotation.color ? _annotation.color : _this.colors[_k % _this.colors.length] ),
+ r = parseInt(color.substr(1,2),16),
+ g = parseInt(color.substr(3,2),16),
+ b = parseInt(color.substr(5,2),16),
+ medcolor = saturate(r, g, b, .5),
+ lowcolor = saturate(r, g, b, .2);
var _data = {
- color : ( typeof _annotation.color !== "undefined" && _annotation.color ? _annotation.color : _this.colors[_k % _this.colors.length] ),
+ color : color,
+ medcolor: medcolor,
+ lowcolor: lowcolor,
text: _fulltext.replace(/(\n|\r|\r\n)/mg,' ').replace(/(^.{120,140})[\s].+$/m,'$1…'),
- left : Math.floor( _left ),
- width : Math.floor( _width ),
+ left : _left,
+ width : _width,
+ top: _top,
+ height: _this.line_height - 1,
id : _annotation.id,
- media_id : _annotation.getMedia().id
+ media_id : _annotation.getMedia().id,
+ from: _annotation.begin.toString(),
+ to: _annotation.end.toString()
};
var _html = Mustache.to_html(_this.annotationTemplate, _data),
_el = IriSP.jQuery(_html);
@@ -63,51 +96,80 @@
_annotation.trigger("unselect");
})
.click(function() {
- _this.player.popcorn.currentTime(_beginseconds);
- _this.player.popcorn.trigger("IriSP.Mediafragment.setHashToAnnotation", _data.id);
+ _annotation.trigger("click");
})
- .appendTo(_this.list_$)
+ .appendTo(list_$);
+ IriSP.attachDndData(_el, {
+ title: _annotation.title,
+ description: _annotation.description,
+ uri: (typeof _annotation.url !== "undefined"
+ ? _annotation.url
+ : (document.location.href.replace(/#.*$/,'') + '#id=' + _annotation.id)),
+ image: _annotation.thumbnail
+ });
_annotation.on("select", function() {
- _this.$segments.removeClass("active").addClass("inactive");
- _this.tooltip.show( _center, 0, _data.text, _data.color );
- _el.removeClass("inactive").addClass("active");
+ _this.$segments.each(function() {
+ var _segment = IriSP.jQuery(this);
+ _segment.css({
+ background: _segment.hasClass("found") ? _this.faded_found_color : _segment.attr("data-low-color")
+ });
+ });
+ _el.css({
+ background: _el.hasClass("found") ? _this.found_color: color,
+ "z-index": ++zindex
+ });
+ if (_this.tooltip) {
+ _this.tooltip.show( _center, _top, _data.text, _data.color );
+ }
});
_annotation.on("unselect", function() {
- _this.tooltip.hide();
- _this.$segments.removeClass("inactive active");
+ if (_this.tooltip) {
+ _this.tooltip.hide();
+ }
+ _this.$segments.each(function() {
+ var _segment = IriSP.jQuery(this);
+ _segment.css("background", _segment.hasClass("found") ? _this.found_color : _segment.attr(searching ? "data-low-color" : "data-medium-color"));
+ });
+ });
+ _annotation.on("found", function() {
+ _el.css("background", _this.found_color).addClass("found");
+ });
+ _annotation.on("not-found", function() {
+ _el.css("background", lowcolor).removeClass("found");
});
});
- this.insertSubwidget(this.$.find(".Ldt-Segments-Tooltip"), "tooltip", { type: "Tooltip" });
+
+ this.$.css({
+ width : this.width + "px",
+ height : (((1 - this.overlap) * lines.length + this.overlap) * this.line_height) + "px",
+ background : this.background,
+ margin: "1px 0"
+ });
+ this.insertSubwidget(
+ this.$.find(".Ldt-Segments-Tooltip"),
+ {
+ type: "Tooltip",
+ min_x: 0,
+ max_x: this.width
+ },
+ "tooltip"
+ );
this.$segments = this.$.find('.Ldt-Segments-Segment');
-}
+ this.source.getAnnotations().on("search", function() {
+ searching = true;
+ });
+ this.source.getAnnotations().on("search-cleared", function() {
+ searching = false;
+ _this.$segments.each(function() {
+ var _segment = IriSP.jQuery(this);
+ _segment.css("background", _segment.attr("data-medium-color")).removeClass("found");
+ });
+ });
+};
-IriSP.Widgets.Segments.prototype.onSearch = function(searchString) {
- this.searchString = typeof searchString !== "undefined" ? searchString : '';
- var _found = 0,
- _re = IriSP.Model.regexpFromTextOrArray(searchString, true);
- if (this.searchString) {
- this.$segments.each(function() {
- var _el = IriSP.jQuery(this);
- if (_re.test(_el.attr("segment-text"))) {
- _el.removeClass("unfound").addClass("found");
- _found++;
- } else {
- _el.removeClass("found").addClass("unfound");
- }
- });
- if (_found) {
- this.player.popcorn.trigger("IriSP.search.matchFound");
- } else {
- this.player.popcorn.trigger("IriSP.search.noMatchFound");
- }
- } else {
- this.$segments.removeClass("found unfound");
- }
-}
-
-IriSP.Widgets.Segments.prototype.onTimeupdate = function() {
- var _x = Math.floor( this.width * this.player.popcorn.currentTime() / this.source.getDuration().getSeconds());
+IriSP.Widgets.Segments.prototype.onTimeupdate = function(_time) {
+ var _x = Math.floor( this.width * _time / this.media.duration);
this.$.find('.Ldt-Segments-Position').css({
left: _x + "px"
- })
-}
\ No newline at end of file
+ });
+};
\ No newline at end of file
--- a/src/widgets/Slice.css Thu Aug 30 14:45:23 2012 +0200
+++ b/src/widgets/Slice.css Thu Jan 02 16:40:25 2014 +0100
@@ -1,7 +1,7 @@
/* Slider Widget */
.Ldt-Slice {
- border-radius: 0; border: none; padding: 0; margin: 2px 0 12px; background: #B6B8B8; height: 8px;
+ border-radius: 0; border: none; padding: 0; margin: 12px 0 12px; background: #B6B8B8; height: 8px;
}
.Ldt-Slice .ui-slider-handle {
--- a/src/widgets/Slice.js Thu Aug 30 14:45:23 2012 +0200
+++ b/src/widgets/Slice.js Thu Jan 02 16:40:25 2014 +0100
@@ -10,90 +10,72 @@
IriSP.Widgets.Slice.prototype = new IriSP.Widgets.Widget();
IriSP.Widgets.Slice.prototype.defaults = {
- start_visible : false,
- live_update : true,
- /* Shall the bounds change each time
- the Annotation Widget sends an update (true)
- or only when "show" is triggered (false) ?
- - true is to be recommended when the widget is permanently displayed.
- */
- override_bounds : true
- /* Can the Annotation Widget bounds be overriden ? */
+ show_arrow: false
};
+IriSP.Widgets.Slice.prototype.template =
+ '<div class="Ldt-Slice"></div>'
+ + '{{#show_arrow}}<div class="Ldt-Slice-Arrow"></div>{{/show_arrow}}';
+
IriSP.Widgets.Slice.prototype.draw = function() {
- this.$slider = IriSP.jQuery('<div>')
- .addClass("Ldt-Slice")
+ this.renderTemplate();
+
+ this.$slider = this.$.find(".Ldt-Slice");
- this.$.append(this.$slider);
+ if (this.show_arrow) {
+ this.insertSubwidget(this.$.find(".Ldt-Slice-Arrow"), { type: "Arrow" },"arrow");
+ }
this.min = 0;
- this.max = this.source.getDuration().valueOf();
+ this.max = this.media.duration.valueOf();
var _this = this,
_currentTime;
this.$slider.slider({
range: true,
- values: [0, 0],
+ values: [0, this.max],
min: 0,
max: this.max,
change: function(event, ui) {
- _this.player.popcorn.trigger("IriSP.Arrow.updatePosition",{
- widget:_this.type,
- time:Math.floor((ui.values[0]+ui.values[1])/2)
- });
- _this.player.popcorn.trigger("IriSP.Slice.boundsChanged",[ui.values[0], ui.values[1]]);
+ if (_this.arrow) {
+ _this.arrow.moveToTime((ui.values[0]+ui.values[1])/2);
+ }
+ if (_this.onBoundsChanged) {
+ _this.onBoundsChanged(ui.values[0],ui.values[1]);
+ }
},
start: function() {
_this.sliding = true;
- if (!_this.player.popcorn.media.paused) {
- _this.player.popcorn.pause();
+ if (!_this.media.getPaused()) {
+ _this.media.pause();
}
- _currentTime = _this.player.popcorn.currentTime();
+ _currentTime = _this.media.getCurrentTime();
},
slide: function(event, ui) {
- if (!_this.override_bounds && (ui.value < _this.min || ui.value > _this.max)) {
- return false;
- }
- _this.player.popcorn.currentTime(ui.value / 1000);
+ _this.media.setCurrentTime(ui.value);
},
stop: function() {
_this.sliding = false;
- _this.player.popcorn.currentTime(_currentTime);
+ _this.media.setCurrentTime(_currentTime);
}
});
+
this.$slider.find(".ui-slider-handle:first").addClass("Ldt-Slice-left-handle");
this.$slider.find(".ui-slider-handle:last").addClass("Ldt-Slice-right-handle");
- if (this.start_visible) {
- this.show();
- } else {
- this.hide();
- }
- this.bindPopcorn("IriSP.Slice.show","show");
- this.bindPopcorn("IriSP.Slice.hide","hide");
- this.bindPopcorn("IriSP.Annotation.boundsChanged","storeBounds");
- this.player.popcorn.trigger("IriSP.Annotation.getBounds");
+
+ this.getWidgetAnnotations().forEach(function(_a) {
+ _a.on("enter", function() {
+ _this.$slider.slider("values",[_a.begin, _a.end]);
+ });
+ });
};
IriSP.Widgets.Slice.prototype.show = function() {
this.$slider.show();
- this.player.popcorn.trigger("IriSP.Arrow.takeover",this.type);
- this.$slider.slider("values", [this.min, this.max]);
-}
+};
IriSP.Widgets.Slice.prototype.hide = function() {
this.$slider.hide();
- this.player.popcorn.trigger("IriSP.Arrow.release");
-}
-
-IriSP.Widgets.Slice.prototype.storeBounds = function(_values) {
- if (!this.player.popcorn.media.paused && (this.min != _values[0] || this.max != _values[1])) {
- this.min = _values[0];
- this.max = _values[1];
- if (this.live_update && !this.sliding) {
- this.$slider.slider("values", [this.min, this.max]);
- }
- }
-}
\ No newline at end of file
+};
--- a/src/widgets/Slider.css Thu Aug 30 14:45:23 2012 +0200
+++ b/src/widgets/Slider.css Thu Jan 02 16:40:25 2014 +0100
@@ -12,3 +12,8 @@
background: #747474;
}
+.Ldt-Slider-Time {
+ position: absolute; top: -16px; background: #ffffc0; color: #000000; border-radius: 3px; z-index: 8;
+ font-size: 10px; width: 34px; border: 1px solid #999999; padding: 1px; margin-left: -20px;
+ display: none; text-align: center; font-weight: bold; pointer-events: none;
+}
--- a/src/widgets/Slider.js Thu Aug 30 14:45:23 2012 +0200
+++ b/src/widgets/Slider.js Thu Jan 02 16:40:25 2014 +0100
@@ -10,17 +10,21 @@
IriSP.Widgets.Slider.prototype.defaults = {
minimized_height : 4,
- maximized_height : 10,
+ maximized_height : 4,
minimize_timeout : 1500 /* time before minimizing slider after mouseout,
set to zero for fixed slider */
};
+IriSP.Widgets.Slider.prototype.template =
+ '<div class="Ldt-Slider"></div><div class="Ldt-Slider-Time">00:00</div>';
+
IriSP.Widgets.Slider.prototype.draw = function() {
- this.$slider = IriSP.jQuery('<div>')
- .addClass("Ldt-Slider");
+ this.renderTemplate();
- this.$.append(this.$slider);
+ this.$time = this.$.find(".Ldt-Slider-Time");
+
+ this.$slider = this.$.find(".Ldt-Slider");
var _this = this;
@@ -30,35 +34,42 @@
min: 0,
max: this.source.getDuration().milliseconds,
slide: function(event, ui) {
- _this.player.popcorn.currentTime(ui.value / 1000);
- _this.player.popcorn.trigger("IriSP.Mediafragment.setHashToTime");
+ _this.media.setCurrentTime(ui.value);
+ _this.player.trigger("Mediafragment.setHashToTime");
}
});
this.$handle = this.$slider.find('.ui-slider-handle');
- this.bindPopcorn("timeupdate","onTimeupdate");
- this.bindPopcorn("IriSP.PlayerWidget.MouseOver","onMouseover");
- this.bindPopcorn("IriSP.PlayerWidget.MouseOut","onMouseout");
+ this.onMediaEvent("timeupdate","onTimeupdate");
+ this.onMdpEvent("Player.MouseOver","onMouseover");
+ this.onMdpEvent("Player.MouseOut","onMouseout");
if (this.minimize_timeout) {
this.$slider.css(this.calculateSliderCss(this.minimized_height));
this.$handle.css(this.calculateHandleCss(this.minimized_height));
- this.$
- .mouseover(this.functionWrapper("onMouseover"))
- .mouseout(this.functionWrapper("onMouseout"));
-
this.maximized = false;
this.timeoutId = false;
}
+
+ this.$
+ .mouseover(function() {
+ _this.$time.show();
+ _this.onMouseover();
+ })
+ .mouseout(this.functionWrapper("onMouseout"))
+ .mousemove(function(_e) {
+ var _x = _e.pageX - _this.$.offset().left,
+ _t = new IriSP.Model.Time(_this.media.duration * _x / _this.width);
+ _this.$time.text(_t.toString()).css("left",_x);
+ });
};
-IriSP.Widgets.Slider.prototype.onTimeupdate = function() {
- var _time = 1000 * this.player.popcorn.currentTime();
+IriSP.Widgets.Slider.prototype.onTimeupdate = function(_time) {
this.$slider.slider("value",_time);
- this.player.popcorn.trigger("IriSP.Arrow.updatePosition",{widget: this.type, time: _time});
-}
+ this.player.trigger("Arrow.updatePosition",{widget: this.type, time: _time});
+};
IriSP.Widgets.Slider.prototype.onMouseover = function() {
if (this.minimize_timeout) {
@@ -71,9 +82,10 @@
this.maximized = true;
}
}
-}
+};
IriSP.Widgets.Slider.prototype.onMouseout = function() {
+ this.$time.hide();
if (this.minimize_timeout) {
if (this.timeoutId) {
window.clearTimeout(this.timeoutId);
@@ -88,7 +100,7 @@
_this.timeoutId = false;
}, this.minimize_timeout);
}
-}
+};
IriSP.Widgets.Slider.prototype.animateToHeight = function(_height) {
this.$slider.stop().animate(
@@ -103,19 +115,19 @@
function() {
IriSP.jQuery(this).css("overflow","visible");
});
-}
+};
IriSP.Widgets.Slider.prototype.calculateSliderCss = function(_size) {
return {
height: _size + "px",
"margin-top": (this.minimized_height - _size) + "px"
};
-}
+};
IriSP.Widgets.Slider.prototype.calculateHandleCss = function(_size) {
return {
height: (2 + _size) + "px",
width: (2 + _size) + "px",
"margin-left": -Math.ceil(2 + _size / 2) + "px"
- }
-}
\ No newline at end of file
+ };
+};
\ No newline at end of file
--- a/src/widgets/Slideshare.js Thu Aug 30 14:45:23 2012 +0200
+++ b/src/widgets/Slideshare.js Thu Jan 02 16:40:25 2014 +0100
@@ -2,129 +2,116 @@
IriSP.Widgets.Slideshare = function(player, config) {
IriSP.Widgets.Widget.call(this, player, config);
- this.lastSlide = {
- presentation: "",
- slide: 0
- }
- this.embedObject = null;
- this.oembedCache = {}
-}
+};
IriSP.Widgets.Slideshare.prototype = new IriSP.Widgets.Widget();
IriSP.Widgets.Slideshare.prototype.defaults = {
annotation_type: "slide",
sync: true,
- embed_width: 400,
- embed_height: 300
-}
+};
IriSP.Widgets.Slideshare.prototype.messages = {
fr: {
- slides_ : "Diapositives :"
+ slides_ : "Diapositives"
},
en: {
- slides_ : "Slides:"
+ slides_ : "Slides"
}
-}
+};
IriSP.Widgets.Slideshare.prototype.template =
'<div class="Ldt-SlideShare"><h2>{{l10n.slides_}}</h2><hr /><div class="Ldt-SlideShare-Container"></div></div>';
IriSP.Widgets.Slideshare.prototype.draw = function() {
- var _hide = false;
- if (typeof this.annotation_type !== "undefined" && this.annotation_type) {
- var _annType = this.source.getAnnotationTypes().searchByTitle(this.annotation_type);
- _hide = !_annType.length;
+
+ function insertSlideshare(_presentation, _slide) {
+ if (_lastEmbedded === _presentation) {
+ if (_embedObject && typeof _embedObject.jumpTo === "function") {
+ _embedObject.jumpTo(parseInt(_slide));
+ }
+ } else {
+ _lastEmbedded = _presentation;
+ var _id = IriSP.Model.getUID(),
+ _params = {
+ allowScriptAccess: "always"
+ },
+ _atts = {
+ id: _id
+ },
+ _flashvars = {
+ doc : _presentation,
+ startSlide : _slide
+ };
+ $container.html('<div id="' + _id + '"></div>');
+ swfobject.embedSWF(
+ "http://static.slidesharecdn.com/swf/ssplayer2.swf",
+ _id,
+ _this.embed_width,
+ _this.embed_height,
+ "8",
+ null,
+ _flashvars,
+ _params,
+ _atts
+ );
+ _embedObject = document.getElementById(_id);
+ }
+ $container.show();
}
- if (_hide) {
+
+ var _annotations = this.getWidgetAnnotations();
+ if (!_annotations.length) {
this.$.hide();
} else {
this.renderTemplate();
- this.$container = this.$.find(".Ldt-SlideShare-Container");
- this.bindPopcorn("timeupdate","onTimeupdate");
- this.onTimeupdate();
- }
-}
-
-IriSP.Widgets.Slideshare.prototype.onTimeupdate = function() {
- var _list = this.getWidgetAnnotationsAtTime();
- if (_list.length) {
- var _description = _list[0].description,
- _isurl = /^https?:\/\//.test(_description),
- _presentation = _description.replace(/#.*$/,''),
- _slidematch = _description.match(/(#|\?|&)id=(\d+)/),
- _slide = parseInt(_slidematch && _slidematch.length > 2 ? _slidematch[2] : 1),
- _this = this;
- if (_presentation !== this.lastSlide.presentation) {
- if (_isurl) {
- if (typeof this.oembedCache[_presentation] === "undefined") {
- var _ajaxUrl = "http://www.slideshare.net/api/oembed/1?url="
- + encodeURIComponent(_presentation)
- + "&format=jsonp&callback=?";
- IriSP.jQuery.getJSON(_ajaxUrl, function(_oembedData) {
- var _presmatch = _oembedData.html.match(/doc=([a-z0-9\-_%]+)/i);
- if (_presmatch && _presmatch.length > 1) {
- _this.oembedCache[_presentation] = _presmatch[1];
- _this.insertSlideshare(_presmatch[1], _slide);
+ var _lastPres = "",
+ _embedObject = null,
+ _oembedCache = {},
+ _lastEmbedded = "",
+ _this = this,
+ $container = this.$.find(".Ldt-SlideShare-Container");
+
+ this.embed_width = this.embed_width || $container.innerWidth();
+ this.embed_height = this.embed_height || Math.floor(this.embed_width * 3/4);
+
+ _annotations.forEach(function(_a) {
+ _a.on("leave", function() {
+ $container.hide();
+ _lastPres = "";
+ });
+ _a.on("enter", function() {
+ var _description = _a.description,
+ _isurl = /^https?:\/\//.test(_description),
+ _presentation = _description.replace(/#.*$/,''),
+ _slidematch = _description.match(/(#|\?|&)id=(\d+)/),
+ _slide = parseInt(_slidematch && _slidematch.length > 2 ? _slidematch[2] : 1);
+ if (_presentation !== _lastPres) {
+ if (_isurl) {
+ if (typeof _oembedCache[_presentation] === "undefined") {
+ var _ajaxUrl = "http://www.slideshare.net/api/oembed/1?url="
+ + encodeURIComponent(_presentation)
+ + "&format=jsonp&callback=?";
+ IriSP.jQuery.getJSON(_ajaxUrl, function(_oembedData) {
+ var _presmatch = _oembedData.html.match(/doc=([a-z0-9\-_%]+)/i);
+ if (_presmatch && _presmatch.length > 1) {
+ _oembedCache[_presentation] = _presmatch[1];
+ insertSlideshare(_presmatch[1], _slide);
+ }
+ });
+ } else {
+ insertSlideshare(_oembedCache[_presentation], _slide);
}
- });
- } else {
- this.insertSlideshare(this.oembedCache[_presentation], _slide);
+ } else {
+ insertSlideshare(_presentation, _slide);
+ }
}
- } else {
- this.insertSlideshare(_presentation, _slide);
- }
- }
- if (_slide != this.lastSlide.slide && this.sync && this.embedObject && typeof this.embedObject.jumpTo === "function") {
- this.embedObject.jumpTo(parseInt(_slide));
- }
- this.lastSlide = {
- presentation: _presentation,
- slide: _slide
- }
- } else {
- if (this.lastSlide.presentation) {
- this.$container.hide();
- this.lastSlide = {
- presentation: "",
- slide: 0
- }
- }
+ if (_this.sync && _embedObject && typeof _embedObject.jumpTo === "function") {
+ _embedObject.jumpTo(parseInt(_slide));
+ }
+ _lastPres = _presentation;
+
+ });
+ });
}
-}
-
-IriSP.Widgets.Slideshare.prototype.insertSlideshare = function(_presentation, _slide) {
- if (this.lastEmbedded === _presentation) {
- if (this.embedObject && typeof this.embedObject.jumpTo === "function") {
- this.embedObject.jumpTo(parseInt(_slide));
- }
- } else {
- this.lastEmbedded = _presentation;
- var _id = IriSP.Model.getUID(),
- _params = {
- allowScriptAccess: "always"
- }
- _atts = {
- id: _id
- },
- _flashvars = {
- doc : _presentation,
- startSlide : _slide
- };
- this.$container.html('<div id="' + _id + '"></div>');
- swfobject.embedSWF(
- "http://static.slidesharecdn.com/swf/ssplayer2.swf",
- _id,
- this.embed_width,
- this.embed_height,
- "8",
- null,
- _flashvars,
- _params,
- _atts
- );
- this.embedObject = document.getElementById(_id);
- }
- this.$container.show();
-}
+};
--- a/src/widgets/Social.js Thu Aug 30 14:45:23 2012 +0200
+++ b/src/widgets/Social.js Thu Jan 02 16:40:25 2014 +0100
@@ -3,7 +3,7 @@
IriSP.Widgets.Social = function(player, config) {
IriSP.Widgets.Widget.call(this, player, config);
ZeroClipboard.setMoviePath( IriSP.getLib('zeroClipboardSwf') );
-}
+};
IriSP.Widgets.Social.prototype = new IriSP.Widgets.Widget();
@@ -15,14 +15,14 @@
show_fb: true,
show_gplus: true,
show_mail: true
-}
+};
IriSP.Widgets.Social.prototype.template =
- '<span class="Ldt-Social">{{#show_url}}<div class="Ldt-Social-Url-Container"><a href="#" target="_blank" class="Ldt-Social-Square Ldt-Social-Url Ldt-TraceMe" title="{{l10n.share_link}}">'
+ '<span class="Ldt-Social">{{#show_url}}<div class="Ldt-Social-Url-Container"><a href="#" draggable="true" target="_blank" class="Ldt-Social-Square Ldt-Social-Url Ldt-TraceMe" title="{{l10n.share_link}}">'
+ '</a><div class="Ldt-Social-UrlPop"><input class="Ldt-Social-Input"/><div class="Ldt-Social-CopyBtn">{{l10n.copy}}</div></div></div>{{/show_url}}'
- + '{{#show_fb}}<a href="#" target="_blank" class="Ldt-Social-Fb Ldt-TraceMe" title="{{l10n.share_on}} Facebook"></a>{{/show_fb}}'
- + '{{#show_twitter}}<a href="#" target="_blank" class="Ldt-Social-Twitter Ldt-TraceMe" title="{{l10n.share_on}} Twitter"></a>{{/show_twitter}}'
- + '{{#show_gplus}}<a href="#" target="_blank" class="Ldt-Social-Gplus Ldt-TraceMe" title="{{l10n.share_on}} Google+"></a>{{/show_gplus}}'
+ + '{{#show_fb}}<a href="#" target="_blank" class="Ldt-Social-Fb Ldt-Social-Ext Ldt-TraceMe" title="{{l10n.share_on}} Facebook"></a>{{/show_fb}}'
+ + '{{#show_twitter}}<a href="#" target="_blank" class="Ldt-Social-Twitter Ldt-Social-Ext Ldt-TraceMe" title="{{l10n.share_on}} Twitter"></a>{{/show_twitter}}'
+ + '{{#show_gplus}}<a href="#" target="_blank" class="Ldt-Social-Gplus Ldt-Social-Ext Ldt-TraceMe" title="{{l10n.share_on}} Google+"></a>{{/show_gplus}}'
+ '{{#show_mail}}<a href="#" target="_blank" class="Ldt-Social-Mail Ldt-TraceMe" title="{{l10n.share_mail}}"></a>{{/show_mail}}</span>';
IriSP.Widgets.Social.prototype.messages = {
@@ -38,7 +38,7 @@
share_link: "Share hypertext link",
copy: "Copy"
}
-}
+};
IriSP.Widgets.Social.prototype.draw = function() {
this.renderTemplate();
@@ -48,12 +48,22 @@
this.$.find(".Ldt-Social-Url").click(function() {
_this.toggleCopy();
return false;
+ }).on("dragstart", function(e) {
+ e.originalEvent.dataTransfer.setData("text/x-iri-title",_this.text);
+ e.originalEvent.dataTransfer.setData("text/x-iri-uri",_this.url);
});
this.$.find(".Ldt-Social-Input").focus(function() {
this.select();
});
+ this.$.find(".Ldt-Social-Ext").click(function() {
+ window.open(
+ IriSP.jQuery(this).attr("href"),
+ "_blank",
+ "height=300,width=450,left=100,top=100,toolbar=0,menubar=0,status=0,location=0");
+ return false;
+ });
this.updateUrls(this.url, this.text);
-}
+};
IriSP.Widgets.Social.prototype.toggleCopy = function() {
var _pop = this.$.find(".Ldt-Social-UrlPop");
@@ -75,13 +85,13 @@
} else {
this.clip.hide();
}
-}
+};
IriSP.Widgets.Social.prototype.updateUrls = function(_url, _text) {
this.url = _url;
this.text = _text;
this.$.find(".Ldt-Social-Fb").attr("href", "http://www.facebook.com/share.php?" + IriSP.jQuery.param({ u: _url, t: _text }));
this.$.find(".Ldt-Social-Twitter").attr("href", "https://twitter.com/intent/tweet?" + IriSP.jQuery.param({ url: _url, text: _text }));
- this.$.find(".Ldt-Social-Gplus").attr("href", "https://plusone.google.com/_/+1/confirm?" + IriSP.jQuery.param({ url: _url, title: _text }));
+ this.$.find(".Ldt-Social-Gplus").attr("href", "https://plus.google.com/share?" + IriSP.jQuery.param({ url: _url, title: _text }));
this.$.find(".Ldt-Social-Mail").attr("href", "mailto:?" + IriSP.jQuery.param({ subject: _text, body: _text + ": " + _url }));
-}
+};
--- a/src/widgets/Sparkline.js Thu Aug 30 14:45:23 2012 +0200
+++ b/src/widgets/Sparkline.js Thu Jan 02 16:40:25 2014 +0100
@@ -1,6 +1,5 @@
IriSP.Widgets.Sparkline = function(player, config) {
IriSP.Widgets.Widget.call(this, player, config);
- //this.bindPopcorn("timeupdate", "onTimeupdate");
};
IriSP.Widgets.Sparkline.prototype = new IriSP.Widgets.Widget();
@@ -19,15 +18,22 @@
_duration = this.source.getDuration(),
_max = 0,
_list = this.getWidgetAnnotations();
-
for (var _i = 0; _i < this.slice_count; _i++) {
- var _begin = new IriSP.Model.Time(_i*_duration/this.slice_count),
- _end = new IriSP.Model.Time((_i+1)*_duration/this.slice_count),
- _annotations = _list.filter(function(_annotation) {
- return _annotation.begin >= _begin && _annotation.end < _end;
- }).length;
- _max = Math.max(_max, _annotations);
- _slices.push(_annotations);
+ var _begin = (_i*_duration/this.slice_count),
+ _end = ((_i+1)*_duration/this.slice_count),
+ _volume = 0;
+ _list.forEach(function(_annotation) {
+ if (_annotation.begin < _end && _annotation.end >= _begin) {
+ var _d = _annotation.getDuration().milliseconds;
+ if (!_d) {
+ _volume += 1;
+ } else {
+ _volume += (Math.min(_annotation.end, _end) - Math.max(_annotation.begin, _begin)) / _d;
+ }
+ }
+ });
+ _max = Math.max(_max, _volume);
+ _slices.push(_volume);
}
if (!_max) {
return;
@@ -42,7 +48,7 @@
_d = IriSP._(_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 )
+ : 'M0 ' + _v + 'L' + (.5*_width) + ' ' + _v );
},'') + 'L' + this.width + ' ' + _y[_y.length - 1],
_d2 = _d + 'L' + this.width + ' ' + this.height + 'L0 ' + this.height;
@@ -68,18 +74,18 @@
this.$.click(function(_e) {
var _x = _e.pageX - _this.$.offset().left;
- _this.player.popcorn.currentTime(_this.source.getDuration().getSeconds() * _x / _this.width);
+ _this.media.setCurrentTime(_this.media.duration * _x / _this.width);
});
- this.bindPopcorn("timeupdate","onTimeupdate");
-}
+ this.onMediaEvent("timeupdate","onTimeupdate");
+};
-IriSP.Widgets.Sparkline.prototype.onTimeupdate = function() {
- var _x = Math.floor( this.width * this.player.popcorn.currentTime() / this.source.getDuration().getSeconds());
+IriSP.Widgets.Sparkline.prototype.onTimeupdate = function(_time) {
+ var _x = Math.floor( this.width * _time / this.media.duration);
this.rectangleProgress.attr({
"width" : _x
});
this.ligneProgress.attr({
"path" : "M" + _x + " 0L" + _x + " " + this.height
});
-}
+};
--- a/src/widgets/Tagcloud.js Thu Aug 30 14:45:23 2012 +0200
+++ b/src/widgets/Tagcloud.js Thu Jan 02 16:40:25 2014 +0100
@@ -1,7 +1,7 @@
IriSP.Widgets.Tagcloud = function(player, config) {
IriSP.Widgets.Widget.call(this, player, config);
this.stopwords = IriSP._.uniq([].concat(this.custom_stopwords).concat(this.stopword_lists[this.stopword_language]));
-}
+};
IriSP.Widgets.Tagcloud.prototype = new IriSP.Widgets.Widget();
@@ -22,7 +22,7 @@
segment_annotation_type: false,
min_font_size: 10,
max_font_size: 26
-}
+};
IriSP.Widgets.Tagcloud.prototype.stopword_lists = {
"fr" : [
@@ -36,45 +36,33 @@
'get', 'here', 'http', 'like', 'more', 'one', 'our', 'she', 'that', 'the', 'their', 'then', 'there',
'they', 'this', 'very', 'what', 'when', 'where', 'who', 'why', 'will', 'with', 'www', 'you', 'your'
]
-}
+};
IriSP.Widgets.Tagcloud.prototype.draw = function() {
- this.bindPopcorn("IriSP.search", "onSearch");
- this.bindPopcorn("IriSP.search.closed", "onSearch");
- this.bindPopcorn("IriSP.search.cleared", "onSearch");
if (this.segment_annotation_type) {
- this.bindPopcorn("timeupdate","onTimeupdate");
+ var _this = this;
+ this.source.getAnnotationsByTypeTitle(this.segment_annotation_type).forEach(function(_a) {
+ _a.on("enter", function() {
+ _this.redraw(_a.begin, _a.end);
+ });
+ });
} else {
this.redraw();
}
-}
+};
-IriSP.Widgets.Tagcloud.prototype.onTimeupdate = function() {
- var _time = Math.floor(this.player.popcorn.currentTime() * 1000),
- _list = this.source.getAnnotationsByTypeTitle(this.segment_annotation_type).filter(function(_annotation) {
- return _annotation.begin <= _time && _annotation.end > _time;
- });
- if (_list.length) {
- if (_list[0].begin !== this.begin_time || _list[0].end !== this.end_time) {
- this.begin_time = _list[0].begin;
- this.end_time = _list[0].end;
- this.redraw();
- }
- }
-}
-
-IriSP.Widgets.Tagcloud.prototype.redraw = function() {
+IriSP.Widgets.Tagcloud.prototype.redraw = function(_from, _to) {
var _urlRegExp = /https?:\/\/[0-9a-zA-Z\.%\/-_]+/g,
_regexpword = /[^\s\.&;,'"!\?\d\(\)\+\[\]\\\…\-«»:\/]{3,}/g,
_words = {},
_this = this,
_annotations = this.getWidgetAnnotations();
- if (typeof this.begin_time !== "undefined" && typeof this.end_time !== "undefined") {
+ if (typeof _from !== "undefined" && typeof _to !== "undefined") {
_annotations = _annotations.filter(function(_annotation) {
- return _annotation.begin >= _this.begin_time && _annotation.end <= _this.end_time;
- })
+ return _annotation.begin >= _from && _annotation.end <= _to;
+ });
}
_annotations.forEach(function(_annotation) {
@@ -88,7 +76,7 @@
if (IriSP._(_this.stopwords).indexOf(_word) == -1 && (!_this.exclude_pattern || !_this.exclude_pattern.test(_word))) {
_words[_word] = 1 + (_words[_word] || 0);
}
- })
+ });
});
_words = IriSP._(_words)
.chain()
@@ -96,7 +84,7 @@
return {
"word" : _k,
"count" : _v
- }
+ };
})
.filter(function(_v) {
return _v.count > 2;
@@ -117,10 +105,11 @@
this.$.html(Mustache.to_html(this.template, {words: _words }));
this.$.find(".Ldt-Tagcloud-item").click(function() {
var _txt = IriSP.jQuery(this).attr("content");
- _this.player.popcorn.trigger("IriSP.search.triggeredSearch", _txt);
+ _this.source.getAnnotations().search(_txt);
});
-
-}
+ this.source.getAnnotations().on("search", this.functionWrapper("onSearch"));
+ this.source.getAnnotations().on("search-cleared", this.functionWrapper("onSearch"));
+};
IriSP.Widgets.Tagcloud.prototype.onSearch = function(searchString) {
searchString = typeof searchString !== "undefined" ? searchString : '';
@@ -136,4 +125,4 @@
_el.html(_txt);
}
});
-}
+};
--- a/src/widgets/Tooltip.css Thu Aug 30 14:45:23 2012 +0200
+++ b/src/widgets/Tooltip.css Thu Jan 02 16:40:25 2014 +0100
@@ -1,31 +1,123 @@
-/* ToolTip Widget */
+.Ldt-Tooltip {
+ position: absolute;
+ height: 0; width: 0;
+ z-index: 100000;
+}
+
+.Ldt-Tooltip-Main {
+ position: absolute; bottom: 0; left: -96px;
+}
+
+.Ldt-Tooltip-Corner-NW,
+.Ldt-Tooltip-Corner-NE,
+.Ldt-Tooltip-Corner-SW,
+.Ldt-Tooltip-Corner-SE {
+ position: absolute; width: 6px; height: 6px; background: url(img/tooltip-corners.png);
+}
+
+.Ldt-Tooltip-Corner-NW,
+.Ldt-Tooltip-Corner-SW {
+ left: 0;
+}
+
+.Ldt-Tooltip-Corner-NE,
+.Ldt-Tooltip-Corner-SE {
+ right: 0;
+}
+
+.Ldt-Tooltip-Corner-NW,
+.Ldt-Tooltip-Corner-NE {
+ top: 0;
+}
+
+.Ldt-Tooltip-Corner-SW,
+.Ldt-Tooltip-Corner-SE {
+ bottom: 10px;
+}
+
+.Ldt-Tooltip-Corner-NW {
+ background-position: top left;
+}
+
+.Ldt-Tooltip-Corner-NE {
+ background-position: top right;
+}
-.Ldt-Tooltip {
- position: absolute;
- z-index: 10000000000;
- background: transparent url("img/white_arrow_long.png");
- font-size: 12px;
- padding: 15px 15px 20px;
- color: black;
- font-family: Arial, Helvetica, sans-serif;
- overflow:hidden;
+.Ldt-Tooltip-Corner-SW {
+ background-position: bottom left;
+}
+
+.Ldt-Tooltip-Corner-SE {
+ background-position: bottom right;
+}
+
+.Ldt-Tooltip-Border-Top,
+.Ldt-Tooltip-Border-SW,
+.Ldt-Tooltip-Border-SE {
+ position: absolute; height: 6px; background: url(img/tooltip-h-borders.png);
+}
+
+.Ldt-Tooltip-Border-Top {
+ left: 6px; right: 6px;
+}
+
+.Ldt-Tooltip-Border-SW,
+.Ldt-Tooltip-Border-SE {
+ bottom: 10px; background-position: bottom;
+}
+
+.Ldt-Tooltip-Border-SW {
+ left: 6px;
+}
+
+.Ldt-Tooltip-Border-SE {
+ right: 6px;
+}
+
+.Ldt-Tooltip-Tip {
+ position: absolute; height: 16px; width: 22px;
+ background: url(img/tooltip-tip.png);
+ bottom: 0;
+}
+
+.Ldt-Tooltip-Border-Left,
+.Ldt-Tooltip-Border-Right {
+ position: absolute; width: 6px; background: url(img/tooltip-v-borders.png);
+ top: 6px; bottom: 16px;
+}
+
+.Ldt-Tooltip-Border-Left {
+ left: 0; background-position: left;
+}
+
+.Ldt-Tooltip-Border-Right {
+ right: 0; background-position: right;
}
.Ldt-Tooltip-Inner {
- height: 115px;
+ min-height: 30px;
+ max-height: 140px;
width: 180px;
overflow: hidden;
+ margin: 6px 6px 16px;
+ background: url(img/tooltip-gradient.png) bottom;
}
+
.Ldt-Tooltip-Color {
- float: left; margin: 2px 4px 2px 0; width: 10px; height: 10px;
+ float: left; margin: 8px 2px 2px 8px; width: 10px; height: 10px;
+}
+
+.Ldt-Tooltip-AltColor {
+ float: left; margin: 2px 2px 2px 3px; width: 10px; height: 10px;
}
.Ldt-Tooltip img {
- max-width: 140px; max-height: 70px; margin: 0 20px;
+ max-width: 140px; max-height: 80px; margin: 2px 20px;
}
.Ldt-Tooltip p {
- margin: 2px 0;
- font-size: 12px;
-}
+ margin: 6px 8px;
+ font-size: 12px;
+ line-height: 14px;
+}
\ No newline at end of file
--- a/src/widgets/Tooltip.js Thu Aug 30 14:45:23 2012 +0200
+++ b/src/widgets/Tooltip.js Thu Jan 02 16:40:25 2014 +0100
@@ -1,21 +1,39 @@
/* this widget displays a small tooltip */
-IriSP.Widgets.Tooltip = function(Popcorn, config, Serializer) {
- IriSP.Widgets.Widget.call(this, Popcorn, config, Serializer);
+IriSP.Widgets.Tooltip = function(player, config) {
+ IriSP.Widgets.Widget.call(this, player, config);
};
IriSP.Widgets.Tooltip.prototype = new IriSP.Widgets.Widget();
-IriSP.Widgets.Tooltip.prototype.template = '<div class="Ldt-Tooltip"><div class="Ldt-Tooltip-Inner"><div class="Ldt-Tooltip-Color"></div><div class="Ldt-Tooltip-Text"></div></div></div>';
+IriSP.Widgets.Tooltip.prototype.defaults = {
+
+};
+
+IriSP.Widgets.Tooltip.prototype.template =
+ '<div class="Ldt-Tooltip"><div class="Ldt-Tooltip-Main"><div class="Ldt-Tooltip-Corner-NW"></div>'
+ + '<div class="Ldt-Tooltip-Border-Top"></div><div class="Ldt-Tooltip-Corner-NE"></div>'
+ + '<div class="Ldt-Tooltip-Border-Left"></div><div class="Ldt-Tooltip-Border-Right"></div>'
+ + '<div class="Ldt-Tooltip-Corner-SW"></div><div class="Ldt-Tooltip-Border-SW"></div>'
+ + '<div class="Ldt-Tooltip-Tip"></div><div class="Ldt-Tooltip-Border-SE"></div>'
+ + '<div class="Ldt-Tooltip-Corner-SE"></div><div class="Ldt-Tooltip-Inner">'
+ + '<div class="Ldt-Tooltip-Color"></div><p class="Ldt-Tooltip-Text"></p></div></div></div>';
IriSP.Widgets.Tooltip.prototype.draw = function() {
_this = this;
- this.$.html(this.template);
+ this.renderTemplate();
this.$.parent().css({
"position" : "relative"
});
- this.$tip = this.$.find(".Ldt-Tooltip");
+ this.$tooltip = this.$.find(".Ldt-Tooltip");
+ this.$tip = this.$.find(".Ldt-Tooltip-Tip");
+ this.$sw = this.$.find(".Ldt-Tooltip-Border-SW");
+ this.$se = this.$.find(".Ldt-Tooltip-Border-SE");
+ this.__halfWidth = Math.floor(( this.$.find(".Ldt-Tooltip-Main").width() || 192)/2);
+ this.__borderWidth = this.$.find(".Ldt-Tooltip-Border-Left").width();
+ this.__tipDelta = this.__halfWidth - Math.floor(this.$tip.width()/2);
+ this.__maxShift = this.__tipDelta - this.__borderWidth;
this.$.mouseover(function() {
- _this.$tip.hide();
+ _this.$tooltip.hide();
});
this.hide();
};
@@ -23,20 +41,54 @@
IriSP.Widgets.Tooltip.prototype.show = function(x, y, text, color) {
if (typeof color !== "undefined") {
- this.$.find(".Ldt-Tooltip-Color").show().css("background-color", color);
+ // one color or array of colors
+ if (typeof color === "string") {
+ this.$.find(".Ldt-Tooltip-Color").html("");
+ this.$.find(".Ldt-Tooltip-Color").show().css("background-color", color);
+ this.$.find(".Ldt-Tooltip-Color").show().css("height", "");
+ }
+ else{
+ var d = this.$.find(".Ldt-Tooltip-Color");
+ d.html("");
+ d.show();
+ for(var i=0; i<color.length; i++){
+ d.append('<div style="float: left; height: 10px; width: 10px; background-color: ' + color[i] + '">')
+ }
+ this.$.find(".Ldt-Tooltip-Color").css("height", (color.length * 10) + "px");
+ }
} else {
this.$.find(".Ldt-Tooltip-Color").hide();
}
this.$.find(".Ldt-Tooltip-Text").html(text);
- this.$tip.show();
+ this.$tooltip.show();
+
+ var shift = 0;
+
+ if (typeof this.min_x !== "undefined" && (x - this.__halfWidth < this.min_x)) {
+ shift = Math.max(x - this.__halfWidth - this.min_x, - this.__maxShift);
+ }
+
+ if (typeof this.max_x !== "undefined" && (+x + this.__halfWidth > this.max_x)) {
+ shift = Math.min(+ x + this.__halfWidth - this.max_x, this.__maxShift);
+ }
+
+ this.$tooltip.css({
+ "left" : (x - shift) + "px",
+ "top" : y + "px"
+ });
this.$tip.css({
- "left" : Math.floor(x - this.$tip.outerWidth() / 2) + "px",
- "top" : Math.floor(y - this.$tip.outerHeight()) + "px"
+ "left": (this.__tipDelta + shift) + "px"
+ });
+ this.$sw.css({
+ "width": (this.__tipDelta + shift - this.__borderWidth) + "px"
+ });
+ this.$se.css({
+ "width": (this.__tipDelta - shift - this.__borderWidth) + "px"
});
};
IriSP.Widgets.Tooltip.prototype.hide = function() {
- this.$tip.hide();
+ this.$tooltip.hide();
};
--- a/src/widgets/Trace.js Thu Aug 30 14:45:23 2012 +0200
+++ b/src/widgets/Trace.js Thu Jan 02 16:40:25 2014 +0100
@@ -1,7 +1,7 @@
IriSP.Widgets.Trace = function(player, config) {
IriSP.Widgets.Widget.call(this, player, config);
-}
+};
IriSP.Widgets.Trace.prototype = new IriSP.Widgets.Widget();
@@ -13,40 +13,45 @@
default_subject: "IRI",
tracer: null,
extend: false
-}
+};
IriSP.Widgets.Trace.prototype.draw = function() {
- this.lastEvent = "";
if (typeof window.tracemanager === "undefined") {
console.log("Tracemanager not found");
return;
}
var _this = this,
- _listeners = {
- "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,
+ _medialisteners = {
"play" : 0,
"pause" : 0,
"volumechange" : 0,
"seeked" : 0,
"play" : 0,
"pause" : 0,
- "timeupdate" : 2000
+ "timeupdate" : 10000
+ },
+ _annlisteners = {
+ search: 0,
+ "search-cleared": 0
};
- IriSP._(_listeners).each(function(_ms, _listener) {
+ IriSP._(_medialisteners).each(function(_ms, _listener) {
var _f = function(_arg) {
_this.eventHandler(_listener, _arg);
- }
+ };
if (_ms) {
_f = IriSP._.throttle(_f, _ms);
}
- _this.player.popcorn.listen(_listener, _f);
+ _this.media.on(_listener, _f);
+ });
+ var _annotations = this.source.getAnnotations();
+ IriSP._(_annlisteners).each(function(_ms, _listener) {
+ var _f = function(_arg) {
+ _this.eventHandler(_listener, _arg);
+ };
+ if (_ms) {
+ _f = IriSP._.throttle(_f, _ms);
+ }
+ _annotations.on(_listener, _f);
});
if (!this.tracer) {
@@ -60,92 +65,61 @@
}
+
+
this.tracer.trace("TraceWidgetInit", {});
this.mouseLocation = '';
- IriSP.jQuery(".Ldt-Widget").bind("click mouseover mouseout", function(_e) {
- var _target = IriSP.jQuery(_e.target);
-
- while (!_target.hasClass("Ldt-TraceMe") && !_target.hasClass("Ldt-Widget") && _target.length) {
- _target = _target.parent();
- }
+ IriSP.jQuery(".Ldt-Widget").on("click mouseenter mouseleave", ".Ldt-TraceMe", function(_e) {
+ var _target = IriSP.jQuery(this);
- var _widget = IriSP.jQuery(this).attr("widget-type"),
+ var _widget = _target.attr("widget-type") || _target.parents(".Ldt-Widget").attr("widget-type"),
_data = {
"type": _e.type,
- "x": _e.clientX,
- "y": _e.clientY,
"widget": _widget
},
_targetEl = _target[0],
_class = _targetEl.className,
_name = _targetEl.localName,
_id = _targetEl.id,
- _value = _targetEl.value,
- _traceInfo = _target.attr("trace-info"),
- _lastTarget = _name + (_id && _id.length ? '#' + IriSP.jqEscape(_id) : '') + (_class && _class.length ? ('.' + IriSP.jqEscape(_class).replace(/\s/g,'.')).replace(/\.Ldt-(Widget|TraceMe)/g,'') : '');
- _data.target = _lastTarget
- if (typeof _traceInfo == "string" && _traceInfo.length) {
+ _value = _target.val(),
+ _traceInfo = _target.attr("trace-info");
+ _data.target = _name + (_id && _id.length ? '#' + IriSP.jqEscape(_id) : '') + (_class && _class.length ? ('.' + IriSP.jqEscape(_class).replace(/\s/g,'.')).replace(/\.Ldt-(Widget|TraceMe)/g,'') : '');
+ if (typeof _traceInfo == "string" && _traceInfo) {
_data.traceInfo = _traceInfo;
- _lastTarget += ( ";" + _traceInfo );
}
if (typeof _value == "string" && _value.length) {
_data.value = _value;
}
- switch(_e.type) {
- case "mouseover":
- if (_this.lastTarget != _lastTarget) {
- _this.player.popcorn.trigger('IriSP.TraceWidget.MouseEvents', _data);
- } else {
- if (typeof _this.moTimeout != "undefined") {
- clearTimeout(_this.moTimeout);
- _this.moTimeout = undefined;
- }
- }
- break;
- case "mouseout":
- if (typeof _this.moTimeout != "undefined") {
- clearTimeout(_this.moTimeout);
- }
- _this.moTimeout = setTimeout(function() {
- if (_lastTarget != _this.lastTarget) {
- _this.player.popcorn.trigger('IriSP.TraceWidget.MouseEvents', _data);
- }
- },100);
- break;
- default:
- _this.player.popcorn.trigger('IriSP.TraceWidget.MouseEvents', _data);
- }
- _this.lastTarget = _lastTarget;
+ _this.eventHandler('UIEvent', _data);
});
-}
+};
IriSP.Widgets.Trace.prototype.eventHandler = function(_listener, _arg) {
var _traceName = 'Mdp_';
if (typeof _arg == "string" || typeof _arg == "number") {
- _arg = { "value" : _arg }
+ _arg = { "value" : _arg };
}
if (typeof _arg == "undefined") {
- _arg = {}
+ _arg = {};
}
switch(_listener) {
- case 'IriSP.TraceWidget.MouseEvents':
+ case 'UIEvent':
_traceName += _arg.widget + '_' + _arg.type;
delete _arg.widget;
delete _arg.type;
break;
- case 'timeupdate':
case 'play':
case 'pause':
- _arg.time = this.player.popcorn.currentTime() * 1000;
+ _arg.milliseconds = this.media.getCurrentTime().milliseconds;
+ case 'timeupdate':
case 'seeked':
case 'volumechange':
- _traceName += 'Popcorn_' + _listener;
+ _traceName += 'media_' + _listener;
break;
default:
- _traceName += _listener.replace('IriSP.','').replace('.','_');
+ _traceName += _listener.replace('.','_');
}
- this.lastEvent = _traceName;
if (typeof this.extend === "object" && this.extend) {
IriSP._(_arg).extend(this.extend);
}
@@ -153,4 +127,4 @@
if (this.js_console && typeof window.console !== "undefined" && typeof console.log !== "undefined") {
console.log("tracer.trace('" + _traceName + "', " + JSON.stringify(_arg) + ");");
}
-}
+};
\ No newline at end of file
--- a/src/widgets/Tweet.js Thu Aug 30 14:45:23 2012 +0200
+++ b/src/widgets/Tweet.js Thu Jan 02 16:40:25 2014 +0100
@@ -6,7 +6,7 @@
IriSP.Widgets.Tweet.prototype = new IriSP.Widgets.Widget();
IriSP.Widgets.Tweet.prototype.defaults = {
- hide_timeout: 5000,
+ hide_timeout: 10000,
polemics : [
{
"keywords" : [ "++" ],
@@ -25,18 +25,19 @@
"color" : "#05aae6"
}
],
+ annotation_type: "tweet",
pin_at_start: false
-}
+};
IriSP.Widgets.Tweet.prototype.messages = {
"fr": {
retweet: "Retweeter",
reply: "Répondre",
- keep_visible: "Garder visible",
+ keep_visible: "Empêcher la fermeture automatique",
dont_keep_visible: "Permettre la fermeture automatique",
close_widget: "Fermer l'affichage du tweet",
- original_time: "Heure d'envoi : ",
- video_time: "Temps de la vidéo : ",
+ original_time: "Heure d'envoi\u00a0: ",
+ video_time: "Temps de la vidéo\u00a0: ",
show_original: "Voir l'original"
},
"en": {
@@ -49,7 +50,7 @@
video_time: "Video time: ",
show_original: "Show original"
}
-}
+};
IriSP.Widgets.Tweet.prototype.template =
'<div class="Ldt-Tweet-Widget"><div class="Ldt-Tweet-Inner"><div class="Ldt-Tweet-PinClose-Buttons">'
@@ -66,12 +67,11 @@
IriSP.Widgets.Tweet.prototype.draw = function() {
this.renderTemplate();
- this.bindPopcorn("IriSP.Tweet.show","show");
this.pinned = this.pin_at_start;
var _this = this;
this.$.find(".Ldt-Tweet-Pin").click(function() {
_this.pinned = !_this.pinned;
- var _el = IriSP.jQuery(this)
+ var _el = IriSP.jQuery(this);
if (_this.pinned) {
_el.addClass("active").attr("title",_this.l10n.dont_keep_visible);
_this.cancelTimeout();
@@ -84,93 +84,61 @@
_this.hide();
});
this.$.hide();
-}
+ this.getWidgetAnnotations().forEach(function(_annotation) {
+ _annotation.on("click", function() {
+ _this.show(_annotation);
+ });
+ });
+};
-IriSP.Widgets.Tweet.prototype.show = function(_id) {
- var _tweet = this.source.getElement(_id);
+IriSP.Widgets.Tweet.prototype.show = function(_tweet) {
if (typeof _tweet !== "undefined" && typeof _tweet.source !== "undefined") {
- var _entities = [];
- for (var _i = 0; _i < _tweet.source.entities.hashtags.length; _i++) {
- var _hash = _tweet.source.entities.hashtags[_i];
- _entities.push({
- is_link: true,
- text: '#' + _hash.text,
- url: 'http://twitter.com/search?q=%23' + encodeURIComponent(_hash.text),
- indices: _hash.indices
- });
- }
- for (var _i = 0; _i < _tweet.source.entities.urls.length; _i++) {
- var _url = _tweet.source.entities.urls[_i],
- _displayurl = (typeof _url.display_url !== "undefined" && _url.display_url !== null ? _url.display_url : _url.url),
- _linkurl = (typeof _url.expanded_url !== "undefined" && _url.expanded_url !== null ? _url.expanded_url : _url.url);
- _displayurl = _displayurl.replace(/^\w+:\/\//,'');
- if (!/^\w+:\/\//.test(_linkurl)) {
- _linkurl = 'http://' + _linkurl;
- }
- _entities.push({
- is_link: true,
- text: _displayurl,
- url: _linkurl,
- indices: _url.indices
- });
- }
- for (var _i = 0; _i < _tweet.source.entities.user_mentions.length; _i++) {
- var _user = _tweet.source.entities.user_mentions[_i];
- _entities.push({
- is_link: true,
- text: '@' + _user.screen_name,
- url: 'http://twitter.com/' + encodeURIComponent(_user.screen_name),
- indices: _user.indices
- });
- }
- for (var _i = 0; _i < this.polemics.length; _i++) {
- for (var _j = 0; _j < this.polemics[_i].keywords.length; _j++) {
- var _p = _tweet.source.text.indexOf(this.polemics[_i].keywords[_j]);
- while (_p !== -1) {
- var _end = (_p + this.polemics[_i].keywords[_j].length);
- _entities.push({
- is_link: false,
- text: this.polemics[_i].keywords[_j],
- color: this.polemics[_i].color,
- indices: [_p, _end]
- });
- _p = _tweet.source.text.indexOf(this.polemics[_i].keywords[_j], _end);
- }
- }
- }
- _entities = IriSP._(_entities).sortBy(function(_entity) {
+ var extend = [
+ [
+ /#(\w+)/gm,
+ function(matches) {
+ return '<a href="http://twitter.com/search?q=%23' + matches[1] + '" target="_blank">';
+ },
+ '</a>'
+ ]
+ ];
+ var _urls = IriSP._(_tweet.source.entities.urls).sortBy(function(_entity) {
return _entity.indices[0];
});
+
var _currentPos = 0,
_txt = '';
- for (var _i = 0; _i < _entities.length; _i++) {
- if (_entities[_i].indices[0] >= _currentPos) {
- _txt += _tweet.source.text.substring(_currentPos, _entities[_i].indices[0]);
- _currentPos = _entities[_i].indices[1];
- if (_entities[_i].is_link) {
- _txt += '<a href="' + _entities[_i].url + '" target="_blank">';
- } else {
- _txt += '<span style="background:' + _entities[_i].color + '">';
- }
- _txt += _entities[_i].text;
- if (_entities[_i].is_link) {
- _txt += '</a>';
- } else {
- _txt += '</span>';
- }
+ IriSP._(_urls).each(function(_url) {
+ if (_url.indices[0] >= _currentPos) {
+ _txt += _tweet.source.text.substring(_currentPos, _url.indices[0]);
+ _txt += (typeof _url.expanded_url !== "undefined" && _url.expanded_url !== null ? _url.expanded_url : _url.url);
+ _currentPos = _url.indices[1];
}
- }
+ });
_txt += _tweet.source.text.substring(_currentPos);
- this.$.find(".Ldt-Tweet-Avatar").attr("src",_tweet.source.user.profile_image_url);
- this.$.find(".Ldt-Tweet-ScreenName").html('@'+_tweet.source.user.screen_name);
- this.$.find(".Ldt-Tweet-ProfileLink").attr("href", "https://twitter.com/" + _tweet.source.user.screen_name);
- this.$.find(".Ldt-Tweet-FullName").html(_tweet.source.user.name);
- this.$.find(".Ldt-Tweet-Contents").html(_txt);
+
+ for (var _i = 0; _i < this.polemics.length; _i++) {
+ var rx = IriSP.Model.regexpFromTextOrArray(this.polemics[_i].keywords);
+ extend.push([
+ rx,
+ '<span style="background: ' + this.polemics[_i].color + '">',
+ '</span>'
+ ]);
+ }
+ var rx = (_tweet.found ? (_this.source.getAnnotations().regexp || false) : false),
+ profile_url = _tweet.source.user ? _tweet.source.user.profile_image_url : _tweet.source.profile_image_url,
+ screen_name = _tweet.source.user ? _tweet.source.user.screen_name :_tweet.source.from_user,
+ user_name = _tweet.source.user ? _tweet.source.user.name :_tweet.source.from_user_name;
+ this.$.find(".Ldt-Tweet-Avatar").attr("src", profile_url);
+ this.$.find(".Ldt-Tweet-ScreenName").html('@' + screen_name);
+ this.$.find(".Ldt-Tweet-ProfileLink").attr("href", "https://twitter.com/" + screen_name);
+ this.$.find(".Ldt-Tweet-FullName").html(user_name);
+ this.$.find(".Ldt-Tweet-Contents").html(IriSP.textFieldHtml(_txt, rx, extend));
this.$.find(".Ldt-Tweet-Time").html(this.l10n.original_time + new Date(_tweet.source.created_at).toLocaleTimeString() + " / " + this.l10n.video_time + _tweet.begin.toString());
this.$.find(".Ldt-Tweet-Retweet").attr("href", "https://twitter.com/intent/retweet?tweet_id=" + _tweet.source.id_str);
this.$.find(".Ldt-Tweet-Reply").attr("href", "https://twitter.com/intent/tweet?in_reply_to=" + _tweet.source.id_str);
- this.$.find(".Ldt-Tweet-Original").attr("href", "https://twitter.com/" + _tweet.source.user.screen_name + "/status/" + _tweet.source.id_str);
- this.player.popcorn.trigger("IriSP.Annotation.minimize");
+ this.$.find(".Ldt-Tweet-Original").attr("href", "https://twitter.com/" + screen_name + "/status/" + _tweet.source.id_str);
+ this.player.trigger("Annotation.minimize");
this.$.slideDown();
this.cancelTimeout();
if (!this.pinned) {
@@ -179,22 +147,22 @@
} else {
this.hide();
}
-}
+};
IriSP.Widgets.Tweet.prototype.hide = function() {
- this.player.popcorn.trigger("IriSP.Annotation.maximize");
+ this.player.trigger("Annotation.maximize");
this.$.slideUp();
this.cancelTimeout();
-}
+};
IriSP.Widgets.Tweet.prototype.cancelTimeout = function() {
if (typeof this.hide_timer !== "undefined") {
window.clearTimeout(this.hide_timer);
this.hide_timer = undefined;
}
-}
+};
IriSP.Widgets.Tweet.prototype.hideTimeout = function() {
this.cancelTimeout();
this.hide_timer = window.setTimeout(this.functionWrapper("hide"), this.hide_timeout);
-}
+};