Edit in JSFiddle

var fernetjs = {};

fernetjs.juego = (function(){
    var reqAnimId,
        lastTime = Date.now(),
        time = 0,
        seleccion = null,
        prendidas = [],
        falladas = [],
        fallar = 0,
        fallarCoef = 3,
        fallasCant = 1,
        chispas = [],
        canvas,
        contexto,
        lucesTotal = 0;
    
    function actualizar(dt) {
        var luces = fernetjs.config.luces;
        
        for(var i=0; i<luces.length; i++){
            var luz = luces[i]; 
            
            if (seleccion){
                if (seleccionEnLuz(seleccion, luz)){
                    luz.golpe = 0.3;
                    seleccion = null;
                }
            }
            
            if (luz.golpe) {
                luz.falla = -1;
                luz.golpe -= dt;
                
                var idx = falladas.indexOf(i);
                if (idx >= 0) falladas.splice(idx, 1);
                
                if (luz.golpe <= 0){
                    prendidas.push(i);
                    lucesTotal++;
                    luz.golpe = null;
                    luz.x = luz.baseX;
                    luz.y = luz.baseY;
                    
                    fallarCoef -= 0.25;
                    if (fallarCoef < 1) fallarCoef = 1;
                }
                else {
                    luz.x += (Math.random() > 0.5 ? 1 : -1) * 0.5;
                    luz.y += (Math.random() > 0.5 ? 1 : -1) * 0.5;
                }
            }
            
            if(luz.falla > 0){
                luz.falla -= dt;
                if (luz.falla <= 0){
                    luz.falla = 0;   
                }
            }
        }
        
        fallar -= dt;
        
        function hacerFallo(){
            var rnd = Math.floor(Math.random()*(prendidas.length));
            var i = prendidas[rnd];
            var l = luces[i];
            if (l && l.falla === -1 && !l.golpe){
                l.falla = 0.6;
                crearChispas(l.x, l.y);
                falladas.push(i);
                prendidas.splice(rnd, 1);
                
                if (falladas.length === luces.length){
                    fernetjs.juego.detener();
                    fernetjs.dom.fin(true);
                }
            }
        }
        
        if (fallar <= 0){
           
            if (fallarCoef === 1 && fallasCant < 3){
                fallasCant++;
                fallarCoef = 3 * fallasCant/2;
            }
     
            for(var i=0; i<fallasCant; i++){
                hacerFallo();
            }
            
            fallar = fallarCoef;
        }
        
        actualizarChispas(dt);
        
        fernetjs.dom.luces(lucesTotal);
        fernetjs.dom.felicidad();
    }
    
    function actualizarChispas(dt){
        for(var i=0; i < chispas.length; i++){
            var chispa = chispas[i];
            chispa.vx += dt * 0.0005;
            chispa.vy += dt * 0.0002;
            
            chispa.vy += dt * 10;
            
            chispa.x += chispa.vx;
            chispa.y += chispa.vy;

            if (chispa.y > canvas.height) {
                chispas.splice(i, 1);
            }
        }
    }
    
    function seleccionEnLuz(p, luz){
        var dif = {
            x: luz.x - p.x,
            y: luz.y - p.y
        };
        var len = Math.sqrt(dif.x*dif.x + dif.y*dif.y);
        return len < luz.r;
    }
    
    function convertirRGBA(color, o){
        return 'rgba('+color[0]+','+color[1]+','+color[2]+', '+o+')';
    }

    function dibujarSoporte(luz, r, o){
        contexto.beginPath();
        contexto.arc(luz.x, luz.y, r/2, 0, 2 * Math.PI, false);
        contexto.fillStyle = convertirRGBA([0,0,0], 0.5);
        contexto.fill();
    }
    
    function dibujarLuz(luz, r, o){
        contexto.beginPath();
        contexto.arc(luz.x, luz.y, r, 0, 2 * Math.PI, false);
        if (luz.falla > 0.2)
            contexto.fillStyle = convertirRGBA(luz.c, luz.falla);
        else contexto.fillStyle = convertirRGBA(luz.c, o);
        contexto.fill();
    }
    
    function dibujarLuces(){
        var luces = fernetjs.config.luces;
        
        for(var i=0; i<luces.length; i++){
            dibujarSoporte(luces[i], 12);
            if (luces[i].falla === -1){
                dibujarLuz(luces[i], 20, 0.1);
                dibujarLuz(luces[i], 18, 0.1);
                dibujarLuz(luces[i], 16, 0.1);
                dibujarLuz(luces[i], 14, 0.1);
                dibujarLuz(luces[i], 12, ((Math.random()*6)+4)/10);
            }
            else {
                dibujarLuz(luces[i], 12, 0.2);
            }
        }
    }
    
    function dibujarChispas(){
        for(var i=0; i<chispas.length; i++){
            var c = chispas[i];
            contexto.beginPath();
            contexto.arc(c.x, c.y, c.r, 0, 2 * Math.PI, false);
            contexto.fillStyle = 'rgba(255,250,130,' + c.opacity + ')';
            contexto.fill();
        }
    }
    
    function dibujar() {
        contexto.clearRect(0, 0, canvas.width, canvas.height);
        
        dibujarChispas();
        dibujarLuces();
    }
    
    function crearChispas(x, y){
        for (var i=0; i<20; i++){
            chispas.push({
                x: x,
                y: y,
                r: Math.floor((Math.random()*3)+1),
                vx: Math.floor((Math.random()*5)+1) * (Math.random() > 0.5 ? 1 : -1) * 0.5,
                vy: Math.floor((Math.random()*10)+1) * (Math.random() > 0.5 ? 1 : -1) * 0.5,
                opacity: Math.floor((Math.random()*8)+2)/10
            });
        }
    }
    
    function colorDeLuz(col){
        var rangos = [[0,1,2], [4,5,6], [8,9], [11,12,13]];
        
        for(var i=0; i<rangos.length; i++){
            if (rangos[i].indexOf(col) >= 0)
                return fernetjs.config.colores[i];
        }
        
        return [0,0,0];
    }
    
    function crearLuces(){
        var lucesFuente = fernetjs.config.luces;
        var radio = fernetjs.config.radio;
        var luces = [];
        
        for(var i=0; i< lucesFuente.length; i++){
            for(var j=0; j< lucesFuente[i].length; j++){
                if (lucesFuente[i][j]){
                    var x = j*40 + 40;
                    var y = i*40 + 40;
                    luces.push({
                        x: x,
                        y: y,
                        c: colorDeLuz(j),
                        o: 0.6,
                        r: radio,
                        baseX: x,
                        baseY: y,
                        falla: -1
                    });
                }
            }
        }
        
        for(var i=0; i< luces.length; i++){
            prendidas.push(i);
        }
        
        fernetjs.config.luces = luces;
    }
    
    function iniciarControles(){
        $("#canvas").on('mouseup', function (e){
            var offset = $(e.target).offset();
            seleccion = {
                x: e.pageX - offset.left,
                y: e.pageY - offset.top
            };
        });   
    }
    
    function iniciarCanvas() {
        canvas = document.getElementById('canvas');
        if (canvas.getContext){
            contexto = canvas.getContext('2d');
        } 
        else throw new Error("canvas no soportado!");
        
        contexto.globalCompositeOperation = "lighter";
        
        crearLuces();
        iniciarControles();
    }
    
    function loop(){
        var now = Date.now();
        var delta = now - lastTime;
        lastTime = now;
        time += delta;
        
        actualizar(delta/1000);
        dibujar();
        
        reqAnimId = window.requestAnimationFrame(loop);
    }
    
    return {
        
        iniciar: function() {
            if (!canvas)
                iniciarCanvas();
            
            if(reqAnimId)
                this.detener();
            
            loop();
        },
        
        detener: function() {
            window.cancelAnimationFrame(reqAnimId);
            reqAnimId = 0;
        }
    }
  
})();

