# HG changeset patch # User verrierj # Date 1326730554 -3600 # Node ID b0e13a70a57faee40542856209fc6b19966e5ed8 # Parent 4adc42ab55fd6e10f98b504545538c3d0716303c# Parent f47353222ac077da8e7cc7b54f88341fdebecde6 Merge with f47353222ac077da8e7cc7b54f88341fdebecde6 diff -r 4adc42ab55fd -r b0e13a70a57f 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 Jan 16 17:14:52 2012 +0100 +++ b/src/ldt/ldt/ldt_utils/templates/ldt/ldt_utils/partial/embed_player.html Mon Jan 16 17:15:54 2012 +0100 @@ -36,6 +36,24 @@ container:'{{ player_id }}_embed', css:'{{WEB_URL}}{{LDT_MEDIA_PREFIX}}css/LdtPlayer.css', widgets: [ + {type: "PolemicWidget", + width: {{ player_width }}, /* required for this widget */ + height: 50, + metadata:{ + format:'cinelab', + src:'{{ json_url }}', + type:'json'}, + requires: [{ + type: "TooltipWidget", + width: 180, + heigh: 160, + metadata : { + format:'cinelab', + src:'polemic_fr.json', + type:'empty' + } + }] + }, {type: "SparklineWidget", width: {{ player_width }}, /* required for this widget */ height: 50, diff -r 4adc42ab55fd -r b0e13a70a57f src/ldt/ldt/static/ldt/js/LdtPlayer-release.js --- a/src/ldt/ldt/static/ldt/js/LdtPlayer-release.js Mon Jan 16 17:14:52 2012 +0100 +++ b/src/ldt/ldt/static/ldt/js/LdtPlayer-release.js Mon Jan 16 17:15:54 2012 +0100 @@ -1613,6 +1613,9 @@ keywords: ["#faux-raccord", "#mot-clef"], cinecast_version: true /* put to false to enable the platform version, true for the festival cinecast one. */ }, + "SparklineWidget" : { + column_width: 10 // the width of a column in pixels. + }, "Main" : { autoplay: true } @@ -2274,7 +2277,7 @@ } var idList = IriSP.underscore.pluck(list, "id").sort(); - + if (idList.length !== this.__oldList.length) { this.do_redraw(list); } @@ -2305,7 +2308,7 @@ IriSP.AnnotationsListWidget.prototype.draw = function() { this.drawList(); - this._Popcorn.listen("IriSP.createAnnotationWidget.addedAnnotation", IriSP.wrap(this, function() { this.redraw(true); })); + this._Popcorn.listen("IriSP.createAnnotationWidget.addedAnnotation", IriSP.wrap(this, function() { this.drawList(true); })); this._Popcorn.listen("timeupdate", IriSP.wrap(this, this.redraw)); }; @@ -2815,7 +2818,6 @@ console.log(tmp_view); this._serializer._data["annotation-types"].push(tmp_view); } - annotation["type"] = ""; delete annotation.tags; annotation.content.description = annotation.content.data; @@ -2824,11 +2826,12 @@ annotation.id = json.annotations[0].id; annotation.meta = meta; - annotation.meta["id-ref"] = annotation["type"]; + annotation.meta["id-ref"] = json.annotations[0]["type"]; + // everything is shared so there's no need to propagate the change _this._serializer._data.annotations.push(annotation); console.log(_this._serializer._data); - _this._Popcorn.trigger("IriSP.createAnnotationWidget.addedAnnotation"); + _this._Popcorn.trigger("IriSP.createAnnotationWidget.addedAnnotation", annotation); callback(); }), error: @@ -3987,7 +3990,7 @@ IriSP.Widget.call(this, Popcorn, config, Serializer); this._oldAnnotation = null; - + this._results = []; }; @@ -4005,9 +4008,8 @@ the second is an overlay div to display the progression in the video, and the third is a div to react to clicks */ - - /* we suppose that a column is 5 pixels wide */ - var num_columns = (this.selector.width()) / 10; + + var num_columns = (this.selector.width()) / IriSP.widgetsDefaults["SparklineWidget"].column_width; var duration = +this._serializer.currentMedia().meta["dc:duration"]; var time_step = duration / num_columns; /* the time interval between two columns */ var results = []; @@ -4036,6 +4038,9 @@ results.push(count); } + // save the results in an array so that we can re-use them when a new annotation + // is added. + this._results = results; this.selector.append(templ); this.selector.find(".Ldt-sparkLine").css("background", "#c7c8cc"); @@ -4043,6 +4048,8 @@ spotColor: "#b70056", width: this.width, height: this.height}); this._Popcorn.listen("timeupdate", IriSP.wrap(this, this.timeUpdateHandler)); + this._Popcorn.listen("IriSP.createAnnotationWidget.addedAnnotation", IriSP.wrap(this, this.handleNewAnnotation)); + IriSP.jQuery(".Ldt-sparkLineClickOverlay").click(IriSP.wrap(this, this.clickHandler)); }; @@ -4075,6 +4082,20 @@ this._Popcorn.trigger("IriSP.SparklineWidget.clicked", newTime); this._Popcorn.currentTime(newTime); +}; + +/** react when a new annotation is added */ +IriSP.SparklineWidget.prototype.handleNewAnnotation = function(annotation) { + var num_columns = (this.selector.width()) / IriSP.widgetsDefaults["SparklineWidget"].column_width; + var duration = +this._serializer.currentMedia().meta["dc:duration"]; + var time_step = duration / num_columns; /* the time interval between two columns */ + var begin = +annotation.begin; + + var index = Math.floor(begin / time_step); + this._results[index]++; + this.selector.find(".Ldt-sparkLine").sparkline(this._results, {lineColor: "#7492b4", fillColor: "#aeaeb8", + spotColor: "#b70056", + width: this.width, height: this.height}); };/* this widget displays a small tooltip */ IriSP.TooltipWidget = function(Popcorn, config, Serializer) { IriSP.Widget.call(this, Popcorn, config, Serializer);