ccm/miti.sh
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add additional maps

Browse Source
This commit is contained in:
Catalin Constantin Mititiuc
2025-12-21 14:06:07 -08:00
parent 5b594d369b
commit 60ac7f137b
1 changed files with 19 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

41
html/images/space.svg
View File

@@ -73,11 +73,13 @@
</g> </g>
</g> </g>
<!-- <polygon id="wall" points="20,20 40,20 40,40 20,40" /> --> <polygon class="wall" points="20,20 40,20 40,40 20,40" />
<!-- <polygon id="wall" points="-10,-30 -10,-40 30,-50 60,-30 80,0 150,0 150,10 60,50 -10,40 -20,20 20,20 20,-20" /> --> <!-- <polygon class="wall" points="-10,-30 -10,-40 30,-50 60,-30 80,0 150,0 150,10 60,50 -10,40 -20,20 20,20 20,-20" /> -->
<!-- <polygon id="wall" points="-130,-80 -40,-70 -70,-10 -100,40 -120,100" /> --> <!-- <polygon class="wall" points="-130,-80 -40,-70 -70,-10 -100,40 -120,100" /> -->
<polygon id="wall" class="wall" points="-130,-80 -40,-70 -70,-10" /> <!-- <g> -->
<polygon class="wall" points="50,70 90,-10 130,70" /> <!-- <polygon class="wall" points="-130,-80 -40,-70 -70,-10" /> -->
<!-- <polygon class="wall" points="50,70 90,-10 130,70" /> -->
<!-- </g> -->
<g id="triangles"></g> <g id="triangles"></g>
<g id="edges"></g> <g id="edges"></g>
@@ -138,7 +140,6 @@
const ship = document.querySelector(".ship"); const ship = document.querySelector(".ship");
const gun = ship.querySelector('#cannon'); const gun = ship.querySelector('#cannon');
const shipBody = ship.querySelector("#body"); const shipBody = ship.querySelector("#body");
const wall = document.querySelector('#wall');
const walls = document.querySelectorAll('.wall'); const walls = document.querySelectorAll('.wall');
const bulletsContainer = document.querySelector("#bullets"); const bulletsContainer = document.querySelector("#bullets");
const triangleContainer = document.querySelector('#triangles'); const triangleContainer = document.querySelector('#triangles');
@@ -147,11 +148,6 @@
const bulletPt = svg.createSVGPoint(); const bulletPt = svg.createSVGPoint();
const cornerPt = svg.createSVGPoint(); const cornerPt = svg.createSVGPoint();
const wallCorners = wall.getAttribute('points').split(' ').map(coords => {
const [x, y] = coords.split(',');
return [+x, +y];
});
const allWallCorners = [...walls].map(wall => const allWallCorners = [...walls].map(wall =>
wall.getAttribute('points').split(' ').map(coords => { wall.getAttribute('points').split(' ').map(coords => {
const [x, y] = coords.split(','); const [x, y] = coords.split(',');
@@ -159,24 +155,22 @@
} }
)); ));
const edgePts = wallCorners.map((pt, i, arr) => [pt, arr[(i + 1) % arr.length]]);
const allEdgePts = allWallCorners.map(w => const allEdgePts = allWallCorners.map(w =>
w.map((pt, i, arr) => [pt, arr[(i + 1) % arr.length]]) w.map((pt, i, arr) => [pt, arr[(i + 1) % arr.length]])
); );
const startingEdges = findEdges(edgePts, position);
const allStartingEdges = findAllEdges(allEdgePts, position); const allStartingEdges = findAllEdges(allEdgePts, position);
function distance(x1, y1, x2, y2) { function distance(x1, y1, x2, y2) {
return Math.sqrt((x2 - x1) ** 2 + (y2 - y1) ** 2); return Math.sqrt((x2 - x1) ** 2 + (y2 - y1) ** 2);
} }
function drawAllEdges(edges) { function drawAllEdges(walls) {
edges.forEach(edge => drawEdges(edge)); walls.forEach(edges => drawEdges(edges));
} }
function drawEdges(lpts) { function drawEdges(pts) {
let edges = lpts.map(e => e.join(' ')); let edges = pts.map(e => e.join(' '));
edges.forEach(e => { edges.forEach(e => {
const [x, y] = e.split(' '); const [x, y] = e.split(' ');
@@ -422,7 +416,9 @@
} }
function updateEdges(position) { function updateEdges(position) {
const collisionEdges = findEdges(edgePts, position); const collisionEdges = findAllEdges(allEdgePts, position);
// console.log(collisionEdges);
[...edgeContainer.children].forEach(l => { [...edgeContainer.children].forEach(l => {
const x1 = l.getAttribute('x1'); const x1 = l.getAttribute('x1');
@@ -433,8 +429,8 @@
if (collisionEdges.includes(edge)) if (collisionEdges.includes(edge))
if ([ if ([
edgeContainer.childElementCount <= startingEdges.length, edgeContainer.childElementCount <= allStartingEdges.length,
!startingEdges.includes(edge) !allStartingEdges.includes(edge)
].some(c => c)) ].some(c => c))
l.remove(); l.remove();
}); });
@@ -478,7 +474,8 @@
if (restart) { if (restart) {
restart = false; restart = false;
[...edgeContainer.children].forEach(c => c.remove());; [...edgeContainer.children].forEach(c => c.remove());;
drawEdges(edgePts); // drawEdges(edgePts);
drawAllEdges(allEdgePts);
} }
// const collision = detectCollision(wallCorners, position, findEdges(edgePts, position)); // const collision = detectCollision(wallCorners, position, findEdges(edgePts, position));
@@ -500,7 +497,7 @@
requestAnimationFrame(t => animate(t)); requestAnimationFrame(t => animate(t));
} }
drawEdges(edgePts); // drawEdges(edgePts);
drawAllEdges(allEdgePts); drawAllEdges(allEdgePts);
let force = 1; let force = 1;
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 20 KiB

After

Width:  |  Height:  |  Size: 19 KiB