Untitled

<!DOCTYPE html>
<html>
<head>
        <meta charset="utf-8">
        <title> Nowy.js demo</title>
        <style>
#gra
{
position: relative;
float: left;
margin: 10px;
width: 750;
height: 590px;
border: 2px solid black;
}
#tabela
{
   border: 2px solid black;
}
body { margin: 0; padding: 0; }
canvas { width: 100%; height: 100%; }

        </style>
</head>
<body>

    <DIV id="gra"></DIV>
<script src="three.min.js"></script>
<script>
    var pozx=1;
    var pozy=1;
    var punkty=0;


        var t = new Array(20);
        for (var i = 0; i < 20; i++) {
            t[i] = new Array(20);
        }

    function init()
    {
        t[0][5]=1;
        t[2][4]=1;
        t[0][6]=1;
        t[2][5]=1;
        t[2][2]=1;
        t[0][7]=1;
        t[2][3]=1;
        t[2][5]=1;
        t[9][4]=3;
        t[5][6]=3;
        t[6][5]=3;
        t[8][2]=1;
        t[1][7]=1;
        t[0][3]=1;
        t[17][3]=1;
        t[8][8]=1;
        t[12][12]=3;
        t[15][17]=3;
        t[3][12]=3;
        t[16][19]=3;
        t[14][11]=3;


    }


    function zeruj() {
        for (var i = 0; i < 20; i++)
            for (var j = 0; j < 20; j++)
                t[i][j] = 0;

    }

    function rysuj() {
        var html = '<table cellspacing="0" cellpadding="0" border="0">';
        for (var i = 0; i < t.length; i++) {
            html +='<TR>';
            for (var j = 0; j < t[i].length; j++)
            {
                if(i==pozx && j==pozy)
                html += '<TD><img src="cegla2.jpg"></TD>';
                else
                html += '<TD><img src="cegla' + t[i][j] + '.jpg"></TD>';
            }
            html += '</TR>';
        }
        html +='</TABLE>';
        document.getElementById("gra").innerHTML = html;
    }

     function sprawdz(){

        if(t[pozx] [pozy]==2)
            {
                t[pozx] [pozy]=0;
                punkty++;
            }
    }


    zeruj();
    init();
    rysuj();
    sprawdz();
 window.addEventListener('keydown', function(event) {
  switch (event.keyCode) {
    case 37: // Up
      pozy--;
          rysuj();
    break;

    case 38: // left
      pozx--;
            rysuj();

    break;

    case 39: // Down
       pozy++;
            rysuj();

    break;

    case 40: // Right
       pozx++;
            rysuj();

    break;
  }
}, false);


</script>

</body>
</html>