2048.html
changeset 1 8fb744f2df13
parent 0 2821cc5e0189
child 2 11da0a8fabf3
equal deleted inserted replaced
0:2821cc5e0189 1:8fb744f2df13
    26 </head>
    26 </head>
    27 <body>
    27 <body>
    28 
    28 
    29   <h1>2048</h1>
    29   <h1>2048</h1>
    30 
    30 
    31   <div class="score-area">Score: <span id="score">0</span>, Max: <span id="max">0</span></div>
    31   <div class="score-area">Score: <span id="score">0</span>, Max: <span id="max">0</span>, Speed: <span id="speed">0</span> t/s, Turn: <span id="turn">0</span></div>
    32 
    32 
    33   <div id="message-area"></div>
    33   <div id="message-area"></div>
    34 
    34 
    35   <table id="board">
    35   <table id="board">
    36     <tr>
    36     <tr>
   280       }
   280       }
   281     }
   281     }
   282     ui.score = {};
   282     ui.score = {};
   283     var scoreDom = document.getElementById("score");
   283     var scoreDom = document.getElementById("score");
   284     var maxDom = document.getElementById("max");
   284     var maxDom = document.getElementById("max");
       
   285     var speedDom = document.getElementById("speed");
       
   286     var turnDom = document.getElementById("turn");
   285     ui.score.clear = function(brd) {
   287     ui.score.clear = function(brd) {
   286       scoreDom.innerHTML = '0';
   288       scoreDom.innerHTML = '0';
   287       maxDom.innerHTML = '0';
   289       maxDom.innerHTML = '0';
       
   290       speedDom.innerHTML = '0';
       
   291       turnDom.innerHTML = '0';
   288     }
   292     }
   289     ui.score.update = function(brd) {
   293     ui.score.update = function(brd) {
   290       var score = board.score(brd);
   294       var score = board.score(brd);
   291       scoreDom.innerHTML = '' + score.score;
   295       scoreDom.innerHTML = '' + score.score;
   292       maxDom.innerHTML = '' + score.max;
   296       maxDom.innerHTML = '' + score.max;
       
   297     }
       
   298     ui.score.speed = function(speed, turn) {
       
   299       speedDom.innerHTML = '' + speed;
       
   300       turnDom.innerHTML = '' + turn;
   293     }
   301     }
   294 
   302 
   295     function start() {
   303     function start() {
   296       ui.score.clear();
   304       ui.score.clear();
   297       ui.message.clear();
   305       ui.message.clear();
   382     }
   390     }
   383     document.getElementById("step").addEventListener("click", step);
   391     document.getElementById("step").addEventListener("click", step);
   384 
   392 
   385     function finish() {
   393     function finish() {
   386       ui.message.clear();
   394       ui.message.clear();
       
   395       var step = 0;
       
   396       var tsFrom = new Date().getTime();
   387       while (!board.gameOver(board.current)) {
   397       while (!board.gameOver(board.current)) {
   388         var tmpBrd = board.create();
   398         var tmpBrd = board.create();
   389         board.copy(board.current, tmpBrd);
   399         board.copy(board.current, tmpBrd);
   390         var fn = ai.current(tmpBrd);
   400         var fn = ai.current(tmpBrd);
   391         if (typeof fn === 'undefined') {
   401         if (typeof fn === 'undefined') {
   399           ui.board.update(board.current);
   409           ui.board.update(board.current);
   400           ui.score.update(board.current);
   410           ui.score.update(board.current);
   401           ui.message.set("Wrong move!");
   411           ui.message.set("Wrong move!");
   402           return;
   412           return;
   403         }
   413         }
   404       }
   414         step++; 
       
   415       }
       
   416       var tsTo = new Date().getTime();
   405       ui.board.update(board.current);
   417       ui.board.update(board.current);
   406       ui.score.update(board.current);
   418       ui.score.update(board.current);
       
   419       ui.score.speed(step*1000.0/(tsTo-tsFrom), step);
   407       ui.message.set("Game over!");
   420       ui.message.set("Game over!");
   408     }
   421     }
   409     document.getElementById("finish").addEventListener("click", finish);
   422     document.getElementById("finish").addEventListener("click", finish);
   410 
   423 
   411     var ai = {};
   424     var ai = {};