shmup/slaywithfriends
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix empty combat view on load and null state crash

Browse source 
Game div now starts hidden so map screen is the first thing visible.
Combat event handlers guard against null state.
This commit is contained in:
Jared Miller 2026-02-25 11:38:03 -05:00
parent 8ae3252a9c
commit 90c2aca72e
Signed by: shmup
GPG key ID: 22B5C6D66A38B06C
4 changed files with 27 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
index.html
View file

@ -7,7 +7,7 @@
<link rel="stylesheet" href="style.css">
</head>
<body>
<div id="game">
<div id="game" hidden>
<section id="enemy-zone">
<div id="enemy-info">
<span id="enemy-name"></span>

3
src/main.js
View file

@ -112,6 +112,7 @@ function checkEnd() {
function bindEvents() {
document.getElementById("hand").addEventListener("click", (e) => {
const cardEl = e.target.closest(".card");
if (!state) return;
if (!cardEl || state.combat.phase !== "player_turn") return;
const index = Number(cardEl.dataset.index);
@ -142,6 +143,7 @@ function bindEvents() {
});
document.getElementById("enemy-zone").addEventListener("click", () => {
if (!state) return;
if (state.combat.selectedCard === null) return;
if (state.combat.phase !== "player_turn") return;
@ -159,6 +161,7 @@ function bindEvents() {
document
.getElementById("end-turn-btn")
.addEventListener("click", async () => {
if (!state) return;
if (state.combat.phase !== "player_turn") return;
state = endTurn(state);

1
src/render.js
View file

@ -52,6 +52,7 @@ function formatIntent(action, enemy) {
if (e.type === "strength") return `str +${e.value}`;
return e.type;
});
if (parts.length === 0) return "zzz";
return parts.join(", ");
}

22
style.css
View file

@ -12,6 +12,10 @@
margin: 0 auto;
}
#game[hidden] {
display: none;
}
#enemy-zone {
flex: 4;
display: flex;
@ -56,8 +60,10 @@
inset: 0;
background: rgba(0, 0, 0, 0.7);
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 16px;
color: white;
font-size: 2rem;
}
@ -65,3 +71,19 @@
#overlay[hidden] {
display: none;
}
#reward-cards {
display: flex;
gap: 12px;
justify-content: center;
}
#reward-cards .reward-card {
width: 120px;
cursor: pointer;
transition: transform 0.15s;
}
#reward-cards .reward-card:hover {
transform: scale(1.1);
}