xhr progress monitor javascript

xhr-monitor.js

var oldXHR = window.XMLHttpRequest;

   var xhr_errors = 0;
   var xhr_loads = 0;
   var xhr_aborts = 0;
   var xhrStack = {};

   var xhr_count = 0;

    function newXHR() {
        var realXHR = new oldXHR();

        xhr_count++;
        var id = xhr_count;

        xhrStack[id] = {prog: 0};

        // realXHR.addEventListener("readystatechange", function() {
        //     console.log("xhr:new");
        // }, false);

        realXHR.addEventListener("progress", function(e) {
            console.log('xhr:progress');
            xhrStack[id].prog += 1;
            redraw();
        }, false);

        realXHR.addEventListener("error", function(e) {
            console.log('xhr:error');
            xhr_errors +=1;
            delete xhrStack[id];
            redraw();
        }, false);

        realXHR.addEventListener("abort", function(e) {
            console.log('xhr:abort');
            xhr_aborts +=1 ;
            delete xhrStack[id];
            redraw();
        }, false);

        realXHR.addEventListener("load", function(e) {
            console.log('xhr:done');
            xhr_loads +=1 ;
            delete xhrStack[id];
            redraw();
        }, false);

        return realXHR;
    }

    // setTimeout(function(){
    function redraw(){
      var i, p, rep = '';

      for(i in xhrStack) {
        rep  += '\ns';

        for (p=0; p<  xhrStack[i].prog; p++) {
          rep+='.';
        }

      }

      console.log(rep);
    };
    // }, 100);

    window.XMLHttpRequest = newXHR;
    console.log('ran');