diff --git a/html/images/space.svg b/html/images/space.svg index 9f39ef0..8248e53 100644 --- a/html/images/space.svg +++ b/html/images/space.svg @@ -198,10 +198,12 @@ - \ + + + - + @@ -340,9 +342,10 @@ const Draw = (() => { ship: ({ entity_id }) => { const node = Nodes[entity_id]; const gun = CannonNodes[entity_id]; - newPos = Position[entity_id]; - node.style.transform = `translate(${newPos.x}px, ${newPos.y}px)`; - gun.style.transform = `rotate(${Degrees[entity_id]}deg)`; + const p = Position[entity_id]; + const deg = Degrees[entity_id]; + node.style.transform = `translate(${p.x}px, ${p.y}px)`; + gun.style.transform = `rotate(${deg}deg)`; }, shot: ({ entity_id }, shot) => { @@ -1138,33 +1141,30 @@ function init() { Nodes[entity_id] = document.querySelector(`#${entity_id}`); CannonNodes[entity_id] = document.querySelector(`#${entity_id} .cannon`); GravityEffect[entity_id] = false; - // let node = document.querySelector(`#${entity_id}`); - // node.style.transform = `translate(${s.position.x}px, ${s.position.y}px)`; } Ships.forEach(({ entity_id }) => { setInits(entity_id, { acceleration: { x: 0, y: 0 }, velocity: { x: 0, y: 0 }, - position: { x: -50, y: 0 }, + position: { x: 3, y: 0 }, angularAcceleration: 0, angularVelocity: 0, degrees: 0 }); }); + // player ship setInits("ship1", { acceleration: { x: 0, y: 0 }, velocity: { x: 0, y: 0 }, - position: { x: 3, y: -6 }, + position: { x: -50, y: 0 }, angularAcceleration: 0, angularVelocity: 0, degrees: 0 }); - Ships.forEach(({ entity_id }) => { - Draw.ship({ entity_id }); - }); + Ships.forEach(Draw.ship); [...edgeContainer.children].forEach(c => c.remove());; @@ -1433,10 +1433,10 @@ function animate(timestamp) { frameCount++; } - Ships.forEach(({ entity_id }) => { - Move.ship({ entity_id }, elapsed); - Rotate.update({ entity_id }, elapsed); - Draw.ship({ entity_id }); + Ships.forEach(s => { + Move.ship(s, elapsed); + Rotate.update(s, elapsed); + Draw.ship(s); }); // updateEdges(position); @@ -1478,34 +1478,6 @@ let rotateCWPressed = false; let rotateCCWPressed = false; const { entity_id } = Ships[0]; -function drawShot(shot) { - const lineEl = document.createElementNS(namespaceURIsvg, 'line'); - lineEl.classList.add('bullet'); - lineEl.setAttribute('x1', shot.origin.x); - lineEl.setAttribute('y1', shot.origin.y); - lineEl.setAttribute('x2', shot.target.x); - lineEl.setAttribute('y2', shot.target.y); - lineEl.addEventListener('transitionend', e => e.target.remove()); - setTimeout(() => lineEl.classList.add('fade'), 1000); - const tipEl = document.querySelector("#ship1 .cannon .tip") - tipEl.classList.remove("recoil"); - setTimeout(() => tipEl.classList.add('recoil'), 0); - - let pt, hit; - for (let i = 0; i <= lineEl.getTotalLength(); i++) { - pt = lineEl.getPointAtLength(i); - hit = [...wallElements].find(el => el.isPointInFill(pt)); - if (hit) break; - } - - if (hit) { - lineEl.setAttribute('x2', pt.x); - lineEl.setAttribute('y2', pt.y); - } - - return bulletsContainer.appendChild(lineEl); -} - document.addEventListener("keydown", function(e) { if (!isReadingKeys) return;