71 txt += tweet.text.substring(lastend); |
79 txt += tweet.text.substring(lastend); |
72 html += txt + '</p></li>'; |
80 html += txt + '</p></li>'; |
73 return html; |
81 return html; |
74 } |
82 } |
75 |
83 |
76 function getTweets() { |
84 function displayTweets() { |
77 var to = tweetData.position + 1, |
85 var to = tweetData.position + 1, |
78 from = Math.max(0, to - zoomLevels[tweetData.zoomLevel].displayCount); |
86 from = Math.max(0, to - zoomLevels[tweetData.zoomLevel].displayCount); |
79 socket.emit('getTweets',{ "from": from, "to": to }); |
87 socket.emit('getTweets',{ "from": from, "to": to, "callback" : "display" }); |
80 } |
88 } |
81 |
89 |
82 function setZoom(level) { |
90 function setZoom(level) { |
83 tweetData.zoomLevel = Math.max(0, Math.min( zoomLevels.length - 1 , level ) ); |
91 tweetData.zoomLevel = Math.max(0, Math.min( zoomLevels.length - 1 , level ) ); |
84 getTweets(); |
92 displayTweets(); |
|
93 } |
|
94 |
|
95 function setTimeZoom(level) { |
|
96 tweetData.timeLevel = Math.max(0, Math.min( 3, level )); |
|
97 getTimeline(); |
|
98 } |
|
99 |
|
100 function getTimeline() { |
|
101 socket.emit('getTimeline',{"level":tweetData.timeLevel}); |
|
102 } |
|
103 |
|
104 function showTimeWindow() { |
|
105 if (timeWindow) { |
|
106 timeWindow.remove(); |
|
107 timeWindow = null; |
|
108 } |
|
109 if (tweetData.tweetsOnDisplay && tweetData.timelineOnDisplay) { |
|
110 var dtfintl = new Date ( tweetData.timelineOnDisplay[ tweetData.timelineOnDisplay.length - 1 ].end ), |
|
111 dtdebtl = new Date ( tweetData.timelineOnDisplay[0].start ), |
|
112 dtfintw = new Date( tweetData.tweetsOnDisplay[0].created_at ), |
|
113 dtdebtw = new Date( tweetData.tweetsOnDisplay[ tweetData.tweetsOnDisplay.length - 1 ].created_at ), |
|
114 scaleY = 600 / ( dtfintl - dtdebtl ); |
|
115 timeWindow = paper.rect( 0, scaleY * ( dtfintl - dtfintw ), 600, scaleY * ( dtfintw - dtdebtw )).attr({"stroke":"#000080","fill":"#8080ff","fill-opacity":.2}); |
|
116 } |
85 } |
117 } |
86 |
118 |
87 $(document).ready(function() { |
119 $(document).ready(function() { |
|
120 paper = Raphael("timeline", 160, 600); |
88 socket = io.connect('http://' + S_IO_HOST + ':' + S_IO_PORT ); |
121 socket = io.connect('http://' + S_IO_HOST + ':' + S_IO_PORT ); |
89 socket.on('tweetSummary', function (data) { |
122 socket.on('tweetSummary', function (data) { |
90 if (tweetData.position == tweetData.tweetcount - 1) { |
123 if (tweetData.position == tweetData.tweetcount - 1) { |
91 tweetData.position = data.tweetcount - 1; |
124 tweetData.position = data.tweetcount - 1; |
92 getTweets(); |
125 displayTweets(); |
|
126 getTimeline(); |
93 } |
127 } |
94 tweetData.tweetcount = data.tweetcount; |
128 tweetData.tweetcount = data.tweetcount; |
95 }); |
129 }); |
96 socket.on('tweets', function (data) { |
130 socket.on('tweets', function (data) { |
97 tweetData.tweetsOnDisplay = data; |
131 switch (data.callback) { |
98 data.reverse(); |
132 case "display": |
99 html = ''; |
133 tweetData.tweetsOnDisplay = data.tweets; |
100 for (var i in data) { |
134 tweetData.tweetsOnDisplay.reverse(); |
101 html += tweetToHtml(data[i]); |
135 html = ''; |
|
136 for (var i in tweetData.tweetsOnDisplay) { |
|
137 html += tweetToHtml(tweetData.tweetsOnDisplay[i]); |
|
138 } |
|
139 $("#tweetlist").html(html); |
|
140 showTimeWindow(); |
|
141 break; |
102 } |
142 } |
103 $("#tweetlist").html(html); |
143 }); |
|
144 socket.on('timeline', function (data) { |
|
145 tweetData.timelineOnDisplay = data.timeline; |
|
146 paper.clear(); |
|
147 timeWindow = null; |
|
148 var max = 0; |
|
149 for (var i in data.timeline) { |
|
150 max = Math.max(max, data.timeline[i].tweets.length); |
|
151 } |
|
152 var scaleX = 160 / max, |
|
153 scaleY = 600 / data.timeline.length, |
|
154 tmptw = []; |
|
155 for (var i = 0; i < tweetData.tweetcount; i++) { |
|
156 tmptw.push({}); |
|
157 } |
|
158 for (var i = 0; i < data.timeline.length; i++) { |
|
159 for (var j = 0; j < data.timeline[i].tweets.length; j++) { |
|
160 var coul = "#585858"; |
|
161 for (var k in data.timeline[i].annotations) { |
|
162 if (data.timeline[i].annotations[k].indexOf(data.timeline[i].tweets[j]) != -1) { |
|
163 coul = colors[k]; |
|
164 } |
|
165 } |
|
166 tmptw[data.timeline[i].tweets[j]].y = i; |
|
167 tmptw[data.timeline[i].tweets[j]].x = j; |
|
168 paper.rect(scaleX * j + (scaleX > 3 ? .5 : 0), 600 - ((i+1) * scaleY) + (scaleY > 3 ? .5 : 0), scaleX - (scaleX > 3 ? 1 : 0), scaleY - (scaleY > 3 ? 1 : 0)).attr({"stroke":"none","fill":coul}); |
|
169 } |
|
170 } |
|
171 for (var i = 0; i < data.arcs.length; i++) { |
|
172 var x1 = scaleX * (tmptw[data.arcs[i].from].x + .5), |
|
173 x2 = scaleX * (tmptw[data.arcs[i].to].x + .5), |
|
174 y1 = 600 - scaleY * (tmptw[data.arcs[i].from].y + .5), |
|
175 y2 = 600 - scaleY * (tmptw[data.arcs[i].to].y + .5), |
|
176 d = "M"+x1+" "+y1+"C"; |
|
177 if (y1 == y2) { |
|
178 d += x1+" "+(y1 - 60)+" "+x2+" "+(y2 - 60); |
|
179 } else { |
|
180 d += (x1 + 60)+" "+y1+" "+(x2 + 60)+" "+y2; |
|
181 } |
|
182 paper.path(d+" "+x2+" "+y2); |
|
183 } |
|
184 showTimeWindow(); |
104 }); |
185 }); |
105 }); |
186 }); |