fernetjs.config = {
    radio: 12,
    colores: [
        [200,200,80], 
        [90,90,190],
        [90,190,90],
        [190,90,190]
    ],
    luces: [
        [0,1,0,0,0,1,0,0,0,1,0,0,0,1],
        [1,0,1,0,1,0,1,0,1,1,0,0,1,1],
        [0,0,1,0,1,0,1,0,0,1,0,1,0,1],
        [0,1,0,0,1,0,1,0,0,1,0,1,1,1],
        [1,0,0,0,1,0,1,0,0,1,0,0,0,1],
        [1,1,1,0,0,1,0,0,0,1,0,0,0,1]
    ]
};


fernetjs.imagenes = {};
fernetjs.imagenes.fondo = new Image();
var carga = 0;
fernetjs.imagenes.fondo.onload = function() { carga++; iniciar(); };
fernetjs.imagenes.fondo.src = 'http://fernetjs.com/wp-content/uploads/2013/12/newyear_game.png';

fernetjs.dom = {};
fernetjs.dom.luces = function(val){ 
    var txt = val;
    if (val < 10) txt = "00"+val;
    else if (val < 100) txt = "0"+val;
    $("#luces").text(txt); 
};

fernetjs.dom.felicidad = function(){ 
    $("#felicidad").css('color', '#'+Math.floor(Math.random()*16777215).toString(16)); 
};

fernetjs.dom.fin = function(){
    $("#fin").show();
    $("#canvas").off('mouseup');
};

$("#reiniciar").on("click", function(){
    window.location.reload();
});

function iniciar(){
    if (carga === 1) {
        fernetjs.juego.iniciar();
    }
}

<link href='http://fonts.googleapis.com/css?family=Press+Start+2P' rel='stylesheet' type='text/css'>
    
<div class="ctn">
    <canvas id="canvas" width="600" height="600"></canvas>
    <div class="estado">
        <label>Luces</label>
        <span id="luces">000</span>
        <label id="felicidad">FELIZ AÑO!!</label>        
    </div>
    <div id="fin" style="display:none;">
        <p>APAGóN!</p>
        <p>Feliz Año desde FernetJS!</p>
        <a id="reiniciar">reiniciar</a>
    </div>
</div>

.ctn {
    position: relative;
    width: 600px;
}

canvas, #fin {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}

#fin {
    background-color: rgba(0,0,0,0.5);
    width: 100%;
    height: 316px;
    z-index: 2;
    color: white;
    font-family: 'Press Start 2P', cursive;
}

#fin p {
    font-size: 20px;
    margin: 30px 20px;
}

#fin a {
    font-size: 25px;
    margin: 30px 20px;
    color: black;
    text-decoration: underline;
    float: right;
    display: inline-block;
    width: 224px;
    background-color: white;
    padding: 5px;
    cursor: pointer;
}

#fin a:hover {
    color: white;
    background-color: black;
}

canvas {
    background: url('http://fernetjs.com/wp-content/uploads/2013/12/newyear_game.png');
}

.estado {
    position: absolute;
    top: 320px;
    left: 0;
    width: 100%;
    height: 70px;
    font-family: 'Press Start 2P', cursive;
    color: white;
    font-size: 26px;
    padding-left: 8px;
    line-height: 2.5;
    overflow: hidden;
    z-index: 3;
}