diff --git a/html/images/space.svg b/html/images/space.svg index 1c9e7e2..02ae9cf 100644 --- a/html/images/space.svg +++ b/html/images/space.svg @@ -156,6 +156,7 @@ let isReadingKeys = true; const svg = document.querySelector('svg'); + const bg = svg.querySelector('#bg'); const fps = document.querySelector("#fps"); const time = document.querySelector("#time"); const debug = document.querySelector("#debug"); @@ -465,6 +466,7 @@ allStartingEdges = findAllEdges(edgePts, position); ship.style.transform = ""; walls.forEach(w => w.setAttribute('fill', 'black')); + bg.style.fill = 'black'; time.innerText = "0"; } @@ -502,13 +504,12 @@ if (drawCollisionLines) updateTriangles(position); const collision = detectCollisions(position, allWallCorners, findAllEdges(allEdgePts, position)); - walls.forEach(w => w.setAttribute('fill', collision ? 'red' : 'black')); if (collision) { - // restart game - // zeroForTimer = timestamp; started = false; isReadingKeys = false; + walls.forEach(w => w.setAttribute('fill', 'red')); + bg.style.fill = 'red'; } if (restart) { @@ -521,11 +522,10 @@ const finished = edgeContainer.childElementCount <= 0; if (finished) started = false; - // if (+y < 200) - // if (timestamp < 10000) if (started) { time.innerText = ((timestamp - zeroForTimer) * 0.001).toFixed(3); - requestAnimationFrame(t => animate(t)); + // requestAnimationFrame(t => animate(t)); + requestAnimationFrame(animate); } } @@ -655,7 +655,6 @@ } }); - const bg = svg.querySelector('#bg'); const pointer = svg.querySelector('#pointer'); const xp = pointer.querySelector('.x'); const yp = pointer.querySelector('.y');