Gribble!

A fiddle for gribble

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">

JavaScript

// From Konstantin with love.
var size = 30;

// Take RGB values and return a CSS formatted string representation.
function toCSS(r,g,b){
    return "rgb("+r+","+g+","+b+")";
}

// Return a pseudorandom number between 0 and 255
function rcv(){
    return Math.floor(Math.random()*256);
}

// Picks a random number from 0 to 3.
// Based on that number, returns a direction
// and the closest point at which the tile would
// be off the screen.
function goDirection(){
    var num = Math.floor(Math.random()*4);
    if(num==0){
        return ['top', $(document).height()];
    } else if(num==1){
        return ['left', $(document).width()];
    } else if(num==2){
        return ['top', -100];
    } else if(num==3){
        return ['left', -100];
    }
}

function gribble(x,y){
    var memory = Math.floor(Math.random()*2000+2000)
    // Create a gribble-tile, and shunt it.
    var name = gribset(x,y);
    // Now pause for a bit before
    setTimeout(function(){
        if(Math.floor(Math.random()*100)%10==0){
            $("#"+name).fadeOut(250).promise().done(function(){
                $("#"+name).remove();
            });
        } else {
            shunt(name);
        }
    }, memory);
}

function gribset(x,y){
    // From the x,y coordinates, grab the nearest
    // grid space and make sure there isn't something
    // in that space already. (We dont need to stack,
    // layers, just change the color of the last one)
    var index_X = Math.floor(x/size);
    var index_Y = Math.floor(y/size);
    var name = index_X + "_" + index_Y + "_cell";
    var exists = document.getElementById(name);
    if(exists == null){
        $("body").append("<div id='"+name+"'></div>");
        $("#"+name).css({'display': 'none'});
        $("#"+name).fadeIn(250).promise();
    }

    // Now add the color, place the tile,
    // and pretty it up with some css.
    var color = toCSS(rcv(), rcv(), rcv());
    $("#"+name).css({
        'position': 'absolute',
        'background-color':...