# HG changeset patch # User veltr # Date 1348504673 -7200 # Node ID 8d62f45fe393ffb2515808ca447033efdb34dd23 # Parent 87598228cfbba3c7941f78f38913ddbbd92349b0 Updated Metadataplayer diff -r 87598228cfbb -r 8d62f45fe393 src/ldt/ldt/ldt_utils/templates/ldt/ldt_utils/partial/embed_player.html --- a/src/ldt/ldt/ldt_utils/templates/ldt/ldt_utils/partial/embed_player.html Mon Sep 24 11:29:35 2012 +0200 +++ b/src/ldt/ldt/ldt_utils/templates/ldt/ldt_utils/partial/embed_player.html Mon Sep 24 18:37:53 2012 +0200 @@ -64,13 +64,6 @@ type: "Segments", annotation_type: ["chap","découpage"] },{ - type: "Slice", - start_visible : false, - live_update : true - },{ - type: "Arrow", - base_height: 3 - },{ type: "Annotation", start_minimized: true, site_name : "Lignes de Temps", @@ -86,7 +79,8 @@ close_after_send: false, tag_titles: ["#amateur", "#digital-humanities"], creator_name: '{{request.user.username}}', - creator_avatar: '{% thumbnail request.user.get_profile.image "48x48" format="PNG" crop="center" as im %}{{WEB_URL}}{{ im.url }}{% endthumbnail %}' || "https://si0.twimg.com/sticky/default_profile_images/default_profile_1_normal.png" + creator_avatar: '{% thumbnail request.user.get_profile.image "48x48" format="PNG" crop="center" as im %}{{WEB_URL}}{{ im.url }}{% endthumbnail %}' || "https://si0.twimg.com/sticky/default_profile_images/default_profile_1_normal.png", + slice_annotation_type: ["chap","découpage"] },{ type: "Slideshare", container: "Slideshare_ext", diff -r 87598228cfbb -r 8d62f45fe393 src/ldt/ldt/static/ldt/metadataplayer/Annotation.js --- a/src/ldt/ldt/static/ldt/metadataplayer/Annotation.js Mon Sep 24 11:29:35 2012 +0200 +++ b/src/ldt/ldt/static/ldt/metadataplayer/Annotation.js Mon Sep 24 18:37:53 2012 +0200 @@ -27,7 +27,8 @@ } IriSP.Widgets.Annotation.prototype.template = - '
' + '{{#show_arrow}}
{{/show_arrow}}' + + '
' + '
' + '
' + '
' @@ -43,40 +44,103 @@ 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, + site_name : "Lignes de Temps", + search_on_tag_click: true } IriSP.Widgets.Annotation.prototype.draw = function() { + + var _this = this; + + 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 drawAnnotation(_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"); + 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('
  • ').append(IriSP.jQuery('').text(_trimmedTitle)); + _el.click(function() { + if (_this.search_on_tag_click) { + _this.player.trigger("search.triggeredSearch",_trimmedTitle); + } + _tag.trigger("click"); + }); + _tagblock.append(_el); + } + }); + } 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 { + 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((_annotation.begin + _annotation.end)/2); + } + _this.sendBounds(); + } + this.renderTemplate(); this.insertSubwidget(this.$.find(".Ldt-Annotation-Social"), { type: "Social" }, "socialWidget"); - this.onMediaEvent("timeupdate","onTimeupdate"); + this.insertSubwidget(this.$.find(".Ldt-Annotation-Arrow"), { type: "Arrow" }, "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(_time) { - var _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.trigger("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.trigger("Arrow.updatePosition",{widget: this.type, time: _time}); - this.bounds = [ _time, _time ]; - } - this.sendBounds(); + this.getWidgetAnnotations().forEach(function(_a) { + _a.on("enter", function() { + drawAnnotation(_a) + }); + }); } IriSP.Widgets.Annotation.prototype.sendBounds = function() { @@ -85,61 +149,7 @@ 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 '
  • ' + _tag + '
    • '; - }).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.trigger("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() { diff -r 87598228cfbb -r 8d62f45fe393 src/ldt/ldt/static/ldt/metadataplayer/AnnotationsList.js --- a/src/ldt/ldt/static/ldt/metadataplayer/AnnotationsList.js Mon Sep 24 11:29:35 2012 +0200 +++ b/src/ldt/ldt/static/ldt/metadataplayer/AnnotationsList.js Mon Sep 24 18:37:53 2012 +0200 @@ -129,7 +129,7 @@ if (this.mashupMode) { 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; @@ -140,8 +140,9 @@ _list = _list.searchByTextFields(this.searchString); } if (this.limit_count) { + /* Get the n annotations closest to current timecode */ _list = _list.sortBy(function(_annotation) { - return Math.abs(_annotation.begin.getSeconds() - _currentTime); + return Math.abs((_annotation.begin + _annotation.end) / 2 - _currentTime); }).slice(0, this.limit_count) } if (this.newest_first) { diff -r 87598228cfbb -r 8d62f45fe393 src/ldt/ldt/static/ldt/metadataplayer/Arrow.js --- a/src/ldt/ldt/static/ldt/metadataplayer/Arrow.js Mon Sep 24 11:29:35 2012 +0200 +++ b/src/ldt/ldt/static/ldt/metadataplayer/Arrow.js Mon Sep 24 18:37:53 2012 +0200 @@ -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.onMdpEvent("Arrow.updatePosition","onUpdatePosition"); - this.onMdpEvent("Arrow.takeover","onTakeover"); - this.onMdpEvent("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 @@ -58,8 +55,8 @@ }); } -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"), @@ -69,6 +66,10 @@ 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") { this.currentX = this.targetX; @@ -85,21 +86,3 @@ } 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; -} diff -r 87598228cfbb -r 8d62f45fe393 src/ldt/ldt/static/ldt/metadataplayer/CreateAnnotation.css --- a/src/ldt/ldt/static/ldt/metadataplayer/CreateAnnotation.css Mon Sep 24 11:29:35 2012 +0200 +++ b/src/ldt/ldt/static/ldt/metadataplayer/CreateAnnotation.css Mon Sep 24 18:37:53 2012 +0200 @@ -11,9 +11,7 @@ } .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 { diff -r 87598228cfbb -r 8d62f45fe393 src/ldt/ldt/static/ldt/metadataplayer/CreateAnnotation.js --- a/src/ldt/ldt/static/ldt/metadataplayer/CreateAnnotation.js Mon Sep 24 11:29:35 2012 +0200 +++ b/src/ldt/ldt/static/ldt/metadataplayer/CreateAnnotation.js Mon Sep 24 18:37:53 2012 +0200 @@ -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); @@ -11,8 +11,8 @@ 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, minimize_annotation_widget : true, creator_name : "", creator_avatar : "", @@ -37,6 +37,7 @@ background_color: "#f0e000", text_color: "#000000" }], + slice_annotation_type: "chap", annotation_type: "Contributions", api_serializer: "ldt_annotate", api_endpoint_template: "", @@ -91,12 +92,14 @@ } IriSP.Widgets.CreateAnnotation.prototype.template = - '
    ' + '{{#show_slice}}
    {{/show_slice}}' + + '{{^show_slice}}{{#show_arrow}}
    {{/show_arrow}}{{/show_slice}}' + + '
    ' + '
    ' + '

    {{#show_title_field}}{{/show_title_field}}' + '{{^show_title_field}}{{l10n.no_title}} {{/show_title_field}}' - + ' {{#sync_on_slice_widget}}{{l10n.from_time}} {{/sync_on_slice_widget}}{{^sync_on_slice_widget}}{{l10n.at_time}} {{/sync_on_slice_widget}} 00:00' - + '{{#sync_on_slice_widget}} {{l10n.to_time}} 00:00{{/sync_on_slice_widget}}' + + ' {{#show_slice}}{{l10n.from_time}} {{/show_slice}}{{^show_slice}}{{l10n.at_time}} {{/show_slice}} 00:00' + + '{{#show_slice}} {{l10n.to_time}} 00:00{{/show_slice}}' + '{{#show_creator_field}}{{l10n.your_name_}}

    {{/show_creator_field}}' + '' + '
    ' @@ -138,6 +141,35 @@ /* We have to use the map function because Mustache doesn't like our tags object */ } this.renderTemplate(); + 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() @@ -164,7 +196,6 @@ } this.onMdpEvent("CreateAnnotation.toggle","toggle"); - this.onMdpEvent("Slice.boundsChanged","onBoundsChanged"); this.begin = new IriSP.Model.Time(); this.end = this.source.getDuration(); this.$.find("form").submit(this.functionWrapper("onSubmit")); @@ -190,7 +221,6 @@ if (this.minimize_annotation_widget) { this.player.trigger("Annotation.minimize"); } - this.player.trigger("Slice.show"); } IriSP.Widgets.CreateAnnotation.prototype.hide = function() { @@ -200,7 +230,6 @@ if (this.minimize_annotation_widget) { this.player.trigger("Annotation.maximize"); } - this.player.trigger("Slice.hide"); } } @@ -214,13 +243,6 @@ } } -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"), _rx = IriSP.Model.regexpFromTextOrArray(_keyword), diff -r 87598228cfbb -r 8d62f45fe393 src/ldt/ldt/static/ldt/metadataplayer/JwpPlayer.js --- a/src/ldt/ldt/static/ldt/metadataplayer/JwpPlayer.js Mon Sep 24 11:29:35 2012 +0200 +++ b/src/ldt/ldt/static/ldt/metadataplayer/JwpPlayer.js Mon Sep 24 18:37:53 2012 +0200 @@ -23,7 +23,7 @@ this.streamer = this.streamer(this.video); } - if (typeof this.streamer === "string") { + if (typeof this.streamer === "string" && (this.provider === "http" || this.provider === "rtmp")) { this.video = this.video.replace(this.streamer,""); _opts.streamer = this.streamer; } diff -r 87598228cfbb -r 8d62f45fe393 src/ldt/ldt/static/ldt/metadataplayer/LdtPlayer-core.js --- a/src/ldt/ldt/static/ldt/metadataplayer/LdtPlayer-core.js Mon Sep 24 11:29:35 2012 +0200 +++ b/src/ldt/ldt/static/ldt/metadataplayer/LdtPlayer-core.js Mon Sep 24 18:37:53 2012 +0200 @@ -680,6 +680,21 @@ this.elementType = 'media'; this.duration = new IriSP.Model.Time(); this.video = ''; + var _this = this; + this.on("timeupdate", function(_time) { + _this.getAnnotations().filter(function(_a) { + return (_a.end <= _time || _a.begin > _time) && _a.playing + }).forEach(function(_a) { + _a.playing = false; + _a.trigger("leave"); + }); + _this.getAnnotations().filter(function(_a) { + return _a.begin <= _time && _a.end > _time && !_a.playing + }).forEach(function(_a) { + _a.playing = true; + _a.trigger("enter"); + }); + }); } IriSP.Model.Media.prototype = new IriSP.Model.Element(); @@ -754,6 +769,11 @@ this.elementType = 'annotation'; this.begin = new IriSP.Model.Time(); this.end = new IriSP.Model.Time(); + this.playing = false; + var _this = this; + this.on("click", function() { + _this.getMedia().setCurrentTime(_this.begin); + }); } IriSP.Model.Annotation.prototype = new IriSP.Model.Element(null); @@ -809,6 +829,10 @@ this.title = this.annotation.title; this.description = this.annotation.description; this.color = this.annotation.color; + var _this = this; + this.on("click", function() { + _mashup.setCurrentTime(_this.begin); + }); } IriSP.Model.MashedAnnotation.prototype = new IriSP.Model.Element(null); @@ -841,6 +865,30 @@ this.duration = new IriSP.Model.Time(); this.segments = new IriSP.Model.List(_source.directory); this.medias = new IriSP.Model.List(_source.directory); + var _currentMedia = null; + var _this = this; + this.on("timeupdate", function(_time) { + _this.getAnnotations().filter(function(_a) { + return (_a.end <= _time || _a.begin > _time) && _a.playing + }).forEach(function(_a) { + _a.playing = false; + _a.trigger("leave"); + }); + _this.getAnnotations().filter(function(_a) { + return _a.begin <= _time && _a.end > _time && !_a.playing + }).forEach(function(_a) { + _a.playing = true; + _a.trigger("enter"); + var _m = _a.getMedia(); + if (_m !== _currentMedia) { + if (_currentMedia) { + _currentMedia.trigger("leave"); + } + _m.trigger("enter"); + _currentMedia = _m; + } + }); + }); } IriSP.Model.Mashup.prototype = new IriSP.Model.Element(); @@ -1139,7 +1187,8 @@ backboneRelational: "backbone-relational.js", paper: "paper.js", jqueryMousewheel: "jquery.mousewheel.min.js", - renkanPublish: "renkan-publish.js" + renkanPublish: "renkan-publish.js", + processing: "processing-1.3.6.min.js" }, locations : { // use to define locations outside default_dir @@ -1172,6 +1221,12 @@ noCss: true, requires: [ "swfObject" ] }, + AutoPlayer: { + noCss: true + }, + MashupPlayer: { + noCss: true + }, Sparkline: { noCss: true, requires: [ "raphael" ] @@ -1195,6 +1250,9 @@ }, Renkan: { requires: [ "backbone", "backboneRelational", "paper", "jqueryMousewheel", "renkanPublish" ] + }, + KnowledgeConcierge: { + requires: [ "processing" ] } } @@ -1302,7 +1360,7 @@ return _function.apply(_this, Array.prototype.slice.call(arguments, 0)); } } else { - console.log("Error, Unknown function IriSP.Widgets" + this.type + "." + _name) + console.log("Error, Unknown function IriSP.Widgets." + this.type + "." + _name) } } diff -r 87598228cfbb -r 8d62f45fe393 src/ldt/ldt/static/ldt/metadataplayer/MediaList.js --- a/src/ldt/ldt/static/ldt/metadataplayer/MediaList.js Mon Sep 24 11:29:35 2012 +0200 +++ b/src/ldt/ldt/static/ldt/metadataplayer/MediaList.js Mon Sep 24 18:37:53 2012 +0200 @@ -57,9 +57,16 @@ } IriSP.Widgets.MediaList.prototype.draw = function() { - this.onMediaEvent("timeupdate","onTimeupdate"); this.$.addClass("Ldt-MediaListWidget") this.renderTemplate(); + var _this = this; + if (typeof this.media.getMedias === "function") { + this.media.getMedias().forEach(function(_m) { + _m.on("enter", function() { + _this.redraw(_m); + }); + }) + } this.redraw(); }; @@ -123,14 +130,3 @@ this.$.find('.Ldt-MediaList-Other').hide(); } }; - -IriSP.Widgets.MediaList.prototype.onTimeupdate = function(_time) { - var _media = this.source.currentMedia; - if (_media.elementType === "mashup") { - _media = _media.getMediaAtTime(_time); - } - if (typeof _media !== "undefined" && _media.id !== this.lastMedia) { - this.lastMedia = _media.id; - this.redraw(_media); - } -} diff -r 87598228cfbb -r 8d62f45fe393 src/ldt/ldt/static/ldt/metadataplayer/Mediafragment.js --- a/src/ldt/ldt/static/ldt/metadataplayer/Mediafragment.js Mon Sep 24 11:29:35 2012 +0200 +++ b/src/ldt/ldt/static/ldt/metadataplayer/Mediafragment.js Mon Sep 24 18:37:53 2012 +0200 @@ -20,6 +20,12 @@ this.onMediaEvent("pause","setHashToTime"); this.onMediaEvent("seeked","setHashToTime"); this.goToHash(); + var _this = this; + this.getWidgetAnnotations().forEach(function(_annotation) { + _annotation.on("click", function() { + _this.setHashToAnnotation(_annotation.id); + }) + }) } IriSP.Widgets.Mediafragment.prototype.setWindowHash = function(_hash) { diff -r 87598228cfbb -r 8d62f45fe393 src/ldt/ldt/static/ldt/metadataplayer/Polemic.js --- a/src/ldt/ldt/static/ldt/metadataplayer/Polemic.js Mon Sep 24 11:29:35 2012 +0200 +++ b/src/ldt/ldt/static/ldt/metadataplayer/Polemic.js Mon Sep 24 18:37:53 2012 +0200 @@ -168,8 +168,7 @@ }).mouseout(function() { _annotation.trigger("unselect"); }).click(function() { - _this.player.trigger("Mediafragment.setHashToAnnotation", _annotation.id); - _this.player.trigger("Tweet.show", _annotation.id); + _annotation.trigger("click"); }); _annotation.on("select", function() { _this.tooltip.show( diff -r 87598228cfbb -r 8d62f45fe393 src/ldt/ldt/static/ldt/metadataplayer/Segments.js --- a/src/ldt/ldt/static/ldt/metadataplayer/Segments.js Mon Sep 24 11:29:35 2012 +0200 +++ b/src/ldt/ldt/static/ldt/metadataplayer/Segments.js Mon Sep 24 18:37:53 2012 +0200 @@ -62,8 +62,7 @@ _annotation.trigger("unselect"); }) .click(function() { - _this.media.setCurrentTime(_annotation.begin); - _this.player.trigger("Mediafragment.setHashToAnnotation", _data.id); + _annotation.trigger("click"); }) .appendTo(_this.list_$) _annotation.on("select", function() { diff -r 87598228cfbb -r 8d62f45fe393 src/ldt/ldt/static/ldt/metadataplayer/Slice.css --- a/src/ldt/ldt/static/ldt/metadataplayer/Slice.css Mon Sep 24 11:29:35 2012 +0200 +++ b/src/ldt/ldt/static/ldt/metadataplayer/Slice.css Mon Sep 24 18:37:53 2012 +0200 @@ -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 { diff -r 87598228cfbb -r 8d62f45fe393 src/ldt/ldt/static/ldt/metadataplayer/Slice.js --- a/src/ldt/ldt/static/ldt/metadataplayer/Slice.js Mon Sep 24 11:29:35 2012 +0200 +++ b/src/ldt/ldt/static/ldt/metadataplayer/Slice.js Mon Sep 24 18:37:53 2012 +0200 @@ -10,41 +10,41 @@ 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 = + '
    ' + + '{{#show_arrow}}
    {{/show_arrow}}' + IriSP.Widgets.Slice.prototype.draw = function() { - this.$slider = IriSP.jQuery('
    ') - .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.trigger("Arrow.updatePosition",{ - widget:_this.type, - time:Math.floor((ui.values[0]+ui.values[1])/2) - }); - _this.player.trigger("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; @@ -54,9 +54,6 @@ _currentTime = _this.media.getCurrentTime(); }, slide: function(event, ui) { - if (!_this.override_bounds && (ui.value < _this.min || ui.value > _this.max)) { - return false; - } _this.media.setCurrentTime(ui.value); }, stop: function() { @@ -64,36 +61,21 @@ _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.onMdpEvent("Slice.show","show"); - this.onMdpEvent("Slice.hide","hide"); - this.onMdpEvent("Annotation.boundsChanged","storeBounds"); - this.player.trigger("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.trigger("Arrow.takeover",this.type); - this.$slider.slider("values", [this.min, this.max]); } IriSP.Widgets.Slice.prototype.hide = function() { this.$slider.hide(); - this.player.trigger("Arrow.release"); } - -IriSP.Widgets.Slice.prototype.storeBounds = function(_values) { - if (!this.media.getPaused() && (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 diff -r 87598228cfbb -r 8d62f45fe393 src/ldt/ldt/static/ldt/metadataplayer/Slider.css --- a/src/ldt/ldt/static/ldt/metadataplayer/Slider.css Mon Sep 24 11:29:35 2012 +0200 +++ b/src/ldt/ldt/static/ldt/metadataplayer/Slider.css Mon Sep 24 18:37:53 2012 +0200 @@ -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: 9px; width: 34px; border: 1px solid #999999; padding: 1px; margin-left: -20px; + display: none; text-align: center; font-weight: bold; +} diff -r 87598228cfbb -r 8d62f45fe393 src/ldt/ldt/static/ldt/metadataplayer/Slider.js --- a/src/ldt/ldt/static/ldt/metadataplayer/Slider.js Mon Sep 24 11:29:35 2012 +0200 +++ b/src/ldt/ldt/static/ldt/metadataplayer/Slider.js Mon Sep 24 18:37:53 2012 +0200 @@ -15,12 +15,16 @@ set to zero for fixed slider */ }; +IriSP.Widgets.Slider.prototype.template = + '
    00:00
    ' + IriSP.Widgets.Slider.prototype.draw = function() { - this.$slider = IriSP.jQuery('
    ') - .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; @@ -45,13 +49,21 @@ 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(_time) { @@ -73,6 +85,7 @@ } IriSP.Widgets.Slider.prototype.onMouseout = function() { + this.$time.hide(); if (this.minimize_timeout) { if (this.timeoutId) { window.clearTimeout(this.timeoutId); diff -r 87598228cfbb -r 8d62f45fe393 src/ldt/ldt/static/ldt/metadataplayer/Slideshare.js --- a/src/ldt/ldt/static/ldt/metadataplayer/Slideshare.js Mon Sep 24 11:29:35 2012 +0200 +++ b/src/ldt/ldt/static/ldt/metadataplayer/Slideshare.js Mon Sep 24 18:37:53 2012 +0200 @@ -2,12 +2,6 @@ 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(); @@ -32,99 +26,94 @@ '

    {{l10n.slides_}}

    '; 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; + + var _embedObject = null, + $container, + _lastEmbedded = "", + _this = this; + + 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('
    '); + 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.onMediaEvent("timeupdate","onTimeupdate"); - this.onTimeupdate(0); + var _lastPres = "", + _embedObject = null, + _oembedCache = {}, + _this = this; + $container = this.$.find(".Ldt-SlideShare-Container"); + _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 { + insertSlideshare(_presentation, _slide); + } + } + if (_this.sync && _embedObject && typeof _embedObject.jumpTo === "function") { + _embedObject.jumpTo(parseInt(_slide)); + } + _lastPres = _presentation; + + }) + }) } } - -IriSP.Widgets.Slideshare.prototype.onTimeupdate = function(_time) { - 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); - } - }); - } else { - this.insertSlideshare(this.oembedCache[_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 - } - } - } -} - -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('
    '); - 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(); -} diff -r 87598228cfbb -r 8d62f45fe393 src/ldt/ldt/static/ldt/metadataplayer/Tagcloud.js --- a/src/ldt/ldt/static/ldt/metadataplayer/Tagcloud.js Mon Sep 24 11:29:35 2012 +0200 +++ b/src/ldt/ldt/static/ldt/metadataplayer/Tagcloud.js Mon Sep 24 18:37:53 2012 +0200 @@ -44,35 +44,27 @@ this.onMdpEvent("search.cleared", "onSearch"); if (this.segment_annotation_type) { - this.onMediaEvent("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(_time) { - var _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; }) } diff -r 87598228cfbb -r 8d62f45fe393 src/ldt/ldt/static/ldt/metadataplayer/Tweet.js --- a/src/ldt/ldt/static/ldt/metadataplayer/Tweet.js Mon Sep 24 11:29:35 2012 +0200 +++ b/src/ldt/ldt/static/ldt/metadataplayer/Tweet.js Mon Sep 24 18:37:53 2012 +0200 @@ -25,6 +25,7 @@ "color" : "#05aae6" } ], + annotation_type: "tweet", pin_at_start: false } @@ -66,7 +67,6 @@ IriSP.Widgets.Tweet.prototype.draw = function() { this.renderTemplate(); - this.onMdpEvent("Tweet.show","show"); this.pinned = this.pin_at_start; var _this = this; this.$.find(".Ldt-Tweet-Pin").click(function() { @@ -84,10 +84,14 @@ _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++) {