Cubism Wikipedia Dashboard

dashboard.js

// Schema
/*
  {
    article: "Doubling time"
    logged_in: false
    revision: 511007853
    timestamp: 1347458208000
    wiki: "enwiki"
    __proto__: Object
  }
*/

// Data setup
var socket = io.connect( 'http://stat1.wikimedia.org:31337' );
var data = { 'enwiki':[], 'eswiki':[], 'ptwiki':[] };

// Socket update loop
socket.on( 'updates', function( updates ) {
  $.each( updates, function( i, update ) {

    if ( !data.hasOwnProperty( update['wiki'] ) ) {
      data[ update[ 'wiki' ] ] = [0];
    }

    var len = data[ update[ 'wiki' ] ].length;

    data[ update['wiki'] ].push( len+1 );
  });
});

var context = cubism.context()
    .serverDelay(0)
    .clientDelay(0)
    .step(1e3)
    .size(960);

function revisions(lang) {
  return context.metric(function(start, stop, step, callback) {
    var values = [];

    // convert start & stop to milliseconds
    start = +start;
    stop = +stop;

    while (start < stop) {
      start += step;

      for (var i = 0; i < data[lang].length; i++) {

        values.push( data[lang][i] );
      }
      //data[lang] = [];
    }

    callback(null, values);
  });
}

var endata = revisions('enwiki'),
    esdata = revisions('eswiki'),
    ptdata = revisions('ptwiki');

d3.select("#chart").call(function(div) {

  div.append("div")
      .attr("class", "axis")
      .call(context.axis().orient("top"));

  div.selectAll(".horizon")
      .data([endata, esdata, ptdata])
    .enter().append("div")
      .attr("class", "horizon")
      .call(context.horizon().extent([-20, 20]));

  div.append("div")
      .attr("class", "rule")
      .call(context.rule());

});