# HG changeset patch # User hamidouk # Date 1321545079 -3600 # Node ID f84013fb19dcd1d7815d76a69d361cb3d2b82b16 # Parent 1c83c4bba0cee30bb01fc063c8024e870d6c9628 added a new widget, to display the contents of tweets in a separate pane. diff -r 1c83c4bba0ce -r f84013fb19dc src/css/LdtPlayer.css --- a/src/css/LdtPlayer.css Thu Nov 17 16:32:53 2011 +0100 +++ b/src/css/LdtPlayer.css Thu Nov 17 16:51:19 2011 +0100 @@ -234,4 +234,19 @@ height: 20px; background-color: white; } + + .Ldt-tweetWidget { + font-size: 62.5%; + font-family: "Trebuchet MS", "Helvetica", "Arial", "Verdana", "sans-serif"; + background-color:#eeeeee; + padding:5px; + } + + .Ldt-tweetAvatar { + + } + + .Ldt-tweetContents { + + } diff -r 1c83c4bba0ce -r f84013fb19dc src/js/widgets/tweetsWidget.js --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/src/js/widgets/tweetsWidget.js Thu Nov 17 16:51:19 2011 +0100 @@ -0,0 +1,53 @@ +/* a widget that displays tweet - used in conjunction with the polemicWidget */ + +IriSP.TweetsWidget = function(Popcorn, config, Serializer) { + IriSP.Widget.call(this, Popcorn, config, Serializer); + +}; + + +IriSP.TweetsWidget.prototype = new IriSP.Widget(); + +IriSP.TweetsWidget.prototype.displayTweet = function(annotation) { + + var title = annotation.content.title; + var description = annotation.content.description; + var keywords = "" // FIXME; + var begin = +annotation.begin; + var end = +annotation.end; + var duration = +this._serializer.currentMedia().meta["dc:duration"]; + + this.selector.find(".Ldt-tweetContents").text(title); +}; + +IriSP.TweetsWidget.prototype.draw = function() { + var _this = this; + + var tweetMarkup = Mustache.to_html(IriSP.tweetWidget_template, {"share_template" : IriSP.share_template}); + this.selector.append(tweetMarkup); + + this._Popcorn.listen("IriSP.PolemicTweet.click", IriSP.wrap(this, this.PolemicTweetClickHandler)); +}; + +IriSP.TweetsWidget.prototype.PolemicTweetClickHandler = function(tweet_id) { + var index, annotation; + for (index in this._serializer._data.annotations) { + annotation = this._serializer._data.annotations[index]; + + if (annotation.id === tweet_id) + break; + } + + if (annotation.id !== tweet_id) + /* we haven't found it */ + return; + + + this.displayTweet(annotation); + + var time = this._Popcorn.currentTime(); + this._Popcorn = this._Popcorn.code({ start : time + 0.1, end: time + 10, + onEnd: IriSP.wrap(this, this.clearTweet)}); + + return; +}; \ No newline at end of file diff -r 1c83c4bba0ce -r f84013fb19dc src/templates/tweetWidget.html --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/src/templates/tweetWidget.html Thu Nov 17 16:51:19 2011 +0100 @@ -0,0 +1,9 @@ +{{! template for the tweet widget }} +
+
+ +
+
+ +
+
\ No newline at end of file diff -r 1c83c4bba0ce -r f84013fb19dc test/integration/polemic-youtube.htm --- a/test/integration/polemic-youtube.htm Thu Nov 17 16:32:53 2011 +0100 +++ b/test/integration/polemic-youtube.htm Thu Nov 17 16:51:19 2011 +0100 @@ -66,6 +66,12 @@ src:'polemic_fr.json', type:'json'} }, + {type: "TweetsWidget", + metadata:{ + format:'cinelab', + src:'polemic_fr.json', + type:'json'} + }, {type: "SliderWidget", metadata:{ format:'cinelab', diff -r 1c83c4bba0ce -r f84013fb19dc test/integration/polemic.htm --- a/test/integration/polemic.htm Thu Nov 17 16:32:53 2011 +0100 +++ b/test/integration/polemic.htm Thu Nov 17 16:51:19 2011 +0100 @@ -66,6 +66,12 @@ src:'polemic_fr.json', type:'json'} }, + {type: "TweetsWidget", + metadata:{ + format:'cinelab', + src:'polemic_fr.json', + type:'json'} + }, {type: "SliderWidget", metadata:{ format:'cinelab', diff -r 1c83c4bba0ce -r f84013fb19dc unittests/index.html --- a/unittests/index.html Thu Nov 17 16:32:53 2011 +0100 +++ b/unittests/index.html Thu Nov 17 16:51:19 2011 +0100 @@ -40,6 +40,7 @@ + diff -r 1c83c4bba0ce -r f84013fb19dc unittests/tests/widgets/tweetsWidget.js --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/unittests/tests/widgets/tweetsWidget.js Thu Nov 17 16:51:19 2011 +0100 @@ -0,0 +1,43 @@ +/* tweetsWidget.js */ + +function test_tweets_widget() { + module("tweet widget testing", + {setup : function() { + this.Popcorn = Popcorn.youtube("#popcorn-div", "http://www.youtube.com/watch?v=QH2-TGUlwu4"); + + this.dt = new IriSP.DataLoader(); + this.ser = new IriSP.MockTweetSerializer(this.dt, "/url"); /* dummy serializer */ + + this.config = { + width:650, + height:1, + mode:'radio', + container:'widget-div', + debug:true, + css:'../src/css/LdtPlayer.css'}; + }, + teardown: function() { + /* free the popcorn object because it has signal handlers attached to it */ + this.Popcorn = Popcorn.youtube("#popcorn-div", "http://www.youtube.com/watch?v=QH2-TGUlwu4"); + } + }); + + test("test widget initialization", function() { + var widget = new IriSP.TweetsWidget(this.Popcorn, this.config, this.ser); + widget.draw(); + + equal(widget.selector.children(".Ldt-tweetAvatar").length, 1, "test if the div has been added correctly"); + equal(widget.selector.children(".Ldt-tweetContents").length, 1, "test if sub-div has been added correctly"); + }); + + test("test tweet display function", function() { + var widget = new IriSP.TweetsWidget(this.Popcorn, this.config, this.ser); + widget.draw(); + var annotation = {content: {"title": "title", "description": "description", "keywords": "keywords"}}; + widget.displayTweet(annotation); + + equal(widget.selector.find(".Ldt-tweetContents").text(), "title", "title set correctly"); + // equal(widget.selector.find(".Ldt-SaDescription").text(), "description", "description set correctly"); + // equal(widget.selector.find(".Ldt-SaKeywordText").text(), "", "keywords field set correctly"); + }); +}; \ No newline at end of file