javascript - Metroアプリでのタイマーアプリの実装

Question

私はMetroアプリでゲームを開発しています。このゲームでは、ゲームを実行するための初期タイマーがあります。たとえば、約1分50秒で、タイマーに現在の時刻が表示されます。1分50秒の時間が経過すると、ゲームが終了し、メッセージが表示されます。このような動作をどのように実装しますか？

Answer 1

これは基本的にトリックを行いますが、これが私のアプリが行う唯一のことであるため、実際のパフォーマンスは異なる場合があり、スタイルやその他の点で他の改善が行われる可能性があります。

var timer = setInterval(function () {
    var div = document.getElementById('time'); // this is just a div

    // the div shows the time like this: "1:20" - 1 minute, 20 seconds
    var lastValue = div.innerText.split(':');

    var newValue = parseInt(lastValue[0]) * 60 + parseInt(lastValue[1]) + 1;

    if (newValue === 110) {
        div.innerText = "Game over!";
        clearInterval(timer);
    } else {
        div.innerText = Math.floor(newValue / 60) + ':' + newValue % 60;
    }
}, 1000);

より堅牢なものについては、この記事をご覧ください。やりたいことにかなり近づいているようです。

Answer 2

これを試すことができます（テストされていません）：

remainingTime = 110;
setInterval(function() {
        countdownStarted(); // game started
    }, 
    milliseconds // game will start in this much time
);

function countdownStarted() {
    setInterval(function() {
            remainingTime = remainingTime*100;
            updateTimeOnScreen(); // after every second
            if(remainingTime) countdownStarted();
        },
        100
    );
}

function updateTimeOnScreen() {
    if(remainingTime == 0) {
        timeUp(); // game over
    }
    // function continues
}

より多くの例については、この記事を読むことをお勧めします。

Answer 3

ユーザー定義の値に設定された setTimeout および clearTimeout メソッドを持つオブジェクトを作成できます。

このリンクからも役立つ情報が得られます。