gistfile1.js

// ==UserScript==
// @name           Reddit Uppers and Downers
// @namespace      mistercow
// @description    Show up-votes and down-votes next to the total score on reddit comments.
// @include        http://*.reddit.com/*/comments/*
// @include        http://reddit.com/*/comments/*
// ==/UserScript==

/*
This code is provided as is, with no warranty of any kind.

I hacked it together in one night for my own use, and have not tested it extensively.

The script can slow down comment page load time; if the lag is noticeable, you may want
to change your preferences to load fewer comments per page.

Note that this runs once and does not install any persistent code on the page. So any votes
you cast will not affect the numbers displayed until you reload.

Also note that the ups and downs will not always add up to the score displayed on reddit.
I think this is because of caching on reddit's part. It's usually within one or two points though.

*/

(function() {
  
  // Add custom CSS for the votes.
  GM_addStyle(".moo_ups { color:rgb(255, 139, 36); font-weight:bold; }");
	GM_addStyle(".moo_downs { color:rgb(148,148,255); font-weight:bold; }");	

  // Figure out the URL for the JSON resource.
  var LOCATION = String(window.location);
  var JSON_URL = (LOCATION.indexOf("?") > -1) ?
    LOCATION.replace("?", "/.json?") :
    LOCATION + "/.json";
    
  // All the vote metadata we need will be stored in this table.
  var VOTE_TABLE = {};
  
  GM_xmlhttpRequest({
    method: "GET",
    url: JSON_URL,
    onload: onloadJSON
  });
  
  function onloadJSON(request) {
    //window._start = (new Date()).valueOf();
    var jsonText = request.responseText, data;
    
    // Use native JSON (if it's available) because it's much faster.
    if (window.JSON && JSON.parse) {
      data = JSON.parse(jsonText);
    } else {
      data = eval("(" + jsonText + ")");
    }
    
    processTree(data);
    displayVotes();
  	//window._end = (new Date()).valueOf();
    //alert("Took " + (_end - _start) + "ms.");
  }
  
  function processTree(obj) {
    if (obj instanceof Array) {
      for (var i = 0; i < obj.length; i++)
        processTree(obj[i]);
    }
    var data = obj.data;
    if (data) {
      // Skip deleted comments.
      if (isComment(obj) && data.author !== "[deleted]") {        
        var name = data.name;
        if (name) {
          VOTE_TABLE[name] = {
            downs: data.downs || 0,
            ups:   data.ups   || 0
          };
        }
      }
      
      processChildren(data);
      processReplies(data);      
    }
  }
  
  function isComment(obj) {
    return obj.kind === "t1";
  }
  
  function processChildren(data) {
    var children = data["children"];
    if (children) {
      for (var child in children) {
        processTree(children[child]);
      }
    }
  }
  
  function processReplies(data) {
    var replies = data["replies"];
    if (replies) processTree(replies);
  }
  
  function displayVotes() {
    var divs;
    if (document.querySelectorAll) {
      divs = document.querySelectorAll("div.comment");
    } else {
      divs = document.getElementsByTagName('div');
    }
    
    for (var i = 0, div, className; div = divs[i]; i++) {
      className = div.className;
      if (!className) continue;
      for (var name in VOTE_TABLE) {
        if (className.indexOf(name) > -1) {
          GM_log("handling " + name);
          handleComment(div, VOTE_TABLE[name]);
          delete VOTE_TABLE[name];
        }
      }
    }
  }
  
  function handleComment(div, votes) {
    if (div.__handled) return;
    var html = "(<span class='moo_ups'>" + votes.ups +
     "</span>|<span class='moo_downs'>" + votes.downs + "</span>)";
    
    var spans = div.getElementsByClassName("likes");
    for (var i = 0, span; i < 2; i++) {
      span = spans[i];
      if (span) span.parentNode.innerHTML += html;
    }
    div.__handled = true;
  }
})();