diff -r 03c69425efa6 -r 738594562e44 tweetcast/nodejs/client/js/script.js --- a/tweetcast/nodejs/client/js/script.js Mon Oct 24 18:01:55 2011 +0200 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000 @@ -1,336 +0,0 @@ -var socket, - tlPaper, - twPaper, - tweetData = { - "tweetcount" : 0, - "position" : 0, - "followLast" : true, - "zoomLevel" : 3, - "timeLevel" : 2, - "tweets" : [], - "posIndex" : [], - "tlChanged" : true - }, - colors = { - 'positive' : "#1D973D", - 'reference' : "#C5A62D", - 'negative' : "#CE0A15", - 'question' : "#036AAE", - 'neutre' : "#585858" - }, - annotations = { - 'positive' : '++', - 'negative' : '--', - 'reference' : '==', - 'question' : '??' - }, - displaySplitting = [ - { - positions : [ 10, 20, 22, 24, 25, 26, 27, 28, 29, 31, 33, 43, 53 ], - classNames : [ 'icons fade', 'icons', 'quarter fade', 'quarter', 'half fade', 'half', 'full', 'half', 'half fade', 'quarter', 'quarter fade', 'icons', 'icons fade' ] - }, - { - positions : [ 1, 3, 5, 7, 13, 33, 53 ], - classNames : [ 'full', 'half', 'half fade', 'quarter', 'quarter fade', 'icons', 'icons fade' ] - } - ], - blockUpdate = false, - waitUpdate = true, - wheeldelta = 0; - -function placeHolder(className) { - return '
  • '; -} - -function tweetToHtml(tweet, className) { - html = '
  • '; - } - html += ''; - } - html += '
    '; - a_user = ''; - if (tweet.user.profile_image_url) { - html += a_user + ''; - } - html += '

    ' + a_user + '@' + tweet.user.screen_name + '

    ' + new Date(tweet.created_at).toLocaleTimeString() + '

    '; - lastend = 0; - txt = ''; - entities = []; - for (var i in tweet.entities.hashtags) { - entities.push({ - "start" : tweet.entities.hashtags[i].indices[0], - "end" : tweet.entities.hashtags[i].indices[1], - "html" : '#' + tweet.entities.hashtags[i].text + '' - }); - } - for (var i in tweet.entities.urls) { - entities.push({ - "start" : tweet.entities.urls[i].indices[0], - "end" : tweet.entities.urls[i].indices[1], - "html" : '' + tweet.entities.urls[i].display_url + '' - }); - } - for (var i in tweet.entities.user_mentions) { - entities.push({ - "start" : tweet.entities.user_mentions[i].indices[0], - "end" : tweet.entities.user_mentions[i].indices[1], - "html" : '@' + tweet.entities.user_mentions[i].screen_name + '' - }); - } - entities.sort(function(a, b) { return a.start - b.start }); - for (var i in entities) { - txt += tweet.text.substring(lastend, entities[i].start) + entities[i].html; - lastend = entities[i].end; - } - txt += tweet.text.substring(lastend); - html += txt + '

  • '; - return html; -} - - -function getUpdate() { - tweetData.posToDisplay = []; - if (tweetData.followLast) { - for (var i = tweetData.tweetcount; i >= tweetData.tweetcount - 52; i--) { - tweetData.posToDisplay.push( i > 0 ? i : -1 ); - } - tweetData.end = tweetData.tweetcount; - tweetData.start = Math.max(1, tweetData.end - 52); - } else { - for (var i = tweetData.position + 26; i >= tweetData.position - 26; i--) { - tweetData.posToDisplay.push( i > 0 && i <= tweetData.tweetcount ? i : -1 ); - } - tweetData.end = Math.min(tweetData.tweetcount, tweetData.position + 26 ); - tweetData.start = Math.max(1, tweetData.position - 26); - } - var tweetsToGet = []; - for (var i = tweetData.start; i <= tweetData.end; i++) { - if (!tweetByPos(i)) { - tweetsToGet.push(i); - } - } - if (tweetsToGet.length) { - socket.emit('updateTweets', { - "tweets" : tweetsToGet - }); - } else { - drawTweetList(); - //drawDisplay(); - } - if (tweetData.tlChanged) { - socket.emit('updateTimeline', { - "level" : tweetData.timeLevel - }); - } else { - drawTimeLine(); - } -} - -function tweetByPos(pos) { - var index = tweetData.posIndex.indexOf(pos); - return (index == -1 ? false : tweetData.tweets[index]); -} - -function delayedUpdate() { - blockUpdate = false; - if (waitUpdate) { - updateDisplay(); - } -} - -function updateDisplay() { - if (blockUpdate) { - waitUpdate = true; - } else { - waitUpdate = false; - getUpdate(); - blockUpdate = true; - setTimeout(delayedUpdate, 100); - } -} - -function setTimeZoom(level) { - if (level >= 0 && level <= 4) { - tweetData.timeLevel = level; - tweetData.tlChanged = true; - updateDisplay(); - } -} - -function drawTweetList() { - html = ''; - var i = 0; - while (i < tweetData.posIndex.length) { - if (tweetData.posToDisplay.indexOf(tweetData.posIndex[i]) == -1) { - tweetData.posIndex.splice(i,1); - tweetData.tweets.splice(i,1); - } else { - i++; - } - } - for (var i in tweetData.posToDisplay) { - var ds = displaySplitting[tweetData.followLast ? 1 : 0]; - for (var j in ds.positions) { - if (ds.positions[j] > i) { - var className = ds.classNames[j]; - break; - } - } - html += ( tweetData.posToDisplay[i] != -1 ? tweetToHtml(tweetByPos(tweetData.posToDisplay[i]), className) : placeHolder(className) ); - } - $("#tweetlist").html(html); - if (tweetData.followLast) { - $("#tweet_" + tweetData.position).fadeIn(500); - } - drawTimeWindow(); -} - -function drawTimeWindow() { - twPaper.clear(); - if (!tweetData.timeline || !tweetData.timeline.length) return; - - var dtfintl = new Date ( tweetData.timeline[ tweetData.timeline.length - 1 ].end ), - dtdebtl = new Date ( tweetData.timeline[0].start ), - dtfintw = new Date( tweetByPos( tweetData.end ).created_at ), - dtdebtw = new Date( tweetByPos( tweetData.start ).created_at ), - scY = 600 / ( dtfintl - dtdebtl ); - twPaper.rect( 0, scY * ( dtfintl - dtfintw ), 300, scY * ( dtfintw - dtdebtw )).attr({"stroke":"none","fill":"#8080ff","fill-opacity":.2}); - var dtcour = new Date( tweetByPos( tweetData.position ).created_at ), - posY = scY * ( dtfintl - dtcour ); - twPaper.path("M0 "+posY+"L300 "+posY).attr({"stroke":"#ff0"}); -} - -function drawTimeLine() { - tlPaper.clear(); - if (!tweetData.timeline || !tweetData.timeline.length) return; - tweetData.tlTweetRects = []; - var scaleY = 600 / tweetData.timeline.length, - max = 0; - for (var i = 0; i < tweetData.timeline.length; i++) { - max = Math.max(max, tweetData.timeline[i].tweets); - } - var scaleX = 160 / max; - - // dessin de l'axe vertical - - tlPaper.path("M160 0L160 600").attr({"stroke":"#ccc"}); - - // dessin de la date de début - - tlPaper.text(165, 592, new Date(tweetData.timeline[0].start).toLocaleTimeString()).attr({ "text-anchor" : "start", "font-size": "12px" }); - - // dessin de la date de fin - - tlPaper.text(165, 7, new Date(tweetData.timeline[tweetData.timeline.length - 1].end).toLocaleTimeString()).attr({ "text-anchor" : "start", "font-size": "12px" }); - for (var i = 0; i < tweetData.timeline.length; i++) { - var posY = 600 - (i * scaleY); - - // Si on est à une demi-heure, on trace un axe secondaire + heure - - if (i && !(new Date(tweetData.timeline[i].start).valueOf() % 1800000)) { - tlPaper.path("M0 "+posY+"L165 "+posY).attr({"stroke":"#ccc"}); - tlPaper.text(165, posY, new Date(tweetData.timeline[i].start).toLocaleTimeString()).attr({ "text-anchor" : "start", "font-size": "12px" }); - } - var anz = { - "neutre" :tweetData.timeline[i].tweets - }; - for (var j in tweetData.timeline[i].annotations) { - anz.neutre -= tweetData.timeline[i].annotations[j]; - anz[j] = tweetData.timeline[i].annotations[j]; - } - var posX = 0; - for (var j in anz) { - var largX = scaleX * anz[j]; - tlPaper.rect(posX, 600 - scaleY * (i+1), largX, scaleY).attr({"stroke": "none", "fill": colors[j]}); - posX += largX; - } - } - - drawTimeWindow(); -/* for (var i = 0; i < tweetData.arcs.length; i++) { - var x1 = scaleX * (tmptw[tweetData.arcs[i].from].x + .5), - x2 = scaleX * (tmptw[tweetData.arcs[i].to].x + .5), - y1 = 600 - scaleY * (tmptw[tweetData.arcs[i].from].y + .5), - y2 = 600 - scaleY * (tmptw[tweetData.arcs[i].to].y + .5), - d = "M"+x1+" "+y1+"C"; - if (y1 == y2) { - d += x1+" "+(y1 - 30)+" "+x2+" "+(y2 - 30); - } else { - d += (x1 + 60)+" "+y1+" "+(x2 + 60)+" "+y2; - } - paper.path(d+" "+x2+" "+y2); - } */ -} - -$(document).ready(function() { - tlPaper = Raphael("timeline", 220, 600); - twPaper = Raphael("timewindow", 220, 600); - socket = io.connect('http://' + S_IO_HOST + ':' + S_IO_PORT ); - socket.on('tweetSummary', function (data) { - if (tweetData.tweetcount != data.tweetcount) { - tweetData.tweetcount = data.tweetcount; - tweetData.tlChanged = true; - if (tweetData.followLast) { - tweetData.position = data.tweetcount; - } - updateDisplay(); - } - }); - socket.on('tweets', function (data) { - for (var i in data) { - if (tweetData.posIndex.indexOf(data[i].pos) == -1) { - tweetData.tweets.push(data[i]); - tweetData.posIndex.push(data[i].pos); - } - } - drawTweetList(); - }); - socket.on('timeline', function (data) { - tweetData.timeline = data; - drawTimeLine(); - }); - socket.on('display', function (data) { - tweetData.tlChanged = false; - for (var i in data.tweets) { - if (tweetData.posIndex.indexOf(data.tweets[i].pos) == -1) { - tweetData.tweets.push(data.tweets[i]); - tweetData.posIndex.push(data.tweets[i].pos); - } - } - if (data.timeline) { - tweetData.timeline = data.timeline - } - tweetData.arcs = data.arcs; - drawDisplay(); - }); - $("#tweetlist").mousewheel(function(e, d) { - wheeldelta += d; - if (Math.abs(wheeldelta) >= 1) { - tweetData.position = Math.min( tweetData.tweetcount, Math.max(1, parseInt(wheeldelta) + tweetData.position ) ); - tweetData.followLast = (tweetData.position == tweetData.tweetcount); - updateDisplay(); - wheeldelta = 0; - } - return false; - }); - $("#timewindow").mousewheel(function(e, d) { - wheeldelta += d; - if (Math.abs(wheeldelta) >= 1) { - if (wheeldelta > 0) { - setTimeZoom(tweetData.timeLevel + 1); - } else { - setTimeZoom(tweetData.timeLevel - 1); - } - wheeldelta = 0; - } - return false; - }); -}); \ No newline at end of file