JavaScript Game Loop

wee.js

//http://www.gamedev.net/topic/579738-web-javascript-game-loop/
//http://dev.opera.com/articles/view/framerate-control-system-for-javascript/
//http://jsfiddle.net/digitalicarus/4kshN/3/

var WEE = {
    FPS:           60,
    rate:          60,
    dt:            1/60,
    accrued:       0.0,
    last:          Date.now()/1000,
    fpsDisplay:    $('<div id="fpsDisplay"/>').appendTo('body')[0],
    frameCounter:  0,
    droppedFrames: 0,
    interval:      null,
    ciCallback:    function(){},
    upCallback:    function(){},
    rdCallback:    function(){},
    
    CheckInput:    function() {
        WEE.ciCallback();
    },
    Update:        function() {
        WEE.frameCounter++;
        WEE.droppedFrames++;
        WEE.upCallback();
    },
    Render:        function() {
        WEE.rate = (WEE.droppedFrames > 0) ? 
            ((WEE.rate+(WEE.FPS/(WEE.droppedFrames*2)))/2):((WEE.rate + WEE.FPS)/2);
        // just render every N frames to avoid a jarring display
        WEE.fpsDisplay.innerHTML = parseInt(WEE.rate,10)+" FPS";
        WEE.droppedFrames = -1;
        WEE.rdCallback();
    },
    GameLoop:      function() {
        var now = Date.now()/1000;
        WEE.accrued += (now-WEE.last);
        WEE.CheckInput();
        while(WEE.accrued > WEE.dt){
            WEE.Update();
            WEE.accrued -= WEE.dt;
        }
        WEE.Render();
        WEE.last = now;
    },
    setFPS:         function(fps) {
        WEE.FPS  = fps;
        WEE.rate = fps;
        WEE.dt   = 1/fps;
    },
    setCheckInput:  function(func) {
        WEE.ciCallback = func;
    },
    setUpdate:      function(func) {
        WEE.upCallback = func;
    },
    setRender:      function(func) {
        WEE.rdCallback = func;
    },
    start:          function() {
        WEE.interval = setInterval(WEE.GameLoop, 1);
    }
};


var key_W = 87;
var key_w = 119;
var key_D = 68;
var key_d = 100;
var key_S = 83;
var key_s = 115;
var key_A = 65;
var key_a = 97;
var key_pew = 32;
var accDisp;

var keys = {};

var dude = {
    accInc: 0.6,
    accTop: 4,
    decInc: 0.6/2, // decelleration
    
    maxBullets: 3,
    bullAcc: 5,
    bulletCount: 0,
    bullets: [],
    continuousFireBegin: 120, // num frames
    continuousFireDelay: 20, // num frames
    continuousFire: false,
    
    accY: 0.0,
    accX: 0.0,
    normalBg: 'transparent url(http://i44.tinypic.com/2ivn2mc.gif) -49px -272px no-repeat',
    upBg:     'transparent url(http://i44.tinypic.com/2ivn2mc.gif) -18px -271px no-repeat',
    downBg:   'transparent url(http://i44.tinypic.com/2ivn2mc.gif) -82px -275px no-repeat'
};

var init = function() {
    
    $(this).keydown(function(e) {
        console.log(e.which);
        keys[e.which] = true;
    });
    
    $(this).keyup(function(e) {
        delete keys[e.which];
    });

    $('html, body').css({
        'background': 'black',
        'color': 'white'
    });
    
    dude.img = $('<div>')
            .css({
                'background': dude.normalBg,
                'width': 23,
                'height': 13,
                'position': 'absolute',
                'left': 100,
                'top':  100
            })
            .appendTo('body');
      
    accDisp = $('<div/>').appendTo('body');
    $('<div>"w" "a" "s" "d" to fly</div>').appendTo('body');
      
};

var fire = function() {
    // see if continuous fire
    // create bullets if there aren't max on screen
    // move bullets forward
};

$(document).ready(function(){
    init();
    
    WEE.setUpdate(function(){
        for (var key in keys) {
            // Directions - Up, Right, Left, Down
            if (key == key_W || key == key_w) { // Player Up
                if(Math.abs(dude.accY - dude.accInc) <= dude.accTop) {
                    dude.accY -= dude.accInc;
                }
            }
            if (key == key_D || key == key_d) { // Player Right
                if(Math.abs(dude.accX + dude.accInc) <= dude.accTop) { 
                    dude.accX += dude.accInc;
                }
            }
            if (key == key_S || key == key_s) { // Player Down
                if(Math.abs(dude.accY + dude.accInc) <= dude.accTop) {
                    dude.accY += dude.accInc;
                }
            }
            if (key == key_A || key == key_a) { // 'A' and 'a' Key - Player Left
                if(Math.abs(dude.accX - dude.accInc) <= dude.accTop) {
                    dude.accX -= dude.accInc;
                }
            }
            if (key == key_pew) { // Pew!
                fire();
            }

        } // end for over keys
        
        if(!keys.key_W && !keys.key_w) {
                if(dude.accY + dude.decInc <= 0) {
                    dude.accY += dude.decInc;
                }
        }
        if(!keys.key_D && !keys.key_d) {
                if(dude.accX - dude.decInc >= 0) {
                    dude.accX -= dude.decInc;
                }
        }
        if(!keys.key_S && !keys.key_s) {
                if(dude.accY - dude.decInc >= 0) {
                    dude.accY -= dude.decInc;
                }
        }
        if(!keys.key_A && !keys.key_a) {
                if(dude.accX + dude.decInc <= 0) {
                    dude.accX += dude.decInc;
                }
        }

        dude.img.css({'left': (dude.img.offset().left + Math.round(dude.accX))});
        dude.img.css({'top': (dude.img.offset().top + Math.round(dude.accY))});
        
        if(Math.round(dude.accY) < 0) {
            dude.img.css({'background': dude.upBg});
        } else if(Math.round(dude.accY) > 0) {
            dude.img.css({'background': dude.downBg});
        } else {
            dude.img.css({'background': dude.normalBg});
        }
        
        accDisp.html('dude.accX: '+Math.round(dude.accX*100)/100+'<br/>dude.accY: '+Math.round(dude.accY*100)/100);
            
        
    });
    WEE.setFPS(60);
    WEE.start();
});​