tweetcast/nodejs/client/js/script.js
changeset 340 a99a04556e3b
parent 339 6a073c4a8578
child 341 cab5c9e10f90
--- a/tweetcast/nodejs/client/js/script.js	Thu Oct 27 17:57:53 2011 +0200
+++ b/tweetcast/nodejs/client/js/script.js	Fri Oct 28 16:46:13 2011 +0200
@@ -32,14 +32,30 @@
     return '<li class="placeholder ' + className + '"></li>';
 }
 
+function getLinkedTweets() {
+    socket.emit('linkedTweets',{"tweetpos":tweetData.position});
+}
+
+function changeMode() {
+    if (tweetData.feedMode) {
+        getLinkedTweets();
+    } else {
+        tweetData.feedMode = true;
+        updateDisplay();
+    }
+}
+
 function clicTweet(tweetPos) {
     if (tweetPos != tweetData.position) {
         tweetData.position = tweetPos;
-        tweetData.followLast = (tweetData.position == tweetData.tweetcount);
+        if (tweetData.feedMode) {
+            tweetData.followLast = (tweetData.position == tweetData.tweetcount);
+        } else {
+            getLinkedTweets();
+        }
         return false;
     } else {
-        console.log("getting linkedTweets");
-        socket.emit('linkedTweets',{"tweetpos":tweetPos});
+        changeMode();
     }
 }
 
