Как я могу перезапустить игру, когда я нажимаю ENTER?

Я сделал простую игру, и она почти готова, осталось только сделать так, чтобы игра перезапускалась при нажатии Enter. Теперь игра запускается, когда я нажимаю Enter, но не перезапускается.

Может кто-то мне помочь, пожалуйста?

это код запуска игры

document.onkeydown = function tast (e) {
        if (e.keyCode == 39) {  // høyre
            høyre = 1;  
        } 
        if (e.keyCode == 37) {  // venstre
            venstre = 1;  
        } 
        if (e.keyCode == 38) {  // opp 
            opp = 1; 
        } 
        if (e.keyCode == 40) {  // ned
            ned = 1;              
        } 
        if(e.keyCode == 32) {
            newskudd();
            snd.play();
            console.log("hit space")
        }
        if(e.keyCode == 13){
            spill();
        }

} 

чтобы увидеть демонстрацию, щелкните ссылку DEMO.

разлив(); функция

function spill() {

    ctx.clearRect(0, 0, canvas.width, canvas.height);

    for (var i = 0; i < kuler.length; i++) { 
        kuler[i].x += 0;
        kuler[i].y += kuler[i].dy;


        ctx.fillStyle = kuler[i].f;
        ctx.beginPath();
        ctx.arc(kuler[i].x, kuler[i].y, kuler[i].r, 2*Math.PI, 0);
        ctx.closePath();
        ctx.fill();

        if (venstre == 1){
            kuler[0].x -= 4;
        }
        if (høyre == 1){
            kuler[0].x += 4;;
        }
        if (opp == 1){
            kuler[0].y -= 4;
        }
        if (ned == 1){
            kuler[0].y += 4;
        }


        if (kuler[0].x >= canvas.width-kuler[0].r) {
            kuler[0].x = canvas.width-kuler[0].r
        };
        if (kuler[0].x <= 0+kuler[0].r) {
            kuler[0].x = 0+kuler[0].r
        };
        if (kuler[0].y >= canvas.height-kuler[0].r) {
            kuler[0].y = canvas.height-kuler[0].r
        };
        if (kuler[0].y <= 0+kuler[0].r) {
            kuler[0].y = 0+kuler[0].r
        };



    for (var j = 0; j < fiender.length; j++) { 
        ctx.fillStyle = "blue";
        ctx.beginPath();
        ctx.arc(fiender[j].x, fiender[j].y, fiender[j].r, 2*Math.PI, 0);
        ctx.closePath();
        ctx.fill();

        fiender[j].y += fiender[j].vy;

        if (fiender[j].x >=  canvas.width -fiender[j].r) {
            fiender[j].x =canvas.width - fiender[j].r;
        };
        if (fiender[j].x  <= 0 + fiender[j].r) {
            fiender[j].x =0 + fiender[j].r;
        };  

        if (fiender[j].vy >= 2) {
            fiender[j].vy = 2;  
        };


        /*if (fiender[j].y + fiender[j].r >= kuler[i].y && fiender[j].x + fiender[j]. == kuler[i].x) { // remove kuler[i] and fiender[j] } 
            fiender.splice(j, 1);
            kuler.splice(i,1);
        };*/

        var distanceFromCenters = Math.sqrt(Math.pow(Math.abs(fiender[j].x - kuler[i].x),2) + Math.pow(Math.abs(fiender[j].y - kuler[i].y),2 )); // you have a collision
        if (distanceFromCenters <= (fiender[j].r + kuler[i].r)) {
            fiender.splice(j, 1);
            kuler.splice(i,1);
            poeng += 1;
        } else if (fiender[j].y > canvas.height) {
            fiender.splice(j,1)
        }

        if(j > 1){ 
            fiender.splice(j,1)

        }       

        tekst.innerHTML = ( "Poeng: " + poeng  )
    }
}
    requestAnimationFrame(spill);
}

person morten    schedule 11.12.2014    source источник
comment
Вы уверены, что имя høyre будет поддерживаться везде?   -  person u_mulder    schedule 11.12.2014
comment
høyre это просто название направления в норвежском языке   -  person morten    schedule 11.12.2014
comment
все работает кроме рестат кода   -  person morten    schedule 11.12.2014
comment
Я быстро просмотрел вашу демонстрацию, spill() вызывается, как и ожидалось, каждый раз, когда нажимается ввод. Это приводит к ускорению игры перед ее завершением и, по-видимому, не имеет никакого эффекта после этого. В любом случае, похоже, проблема не в коде, который вы разместили здесь.   -  person Adam H    schedule 11.12.2014
comment
@morten, как сказал Адам, клавиша enter работает нормально, но имеет непредвиденные последствия. Вам нужно опубликовать функцию spill(), чтобы мы могли посмотреть. Скорее всего вам нужно сбросить переменные и clearTimeouts() чтобы сбросить таймеры.   -  person Growler    schedule 11.12.2014
comment
теперь я отредактировал сообщение, чтобы вы могли видеть разлив(); функция на дне   -  person morten    schedule 11.12.2014
comment
@morten, если мой ответ поможет вам, примите как ответ   -  person Growler    schedule 28.01.2015


Ответы (1)


Я думаю, что каждый раз, когда вы нажимаете spill(), вы начинаете новый цикл requestAnimationFrame. Таким образом, каждый раз, когда вы нажимаете spill(), вы фактически дважды вызываете преобразование y coordinate: fiender[j].y += fiender[j].vy;

Прочитайте здесь, как правильно запускать/останавливать window.requestAnimationFrame

var requestId;

function loop() {
    ...
    // do stuff
    ...
    requestId = window.requestAnimationFrame(loop, canvas);
}

function start() {
    if (!requestId) {
       loop();
    }
}

function stop() {
    if (requestId) {
       window.cancelAnimationFrame(requestId);
       requestId = undefined;
    }
}
person Growler    schedule 11.12.2014