function iniciar(){

    var bot=document.getElementById('boton');
    boton.disabled=true;
    boton.style.background="#F7D358";
    ctx=$('#canvas')[0].getContext("2d");
    contenedor=document.getElementById('contenedor');
    textopantalla=document.getElementById('pantalla');
    textopuntuacion=document.getElementById('puntuacion');
    x=150;
    y=280;

    $(document).mousemove(onMouseMove);

    pantalla=1;
    puntuacion=0;
    vidas=6;
    bloques=15;


    muerto=false;
    textopantalla.innerHTML="<div>"+' Pantalla :  '+pantalla+"</div>";
    contenedor.innerHTML="<div>"+' Vidas :  '+vidas+"</div>";
    textopuntuacion.innerHTML="<div>"+' Puntuacion :  '+puntuacion+"</div>";
    WIDTH=$('#canvas').width();
    HEIGHT=$('#canvas').height();
    paddlex=WIDTH/2;  //PARA PONER EL RECTANGULO EN LA MITAD DEL ANCHO;
    paddleh=10; //ANCHO DEL RECTANGULO
    paddley=HEIGHT-paddleh; //PARA PONER EL RECTANGULO UN POCO POR ENCIMA DEL FINAL DEL ANCHO
    paddlew=75; //LARGO DEL RECTANGULO
    //PARA EL RATON
    canvasMinX=$('#canvas').offset().left;
    canvasMaxX=canvasMinX + WIDTH;
    //PARA BLOQUES
    //NCOLS=5;
    NROWS=3;
    BRICKWIDTH=(WIDTH/NCOLS) - 1;
    BRICKWEIGHT=15;
    PADDING=1;
    bricks=new Array(NROWS);
        for (i=0;i<NROWS;i++){
            bricks[i]=new Array(NCOLS);
            for (j=0;j<NCOLS;j++){
                bricks[i][j]=1;
            }
        }
        dureza=new Array(NROWS);
        for (i=0;i<NROWS;i++){
            dureza[i]=new Array(NCOLS);
            for (j=0;j<NCOLS;j++){
                dureza[i][j]=2;
            }
        }



    return setInterval(draw,10+tiempo);
}

function circle(x,y,r){
    ctx.beginPath();
    ctx.arc(x,y,r,0,Math.PI*2,true);
    ctx.closePath();
    ctx.fill();
}

function rect(x,y,w,h){
    ctx.beginPath();
    ctx.rect(x,y,w,h);
    ctx.closePath();
    ctx.fill();
}

function clear(){
    ctx.clearRect(0,0,WIDTH,HEIGHT);
}

function draw(){
    textopuntuacion.innerHTML="<div>"+' Puntuacion :  '+puntuacion+"</div>";
    if(vidas==0){
        ctx.textAlign="center";
        ctx.textBaseline="middle";
        ctx.font="bold 30px verdana";
        ctx.fillStyle="#FF0080";
        ctx.fillText("HAS PERDIDO!!",150,150);}

    ctx.fillStyle="#2ECCFA";
    clear();

    ctx.fillStyle="#00FF00";
    circle(x,y,10);

    if(rightDown){
        if(paddlex<=WIDTH-75){
        paddlex +=5;
    }
    else{
    paddlex=WIDTH-73;
    }
    }
    else if(leftDown){
            if(paddlex>=5){
        paddlex -=5;
    }
    else{
    paddlex=0;
    }
    }

    ctx.fillStyle="#0000FF";
    rect(paddlex,paddley,paddlew,paddleh);

    //bloques

    for (i=0;i<NROWS;i++){
            for (j=0;j<NCOLS;j++){
                if(bricks[i][j]==1 && dureza[i][j]==2){
                    ctx.fillStyle="#FF0000";
                    //ctx.fillStyle='["#FF1C0A","#FFFD0A","#00A308","#0008DB","#EB0093"]';
                    rect((j * (BRICKWIDTH+PADDING)) + PADDING, (i*(BRICKWEIGHT+PADDING))+PADDING,BRICKWIDTH,BRICKWEIGHT);
                    }
                else if(bricks[i][j]==1 && dureza[i][j]==1){
                    ctx.fillStyle="#FFFF00";
                    //ctx.fillStyle='["#FF1C0A","#FFFD0A","#00A308","#0008DB","#EB0093"]';
                    rect((j * (BRICKWIDTH+PADDING)) + PADDING, (i*(BRICKWEIGHT+PADDING))+PADDING,BRICKWIDTH,BRICKWEIGHT);
                }
            }
    }
    ctx.fillStyle="#848484";
    rect(PADDING,PADDING,BRICKWIDTH,BRICKWEIGHT);
    rect(PADDING, (BRICKWEIGHT+PADDING)+PADDING,BRICKWIDTH,BRICKWEIGHT);
    rect(4*(BRICKWIDTH+PADDING) + PADDING, 2*(BRICKWEIGHT+PADDING)+PADDING,BRICKWIDTH,BRICKWEIGHT);
    //si golpea la bola un bloque
    rowheight = BRICKWEIGHT+PADDING;
    colwidth = BRICKWIDTH+PADDING;
    row=Math.floor(y/rowheight);
    col=Math.floor(x/colwidth);


    //rompemos el bloque y la bola vuelve
    if(y < NROWS * rowheight && row >= 0 && col >= 0 && bricks[row][col]==1 && dureza[row][col]==2){
    dy=-dy;
    puntuacion=puntuacion+50;
    bricks[row][col]=1;
    dureza[row][col]=1;
    }
    else if(y < NROWS * rowheight && row >= 0 && col >= 0 && bricks[row][col]==1 && dureza[row][col]==1){
    dy=-dy;
    bricks[row][col]=0;
    bricks[0][0]=1;
    bricks[1][0]=1;
    bricks[2][4]=1;
    if (bricks[row][col]==0){
        bloques--;
        puntuacion=puntuacion+100;
    }
    }

    if(x + dx > WIDTH || x + dx <0){
        dx=-dx;
    }
    if (y + dy <0){
        dy=-dy;
    }
    else if(y + dy +10> HEIGHT-paddleh){
        if(x > paddlex && x < paddlex + paddlew){
            dx=8*((x-(paddlex+paddlew/2))/paddlew);
            dy=-dy;
        }
        else if(y+dy+10>HEIGHT){
        muerto=true;
        clearInterval(intervalId);
    }
    }
    if(muerto){
        vidas--;
        muerto=false;
        contenedor.innerHTML="<div>"+' Vidas :  '+vidas+"</div>";
    }

    x += dx;
    y += dy;