codegirl007
/
theprimeagen-spire
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

fix bug where collected cards are not initialized as part of the deck

main
Stephanie Gredell 4 months ago
parent
e18eb017d3
commit
b07309fe8d
2 changed files with 440 additions and 275 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 7
      src/engine/battle.js
  2. 296
      style.css

7
src/engine/battle.js
Unescape View File

@ -1,7 +1,7 @@
import { ENEMIES } from "../data/enemies.js"; import { ENEMIES } from "../data/enemies.js";
import { RELICS } from "../data/relics.js"; import { RELICS } from "../data/relics.js";
import { CARDS } from "../data/cards.js"; import { CARDS } from "../data/cards.js";
import { draw, endTurnDiscard, clamp, cloneCard } from "./core.js"; import { draw, endTurnDiscard, clamp, cloneCard, shuffle } from "./core.js";
export function createBattle(ctx, enemyId) { export function createBattle(ctx, enemyId) {
const enemyData = ENEMIES[enemyId]; const enemyData = ENEMIES[enemyId];
@ -10,6 +10,11 @@ export function createBattle(ctx, enemyId) {
ctx.flags = {}; ctx.flags = {};
ctx.lastCard = null; ctx.lastCard = null;
// Initialize draw pile from current deck for the battle
ctx.player.draw = shuffle(ctx.player.deck.slice());
ctx.player.discard = [];
ctx.player.hand = [];
const relicCtx = { const relicCtx = {
...ctx, ...ctx,

296
style.css
Unescape View File

@ -366,13 +366,19 @@ h3 {
gap: 15px; gap: 15px;
} }
.energy-section, .gold-section, .block-section, .relics-section { .energy-section,
.gold-section,
.block-section,
.relics-section {
display: flex; display: flex;
align-items: center; align-items: center;
gap: 4px; gap: 4px;
} }
.energy-label, .gold-icon, .block-icon, .relics-label { .energy-label,
.gold-icon,
.block-icon,
.relics-label {
font-size: 14px; font-size: 14px;
} }
@ -474,7 +480,8 @@ h3 {
opacity: 0.4; opacity: 0.4;
} }
.gold-amount, .block-amount { .gold-amount,
.block-amount {
font-weight: bold; font-weight: bold;
font-size: 14px; font-size: 14px;
color: #d4af37; color: #d4af37;
@ -522,13 +529,27 @@ h3 {
} }
@keyframes sparkle { @keyframes sparkle {
0% { opacity: 0.3; } 0% {
100% { opacity: 0.8; } opacity: 0.3;
}
100% {
opacity: 0.8;
}
} }
@keyframes pulse { @keyframes pulse {
0%, 100% { transform: translate(-50%, -50%) scale(1); opacity: 0.1; }
50% { transform: translate(-50%, -50%) scale(1.1); opacity: 0.2; } 0%,
100% {
transform: translate(-50%, -50%) scale(1);
opacity: 0.1;
}
50% {
transform: translate(-50%, -50%) scale(1.1);
opacity: 0.2;
}
} }
@ -644,23 +665,53 @@ h3 {
} }
@keyframes enemyIdle { @keyframes enemyIdle {
0% { transform: translateY(0px) scale(1); } 0% {
100% { transform: translateY(-10px) scale(1.02); } transform: translateY(0px) scale(1);
}
100% {
transform: translateY(-10px) scale(1.02);
}
} }
@keyframes shadowPulse { @keyframes shadowPulse {
0% { transform: scaleX(1); opacity: 0.3; } 0% {
100% { transform: scaleX(1.1); opacity: 0.2; } transform: scaleX(1);
opacity: 0.3;
}
100% {
transform: scaleX(1.1);
opacity: 0.2;
}
} }
@keyframes shieldGlow { @keyframes shieldGlow {
0%, 100% { transform: scale(1); opacity: 0.8; }
50% { transform: scale(1.2); opacity: 1; } 0%,
100% {
transform: scale(1);
opacity: 0.8;
}
50% {
transform: scale(1.2);
opacity: 1;
}
} }
@keyframes debuffPulse { @keyframes debuffPulse {
0%, 100% { transform: scale(1); opacity: 0.7; }
50% { transform: scale(1.1); opacity: 1; } 0%,
100% {
transform: scale(1);
opacity: 0.7;
}
50% {
transform: scale(1.1);
opacity: 1;
}
} }
@ -702,8 +753,13 @@ h3 {
} }
@keyframes playerIdle { @keyframes playerIdle {
0% { transform: translateY(0px) scale(1); } 0% {
100% { transform: translateY(-10px) scale(1.02); } transform: translateY(0px) scale(1);
}
100% {
transform: translateY(-10px) scale(1.02);
}
} }
@ -730,16 +786,19 @@ h3 {
scale: 0.5; scale: 0.5;
transform: translate(-50%, -50%) translateY(0px); transform: translate(-50%, -50%) translateY(0px);
} }
15% { 15% {
opacity: 1; opacity: 1;
scale: 1.4; scale: 1.4;
transform: translate(-50%, -50%) translateY(-10px); transform: translate(-50%, -50%) translateY(-10px);
} }
30% { 30% {
opacity: 1; opacity: 1;
scale: 1.2; scale: 1.2;
transform: translate(-50%, -50%) translateY(-20px); transform: translate(-50%, -50%) translateY(-20px);
} }
100% { 100% {
opacity: 0; opacity: 0;
scale: 0.8; scale: 0.8;
@ -1152,8 +1211,13 @@ h3 {
} }
@keyframes scanline { @keyframes scanline {
0% { transform: translateX(-100%); } 0% {
100% { transform: translateX(100%); } transform: translateX(-100%);
}
100% {
transform: translateX(100%);
}
} }
.enemy-nameplate { .enemy-nameplate {
@ -1234,9 +1298,20 @@ h3 {
background: rgba(220, 53, 69, 0.1); background: rgba(220, 53, 69, 0.1);
margin-top: 10px; margin-top: 10px;
} }
.intent-info { border-color: #17a2b8; background: rgba(23, 162, 184, 0.1); }
.intent-warning { border-color: #ffc107; } .intent-info {
.intent-success { border-color: #28a745; background: rgba(40, 167, 69, 0.1); } border-color: #17a2b8;
background: rgba(23, 162, 184, 0.1);
}
.intent-warning {
border-color: #ffc107;
}
.intent-success {
border-color: #28a745;
background: rgba(40, 167, 69, 0.1);
}
.intent-icon { .intent-icon {
font-size: 24px; font-size: 24px;
@ -1277,7 +1352,8 @@ h3 {
margin-bottom: 5px; margin-bottom: 5px;
} }
.player-shield, .player-debuff { .player-shield,
.player-debuff {
position: absolute; position: absolute;
font-size: 16px; font-size: 16px;
top: -5px; top: -5px;
@ -1296,13 +1372,15 @@ h3 {
align-items: center; align-items: center;
} }
.player-health-display, .player-energy-display { .player-health-display,
.player-energy-display {
display: flex; display: flex;
align-items: center; align-items: center;
gap: 10px; gap: 10px;
} }
.health-icon, .energy-label { .health-icon,
.energy-label {
font-size: 16px; font-size: 16px;
} }
@ -1508,7 +1586,8 @@ h3 {
opacity: 0.8; opacity: 0.8;
} }
.battle-tips, .battle-tips-bottom { .battle-tips,
.battle-tips-bottom {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 5px; gap: 5px;
@ -1613,14 +1692,45 @@ h3 {
} }
.battle-card:nth-child(1) { transform: rotate(-8deg); z-index: 1; } .battle-card:nth-child(1) {
.battle-card:nth-child(2) { transform: rotate(-4deg); z-index: 2; } transform: rotate(-8deg);
.battle-card:nth-child(3) { transform: rotate(-2deg); z-index: 3; } z-index: 1;
.battle-card:nth-child(4) { transform: rotate(0deg); z-index: 4; } }
.battle-card:nth-child(5) { transform: rotate(2deg); z-index: 5; }
.battle-card:nth-child(6) { transform: rotate(4deg); z-index: 6; } .battle-card:nth-child(2) {
.battle-card:nth-child(7) { transform: rotate(8deg); z-index: 7; } transform: rotate(-4deg);
.battle-card:nth-child(8) { transform: rotate(12deg); z-index: 8; } z-index: 2;
}
.battle-card:nth-child(3) {
transform: rotate(-2deg);
z-index: 3;
}
.battle-card:nth-child(4) {
transform: rotate(0deg);
z-index: 4;
}
.battle-card:nth-child(5) {
transform: rotate(2deg);
z-index: 5;
}
.battle-card:nth-child(6) {
transform: rotate(4deg);
z-index: 6;
}
.battle-card:nth-child(7) {
transform: rotate(8deg);
z-index: 7;
}
.battle-card:nth-child(8) {
transform: rotate(12deg);
z-index: 8;
}
.battle-card.playable:hover { .battle-card.playable:hover {
@ -2139,7 +2249,8 @@ h3 {
padding: 40px; padding: 40px;
} }
.block-display, .debuff-display { .block-display,
.debuff-display {
display: inline-block; display: inline-block;
background: rgba(110, 168, 254, 0.2); background: rgba(110, 168, 254, 0.2);
padding: 4px 8px; padding: 4px 8px;
@ -2423,8 +2534,13 @@ h3 {
} }
@keyframes avatarGlow { @keyframes avatarGlow {
0% { opacity: 0.6; } 0% {
100% { opacity: 1; } opacity: 0.6;
}
100% {
opacity: 1;
}
} }
.tooltip-avatar-img { .tooltip-avatar-img {
@ -2483,17 +2599,13 @@ h3 {
.relic-title-logo svg { .relic-title-logo svg {
filter: filter:
drop-shadow(0 0 20px rgba(255, 215, 0, 0.4)) drop-shadow(0 0 20px rgba(255, 215, 0, 0.4)) drop-shadow(0 0 40px rgba(255, 140, 0, 0.3)) drop-shadow(4px 4px 8px rgba(0, 0, 0, 0.6));
drop-shadow(0 0 40px rgba(255, 140, 0, 0.3))
drop-shadow(4px 4px 8px rgba(0, 0, 0, 0.6));
transition: all 0.3s ease; transition: all 0.3s ease;
} }
.relic-title-logo:hover svg { .relic-title-logo:hover svg {
filter: filter:
drop-shadow(0 0 30px rgba(255, 215, 0, 0.6)) drop-shadow(0 0 30px rgba(255, 215, 0, 0.6)) drop-shadow(0 0 60px rgba(255, 140, 0, 0.4)) drop-shadow(4px 4px 8px rgba(0, 0, 0, 0.6));
drop-shadow(0 0 60px rgba(255, 140, 0, 0.4))
drop-shadow(4px 4px 8px rgba(0, 0, 0, 0.6));
transform: scale(1.05); transform: scale(1.05);
} }
@ -2649,8 +2761,13 @@ h3 {
} }
@keyframes relicGlow { @keyframes relicGlow {
0% { transform: rotate(0deg); } 0% {
100% { transform: rotate(360deg); } transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
} }
.relic-portrait .relic-icon { .relic-portrait .relic-icon {
@ -3124,10 +3241,13 @@ h3 {
} }
@keyframes currentPulse { @keyframes currentPulse {
0%, 100% {
0%,
100% {
transform: scale(1); transform: scale(1);
opacity: 1; opacity: 1;
} }
50% { 50% {
transform: scale(1.2); transform: scale(1.2);
opacity: 0.3; opacity: 0.3;
@ -3274,16 +3394,13 @@ h3 {
.deck-stack:hover .deck-stack-card { .deck-stack:hover .deck-stack-card {
transform: transform:
translateX(calc(var(--card-index) * -140px)) translateX(calc(var(--card-index) * -140px)) translateY(calc(var(--card-index) * -30px));
translateY(calc(var(--card-index) * -30px));
z-index: calc(30 + var(--card-index)); z-index: calc(30 + var(--card-index));
} }
.deck-stack:hover .deck-stack-card:hover { .deck-stack:hover .deck-stack-card:hover {
transform: transform:
translateX(calc(var(--card-index) * -140px)) translateX(calc(var(--card-index) * -140px)) translateY(calc(var(--card-index) * -30px - 15px)) scale(1.05);
translateY(calc(var(--card-index) * -30px - 15px))
scale(1.05);
z-index: 100; z-index: 100;
} }
@ -3900,7 +4017,8 @@ h3 {
font-weight: bold; font-weight: bold;
} }
.gold-icon, .price-icon { .gold-icon,
.price-icon {
width: 24px; width: 24px;
height: 24px; height: 24px;
object-fit: contain; object-fit: contain;
@ -4433,10 +4551,13 @@ h3 {
} }
@keyframes defeatPulse { @keyframes defeatPulse {
0%, 100% {
0%,
100% {
transform: scale(1); transform: scale(1);
filter: drop-shadow(0 0 20px rgba(139, 69, 19, 0.6)); filter: drop-shadow(0 0 20px rgba(139, 69, 19, 0.6));
} }
50% { 50% {
transform: scale(1.05); transform: scale(1.05);
filter: drop-shadow(0 0 30px rgba(139, 69, 19, 0.8)); filter: drop-shadow(0 0 30px rgba(139, 69, 19, 0.8));
@ -4508,8 +4629,15 @@ h3 {
} }
@keyframes defeatFloat { @keyframes defeatFloat {
0%, 100% { transform: translateY(0px) rotate(0deg); }
50% { transform: translateY(-10px) rotate(2deg); } 0%,
100% {
transform: translateY(0px) rotate(0deg);
}
50% {
transform: translateY(-10px) rotate(2deg);
}
} }
.defeat-stats { .defeat-stats {
@ -4764,8 +4892,15 @@ h3 {
} }
@keyframes victoryGlow { @keyframes victoryGlow {
0% { opacity: 0.5; transform: translate(-50%, -50%) scale(1); } 0% {
100% { opacity: 0.8; transform: translate(-50%, -50%) scale(1.1); } opacity: 0.5;
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0.8;
transform: translate(-50%, -50%) scale(1.1);
}
} }
.victory-stats { .victory-stats {
@ -5364,13 +5499,28 @@ h3 {
} }
@keyframes blink { @keyframes blink {
0%, 50% { opacity: 1; }
51%, 100% { opacity: 0.3; } 0%,
50% {
opacity: 1;
}
51%,
100% {
opacity: 0.3;
}
} }
@keyframes float { @keyframes float {
0%, 100% { transform: translateY(0px); }
50% { transform: translateY(-10px); } 0%,
100% {
transform: translateY(0px);
}
50% {
transform: translateY(-10px);
}
} }
@media (max-width: 768px) { @media (max-width: 768px) {
@ -5439,8 +5589,8 @@ h3 {
color: white; color: white;
font-size: 12px; font-size: 12px;
font-weight: bold; font-weight: bold;
min-width: 20px; min-width: 25px;
height: 20px; height: 25px;
border-radius: 50%; border-radius: 50%;
display: flex; display: flex;
align-items: center; align-items: center;
@ -5451,11 +5601,14 @@ h3 {
} }
@keyframes badgePulse { @keyframes badgePulse {
0%, 100% {
0%,
100% {
transform: scale(1); transform: scale(1);
} }
50% { 50% {
transform: scale(1.1); transform: scale(1.3);
} }
} }
@ -5481,8 +5634,13 @@ h3 {
} }
@keyframes fadeIn { @keyframes fadeIn {
from { opacity: 0; } from {
to { opacity: 1; } opacity: 0;
}
to {
opacity: 1;
}
} }
.messages-modal { .messages-modal {
@ -5502,6 +5660,7 @@ h3 {
opacity: 0; opacity: 0;
transform: scale(0.9) translateY(-20px); transform: scale(0.9) translateY(-20px);
} }
to { to {
opacity: 1; opacity: 1;
transform: scale(1) translateY(0); transform: scale(1) translateY(0);
@ -5582,7 +5741,8 @@ h3 {
color: var(--text); color: var(--text);
line-height: 1.6; line-height: 1.6;
font-size: 1.05em; font-size: 1.05em;
white-space: pre-wrap; /* Preserve line breaks */ white-space: pre-wrap;
/* Preserve line breaks */
} }
/* No Messages Placeholder */ /* No Messages Placeholder */

Write Preview
Loading…
Cancel
Save