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

prefetch assets

main
Stephanie Gredell 4 months ago
parent
065e63c0bd
commit
4c25fb1b10
3 changed files with 46 additions and 10 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. 36
      index.html
  2. 6
      src/ui/render.js
  3. 14
      style.css

36
index.html
Unescape View File

@ -9,6 +9,42 @@
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;600;700&family=Kreon:wght@300..700&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;600;700&family=Kreon:wght@300..700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="./style.css"> <link rel="stylesheet" href="./style.css">
<!-- Preload critical map background -->
<link rel="preload" as="image" href="assets/card-art/terrace.png">
<!-- Prefetch map node icons -->
<link rel="prefetch" as="image" href="assets/card-art/staff.png">
<link rel="prefetch" as="image" href="assets/card-art/crossed_swords.png">
<link rel="prefetch" as="image" href="assets/card-art/crown.png">
<link rel="prefetch" as="image" href="assets/card-art/skull.png">
<link rel="prefetch" as="image" href="assets/card-art/potion_heal.png">
<link rel="prefetch" as="image" href="assets/card-art/diamond.png">
<link rel="prefetch" as="image" href="assets/card-art/crystal_cluster.png">
<!-- Prefetch enemy avatars for map tooltips -->
<link rel="prefetch" as="image" href="assets/avatars/13.png">
<link rel="prefetch" as="image" href="assets/avatars/2.png">
<link rel="prefetch" as="image" href="assets/avatars/merge_conflict_enemy.png">
<link rel="prefetch" as="image" href="assets/avatars/11.png">
<link rel="prefetch" as="image" href="assets/avatars/elite_refactor.png">
<link rel="prefetch" as="image" href="assets/avatars/boss_birthday_bug.png">
<!-- Prefetch starting deck card art for deck stack -->
<link rel="prefetch" as="image" href="assets/skill-art/Monk_8.png">
<link rel="prefetch" as="image" href="assets/skill-art/Monk_21.png">
<link rel="prefetch" as="image" href="assets/skill-art/Monk_5.png">
<link rel="prefetch" as="image" href="assets/skill-art/Monk_9.png">
<link rel="prefetch" as="image" href="assets/skill-art/Monk_20.png">
<link rel="prefetch" as="image" href="assets/skill-art/Monk_10.png">
<link rel="prefetch" as="image" href="assets/skill-art/Monk_22.png">
<link rel="prefetch" as="image" href="assets/skill-art/Monk_26.png">
<link rel="prefetch" as="image" href="assets/skill-art/Monk_12.png">
<link rel="prefetch" as="image" href="assets/skill-art/Monk_27.png">
<!-- Prefetch status icons used on map -->
<link rel="prefetch" as="image" href="assets/card-art/heart.png">
<link rel="prefetch" as="image" href="assets/card-art/bag_of_gold.png">
</head> </head>
<body> <body>

6
src/ui/render.js
Unescape View File

@ -282,7 +282,7 @@ export async function renderMap(root) {
const getNodeDescription = (node) => { const getNodeDescription = (node) => {
switch (node.kind) { switch (node.kind) {
case 'start': case 'start':
return '<strong>Starting Point</strong>\nBegin your journey up the Primeagen Spire'; return '<strong>Starting Point</strong>\nBegin your journey up ThePrimeagen Spire';
case 'battle': case 'battle':
const enemy = ENEMIES[node.enemy]; const enemy = ENEMIES[node.enemy];
return `<strong>Battle</strong>\nFight: ${enemy?.name || 'Unknown Enemy'}\nHP: ${enemy?.maxHp || '?'}`; return `<strong>Battle</strong>\nFight: ${enemy?.name || 'Unknown Enemy'}\nHP: ${enemy?.maxHp || '?'}`;
@ -402,7 +402,7 @@ export async function renderMap(root) {
<div class="birthday-message"> <div class="birthday-message">
<h2>Happy Birthday Prime!</h2> <h2>Happy Birthday Prime!</h2>
<p>With coffee in hand and code on your side,<br> <p>With coffee in hand and code on your side,<br>
The Primeagen Spire’s a treacherous ride. <br> ThePrimeagen Spire’s a treacherous ride. <br>
Gremlins await and errors conspire, <br> Gremlins await and errors conspire, <br>
But cake lies ahead at the top of the Spire. </p> But cake lies ahead at the top of the Spire. </p>
</div> </div>
@ -1390,7 +1390,7 @@ export function renderWin(root) {
<img src="assets/card-art/crown.png" alt="Victory Crown" class="crown-img"> <img src="assets/card-art/crown.png" alt="Victory Crown" class="crown-img">
</div> </div>
<h1>VICTORY ACHIEVED!</h1> <h1>VICTORY ACHIEVED!</h1>
<h2>The Primeagen Spire Has Been Conquered!</h2> <h2>ThePrimeagen Spire Has Been Conquered!</h2>
<p>ThePrimeagen's birthday celebration can continue in peace!</p> <p>ThePrimeagen's birthday celebration can continue in peace!</p>
</div> </div>

14
style.css
Unescape View File

@ -2773,20 +2773,19 @@ h3 {
position: absolute; position: absolute;
top: 20px; top: 20px;
right: 20px; right: 20px;
background: rgba(173, 216, 230, 0.95); background: linear-gradient(135deg, rgb(74, 47, 31) 0%, rgb(58, 31, 15) 100%);
border: 2px solid #4A90A4; border: 2px solid #FFFFFF;
border-radius: 8px; border-radius: 8px;
padding: 12px; padding: 12px;
min-width: 140px; min-width: 140px;
box-shadow: 0 4px 12px rgba(0,0,0,0.4);
z-index: 10; z-index: 10;
backdrop-filter: blur(2px); backdrop-filter: blur(2px);
} }
.legend-title { .legend-title {
font-weight: bold; font-weight: bold;
font-size: 14px; font-size: 16px;
color: #2C3E50; color: #FFFFFF;
margin-bottom: 8px; margin-bottom: 8px;
text-align: center; text-align: center;
} }
@ -2795,8 +2794,9 @@ h3 {
display: flex; display: flex;
align-items: center; align-items: center;
margin-bottom: 4px; margin-bottom: 4px;
font-size: 11px; font-size: 13px;
color: #2C3E50; color: #FFFFFF;
line-height: 1.5;
} }
.legend-icon { .legend-icon {

Write Preview
Loading…
Cancel
Save