@@ -102,33 +118,68 @@
 
 function getUpdate() {
     tweetData.posToDisplay = [];
-    if (tweetData.followLast) {
-        for (var i = tweetData.tweetcount; i >= tweetData.tweetcount - 52; i--) {
-            tweetData.posToDisplay.push( i > 0 ? i : -1 );
+    if (tweetData.feedMode) {
+        if (tweetData.followLast) {
+            tweetData.position = tweetData.tweetcount;
+            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);
         }
-        tweetData.end = tweetData.tweetcount;
-        tweetData.start = Math.max(1, tweetData.end - 52);
+        if ($("#modeselector").text() != "Mode flux") {
+            $("#modeselector").html("Mode Flux").css({"color":"#000000","background":"#ffffff"});
+            $("#tweetlist").css({"background":"#ffffff"});
+        }
     } else {
-        for (var i = tweetData.position + 26; i >= tweetData.position - 26; i--) {
-            tweetData.posToDisplay.push( i > 0 && i <= tweetData.tweetcount ? i : -1 );
+        tweetData.linkedTweets.referenced_by.sort(function(a,b) { return b.pos - a.pos });
+        tweetData.linkedTweets.referencing.sort(function(a,b) { return b.pos - a.pos });
+        for (var i in tweetData.linkedTweets.referenced_by) {
+            tweetData.posToDisplay.push(tweetData.linkedTweets.referenced_by[i].pos);
         }
-        tweetData.end = Math.min(tweetData.tweetcount, tweetData.position + 26 );
-        tweetData.start = Math.max(1, tweetData.position - 26);
+        tweetData.posToDisplay.push(tweetData.position);
+        for (var i in tweetData.linkedTweets.referencing) {
+            tweetData.posToDisplay.push(tweetData.linkedTweets.referencing[i].pos);
+        }
+        if ($("#modeselector").text() != "Conversation") {
+            $("#modeselector").html("Conversation").css({"color":"#ffffff","background":"#000080"});
+            $("#tweetlist").css({"background":"#000080"});
+        }
     }
     var tweetsToGet = [];
-    for (var i = tweetData.start; i <= tweetData.end; i++) {
-        if (!tweetByPos(i)) {
-            tweetsToGet.push(i);
+    for (var i in tweetData.posToDisplay) {
+        if (tweetData.posToDisplay[i] != -1 && !tweetByPos(tweetData.posToDisplay[i])) {
+            tweetsToGet.push(tweetData.posToDisplay[i]);
         }
     }
     if (tweetsToGet.length) {
+//        console.log('We need to get '+tweetsToGet.join(','));
         socket.emit('updateTweets', {
             "tweets" : tweetsToGet
         });
     } else {
         drawTweetList();
-        //drawDisplay();
     }
+/*        html = '';
+        for (var i in tweetData.linkedTweets.referenced_by) {
+            console.log(tweetData.linkedTweets.referenced_by[i]);
+            html += tweetToHtml(tweetData.linkedTweets.referenced_by[i].tweet,'half');
+        }
+        html += tweetToHtml(tweetByPos(tweetData.position),'full');
+        for (var i in tweetData.linkedTweets.referencing) {
+            console.log(tweetData.linkedTweets.referencing[i]);
+            html += tweetToHtml(tweetData.linkedTweets.referencing[i].tweet,'half');
+        }
+        if (tweetData.htmlBuffer != html) {
+            $("#tweetlist").html(html);
+            tweetData.htmlBuffer = html;
+        } */
     if (tweetData.tlChanged || tweetData.tlLevelChanged) {
         socket.emit('updateTimeline', {
             "level" : tweetData.timeLevel,
@@ -139,6 +190,13 @@
     }
 }
 
+function addTweet(tweet) {
+    if (tweetData.posIndex.indexOf(tweet.pos) == -1) {
+        tweetData.tweets.push(tweet);
+        tweetData.posIndex.push(tweet.pos);
+    }
+}
+
 function tweetByPos(pos) {
     var index = tweetData.posIndex.indexOf(pos);
     return (index == -1 ? false : tweetData.tweets[index]);
@@ -181,15 +239,21 @@
             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;
+    if (tweetData.feedMode) {
+        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) );
         }
-        html += ( tweetData.posToDisplay[i] != -1 ? tweetToHtml(tweetByPos(tweetData.posToDisplay[i]), className) : placeHolder(className) );
+    } else {
+        for (var i in tweetData.posToDisplay) {
+            html += tweetToHtml(tweetByPos(tweetData.posToDisplay[i]), (tweetData.posToDisplay[i] == tweetData.position ? 'full' : 'half' ));
+        }
     }
     if (tweetData.htmlBuffer != html) {
         $("#tweetlist").html(html);
@@ -207,10 +271,27 @@
     
     var dtfintl = tweetData.timeline[ tweetData.timeline.length - 1 ].end,
         dtdebtl = 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});
+    if (tweetData.feedMode) {
+        var dtfintw = new Date( tweetByPos( tweetData.end ).created_at ),
+            dtdebtw = new Date( tweetByPos( tweetData.start ).created_at ),
+            rTop = scY * ( dtfintl - dtfintw ),
+            rHeight = scY * ( dtfintw - dtdebtw );
+        if (rHeight > 0) {
+            twPaper.rect( 0, rTop, 300, rHeight).attr({"stroke":"none","fill":"#8080ff","fill-opacity":.2});
+        } 
+    } else {
+        for (var i in tweetData.posToDisplay) {
+            if (tweetData.posToDisplay[i] != -1) {
+                var tw = tweetByPos(tweetData.posToDisplay[i]);
+                if (tw) {
+                    var dtcour = new Date( tw.created_at ),
+                        posY = scY * ( dtfintl - dtcour );
+                    twPaper.path("M0 "+posY+"L300 "+posY).attr({"stroke":"#88f"});
+                }
+            }
+        }
+    }
     var dtcour = new Date( tweetByPos( tweetData.position ).created_at ),
         posY = scY * ( dtfintl - dtcour ); 
     twPaper.path("M0 "+posY+"L300 "+posY).attr({"stroke":"#ff0"});
@@ -257,25 +338,14 @@
         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": annotations[j].colors.timeline});
-            posX += largX;
+            if (largX > 0) {
+                tlPaper.rect(posX, 600 - scaleY * (i+1), largX, scaleY).attr({"stroke": "none", "fill": annotations[j].colors.timeline});
+                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() {
@@ -286,23 +356,18 @@
         if (tweetData.tweetcount != data.tweetcount) {
             tweetData.tweetcount = data.tweetcount;
             tweetData.tlLevelChanged = true;
-            if (tweetData.followLast) {
-                tweetData.position = data.tweetcount;
-            }
             updateDisplay();
         }
     });
     socket.on('tweetPosByDate', function (data) {
         tweetData.position = data.tweetpos;
+        tweetData.feedMode = true;
         tweetData.followLast = (tweetData.position == tweetData.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);
-            }
+            addTweet(data[i]);
         }
         drawTweetList();
     });
@@ -323,14 +388,32 @@
         drawTimeLine();
     });
     socket.on('linkedTweets', function(data) {
-        console.log(data);
+        tweetData.followLast = false;
+        tweetData.feedMode = false;
+        tweetData.position = data.tweetpos;
+        tweetData.linkedTweets = data;
+        updateDisplay();
     });
     $("#tweetlist").mousewheel(function(e, d) {
         tweetData.wheelDelta += d;
         if (Math.abs(tweetData.wheelDelta) >= 1) {
-            tweetData.position = Math.min( tweetData.tweetcount, Math.max(1, parseInt(tweetData.wheelDelta) + tweetData.position ) );
-            tweetData.followLast = (tweetData.position == tweetData.tweetcount);
-            updateDisplay();
+            if (tweetData.feedMode) {
+                tweetData.position = Math.min( tweetData.tweetcount, Math.max(1, parseInt(tweetData.wheelDelta) + tweetData.position ) );
+                tweetData.followLast = (tweetData.position == tweetData.tweetcount);
+                updateDisplay();
+            } else {
+                if (tweetData.wheelDelta > 0) {
+                    if (tweetData.linkedTweets.referenced_by.length) {
+                        tweetData.position = tweetData.linkedTweets.referenced_by[tweetData.linkedTweets.referenced_by.length - 1].pos;
+                        getLinkedTweets();
+                    }
+                } else {
+                    if (tweetData.linkedTweets.referencing.length) {
+                        tweetData.position = tweetData.linkedTweets.referencing[0].pos;
+                        getLinkedTweets();
+                    }
+                }
+            }
             tweetData.wheelDelta = 0;
         }
         return false;
@@ -354,4 +437,5 @@
             clicTime = dtdebtl + (1 - ( offsetY / 600 ) ) * ( dtfintl - dtdebtl );
         socket.emit('tweetPosByDate',{ date: clicTime });
     });
+    $("#modeselector").click(changeMode);
 });
\ No newline at end of file