Запрос холстаAnimationFrame pause

Как приостановить анимацию холста с помощью requestAnimationFrame? Я начинаю анимацию следующим образом:

код:

window.requestAnimFrame = (function() {
    return  window.requestAnimationFrame       ||
            window.webkitRequestAnimationFrame ||
            window.mozRequestAnimationFrame    ||
            function(callback) {
                window.setTimeout(callback, 1000 / 60);
            };
})();

function Start() {
    Update();
    requestAnimFrame(Start);
}

Start();

Теперь я хочу добавить параметр приостановки после завершения работы. Есть ли простой способ сделать это?

Ответ 1

Что вы можете сделать, это создать переменную, в которой хранится состояние вашей анимации: приостановлено или приостановлено. Меняйте это состояние каждый раз, когда вы нажимаете кнопку. Что-то вроде этого должно работать:

var isPaused = false;

window.requestAnimFrame = (function() {
    return  window.requestAnimationFrame       ||
            window.webkitRequestAnimationFrame ||
            window.mozRequestAnimationFrame    ||
            function(callback) {
                window.setTimeout(callback, 1000 / 60);
            };
})();

function Start() {
    if (isPaused) {
        Update();
    }

    requestAnimFrame(Start);
}

window.onkeydown = function() {
    isPaused = !isPaused; // flips the pause state
};

Start();