Fix diagonal line — arrow animation only runs when visible, hidden by default

This commit is contained in:
justin committed 2026-05-20 12:31:33 -07:00
1 parent aed9b88315
commit ac0db62420
2 files changed
+12 -8

No files matched your search

+5 -6
View File
@@ -447,13 +447,12 @@ class Game {
_updateDirArrow(nearNPC) { _updateDirArrow(nearNPC) {
const arrow = document.getElementById('map-dir-arrow'); const arrow = document.getElementById('map-dir-arrow');
if (!arrow) return; if (!arrow) return;
if (nearNPC) { arrow.style.display = 'none'; return; } if (nearNPC) { arrow.classList.remove('visible'); return; }
const world = document.getElementById('map-inner'); const world = document.getElementById('map-world');
const viewH = world ? world.parentElement.offsetHeight : 300; const viewH = (world && world.offsetHeight) ? world.offsetHeight : 300;
arrow.textContent = '▶'; arrow.textContent = '▶';
arrow.style.display = 'block';
arrow.style.removeProperty('left');
arrow.style.bottom = (viewH * 0.28) + 'px'; arrow.style.bottom = (viewH * 0.28) + 'px';
arrow.classList.add('visible');
} }
_nearNPC() { _nearNPC() {
@@ -477,7 +476,7 @@ class Game {
return; return;
} }
const arrow = document.getElementById('map-dir-arrow'); const arrow = document.getElementById('map-dir-arrow');
if (arrow) arrow.style.display = 'none'; if (arrow) arrow.classList.remove('visible');
const bub = document.getElementById('player-bubble'); const bub = document.getElementById('player-bubble');
if (bub) bub.classList.remove('visible'); if (bub) bub.classList.remove('visible');
SFX.encounter(); SFX.encounter();
+7 -2
View File
@@ -475,9 +475,14 @@ html, body {
text-shadow: 0 0 6px rgba(248,192,48,.8), 2px 2px 0 rgba(0,0,0,.5); text-shadow: 0 0 6px rgba(248,192,48,.8), 2px 2px 0 rgba(0,0,0,.5);
pointer-events: none; pointer-events: none;
z-index: 50; z-index: 50;
animation: arrowPulse .7s ease-in-out infinite;
filter: drop-shadow(0 0 4px rgba(248,192,48,.6)); filter: drop-shadow(0 0 4px rgba(248,192,48,.6));
right: 12px; /* pinned to right edge of map viewport */ right: 12px;
display: none;
bottom: -9999px;
}
.map-dir-arrow.visible {
display: block;
animation: arrowPulse .7s ease-in-out infinite;
} }
/* NPC lives inside .map-inner, positioned in world-px via JS */ /* NPC lives inside .map-inner, positioned in world-px via JS */
.map-npc-wrap { position:absolute; text-align:center; z-index: 30; } .map-npc-wrap { position:absolute; text-align:center; z-index: 30; }