Hugging Face's logo

Spaces:
awacke1
/
ChooseYourOwnAdventure
Running

App Files Community
awacke1 commited on
Commit
5cf7eec
·
verified ·
1 Parent(s): 2fc8747

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +187 -326
index.html CHANGED
@@ -70,11 +70,11 @@
70
  border-bottom: 1px solid #555;
71
  font-size: 0.9em;
72
  }
73
- #stats-display, #inventory-display, #character-sheet {
74
  margin-bottom: 10px;
75
  line-height: 1.8;
76
  }
77
- #stats-display span, #inventory-display span, #character-sheet span {
78
  display: inline-block;
79
  background-color: #444;
80
  padding: 3px 8px;
@@ -84,10 +84,8 @@
84
  border: 1px solid #666;
85
  white-space: nowrap;
86
  }
87
- #stats-display strong, #inventory-display strong, #character-sheet strong { color: #aaa; margin-right: 5px; }
88
  #inventory-display em { color: #888; font-style: normal; }
89
- #character-sheet .accomplishment { background-color: #665533; border-color: #998866; }
90
- #character-sheet .attribute { background-color: #553366; border-color: #886699; }
91
 
92
  #inventory-display .item-quest { background-color: #666030; border-color: #999048;}
93
  #inventory-display .item-weapon { background-color: #663030; border-color: #994848;}
@@ -116,7 +114,6 @@
116
 
117
  .roll-success { color: #7f7; border-left: 3px solid #4a4; padding-left: 8px; margin-bottom: 1em; font-size: 0.9em; }
118
  .roll-failure { color: #f77; border-left: 3px solid #a44; padding-left: 8px; margin-bottom: 1em; font-size: 0.9em; }
119
- .level-up { color: #ffcc66; border-left: 3px solid #cc9933; padding-left: 8px; margin-bottom: 1em; font-size: 0.9em; }
120
  </style>
121
  </head>
122
  <body>
@@ -130,7 +127,6 @@
130
  <div id="stats-inventory-container">
131
  <div id="stats-display"></div>
132
  <div id="inventory-display"></div>
133
- <div id="character-sheet"></div>
134
  </div>
135
  <div id="choices-container">
136
  <h3>What will you do?</h3>
@@ -157,7 +153,6 @@
157
  const choicesElement = document.getElementById('choices');
158
  const statsElement = document.getElementById('stats-display');
159
  const inventoryElement = document.getElementById('inventory-display');
160
- const characterSheetElement = document.getElementById('character-sheet');
161
 
162
  let scene, camera, renderer;
163
  let currentAssemblyGroup = null;
@@ -178,9 +173,6 @@
178
  const sandMaterial = new THREE.MeshStandardMaterial({ color: 0xF4A460, roughness: 0.9 });
179
  const wetStoneMaterial = new THREE.MeshStandardMaterial({ color: 0x2F4F4F, roughness: 0.7 });
180
  const glowMaterial = new THREE.MeshStandardMaterial({ color: 0x00FFAA, emissive: 0x00FFAA, emissiveIntensity: 0.5 });
181
- const crackedEarthMaterial = new THREE.MeshStandardMaterial({ color: 0x663300, roughness: 0.9 });
182
- const birdMaterial = new THREE.MeshStandardMaterial({ color: 0x666666, roughness: 0.7 });
183
- const scorpionMaterial = new THREE.MeshStandardMaterial({ color: 0x4A2F1A, roughness: 0.8 });
184
 
185
  function initThreeJS() {
186
  if (!sceneContainer) { console.error("Scene container not found!"); return; }
@@ -230,18 +222,15 @@
230
  mesh.position.set(position.x, position.y, position.z);
231
  mesh.rotation.set(rotation.x, rotation.y, rotation.z);
232
  mesh.scale.set(scale.x, scale.y, scale.z);
233
- mesh.castShadow = true;
234
- mesh.receiveShadow = true;
235
  return mesh;
236
  }
237
 
238
  function createGroundPlane(material = groundMaterial, size = 20) {
239
  const groundGeo = new THREE.PlaneGeometry(size, size);
240
  const ground = new THREE.Mesh(groundGeo, material);
241
- ground.rotation.x = -Math.PI / 2;
242
- ground.position.y = -0.05;
243
- ground.receiveShadow = true;
244
- ground.castShadow = false;
245
  return ground;
246
  }
247
 
@@ -256,119 +245,119 @@
256
 
257
  function createCityGatesAssembly() {
258
  const group = new THREE.Group();
259
- const gh = 4, gw = 1.5, gd = 0.8, ah = 1, aw = 3;
260
  const tlGeo = new THREE.BoxGeometry(gw, gh, gd);
261
- group.add(createMesh(tlGeo, stoneMaterial, { x: -(aw / 2 + gw / 2), y: gh / 2, z: 0 }));
262
  const trGeo = new THREE.BoxGeometry(gw, gh, gd);
263
- group.add(createMesh(trGeo, stoneMaterial, { x: (aw / 2 + gw / 2), y: gh / 2, z: 0 }));
264
  const aGeo = new THREE.BoxGeometry(aw, ah, gd);
265
- group.add(createMesh(aGeo, stoneMaterial, { x: 0, y: gh - ah / 2, z: 0 }));
266
- const cs = 0.4;
267
- const cg = new THREE.BoxGeometry(cs, cs, gd * 1.1);
268
- for (let i = -1; i <= 1; i += 2) {
269
- group.add(createMesh(cg.clone(), stoneMaterial, { x: -(aw / 2 + gw / 2) + i * cs * 0.7, y: gh + cs / 2, z: 0 }));
270
- group.add(createMesh(cg.clone(), stoneMaterial, { x: (aw / 2 + gw / 2) + i * cs * 0.7, y: gh + cs / 2, z: 0 }));
271
- }
272
- group.add(createMesh(cg.clone(), stoneMaterial, { x: 0, y: gh + ah - cs / 2, z: 0 }));
273
  group.add(createGroundPlane(stoneMaterial));
274
  return group;
275
  }
276
 
277
  function createWeaponsmithAssembly() {
278
  const group = new THREE.Group();
279
- const bw = 3, bh = 2.5, bd = 3.5;
280
  const bGeo = new THREE.BoxGeometry(bw, bh, bd);
281
- group.add(createMesh(bGeo, darkWoodMaterial, { x: 0, y: bh / 2, z: 0 }));
282
- const ch = 3.5;
283
  const cGeo = new THREE.CylinderGeometry(0.3, 0.4, ch, 8);
284
- group.add(createMesh(cGeo, stoneMaterial, { x: bw * 0.3, y: ch / 2, z: -bd * 0.3 }));
285
  group.add(createGroundPlane());
286
  return group;
287
  }
288
 
289
  function createTempleAssembly() {
290
  const group = new THREE.Group();
291
- const bs = 5, bsh = 0.5, ch = 3, cr = 0.25, rh = 0.5;
292
  const bGeo = new THREE.BoxGeometry(bs, bsh, bs);
293
- group.add(createMesh(bGeo, templeMaterial, { x: 0, y: bsh / 2, z: 0 }));
294
  const cGeo = new THREE.CylinderGeometry(cr, cr, ch, 12);
295
- const cPos = [{ x: -bs / 3, z: -bs / 3 }, { x: bs / 3, z: -bs / 3 }, { x: -bs / 3, z: bs / 3 }, { x: bs / 3, z: bs / 3 }];
296
- cPos.forEach(p => group.add(createMesh(cGeo.clone(), templeMaterial, { x: p.x, y: bsh + ch / 2, z: p.z })));
297
- const rGeo = new THREE.BoxGeometry(bs * 0.9, rh, bs * 0.9);
298
- group.add(createMesh(rGeo, templeMaterial, { x: 0, y: bsh + ch + rh / 2, z: 0 }));
299
  group.add(createGroundPlane());
300
  return group;
301
  }
302
 
303
  function createResistanceMeetingAssembly() {
304
  const group = new THREE.Group();
305
- const tw = 2, th = 0.8, td = 1, tt = 0.1;
306
  const ttg = new THREE.BoxGeometry(tw, tt, td);
307
- group.add(createMesh(ttg, woodMaterial, { x: 0, y: th - tt / 2, z: 0 }));
308
- const lh = th - tt, ls = 0.1;
309
- const lg = new THREE.BoxGeometry(ls, lh, ls);
310
- const lofW = tw / 2 - ls * 1.5;
311
- const lofD = td / 2 - ls * 1.5;
312
- group.add(createMesh(lg, woodMaterial, { x: -lofW, y: lh / 2, z: -lofD }));
313
- group.add(createMesh(lg.clone(), woodMaterial, { x: lofW, y: lh / 2, z: -lofD }));
314
- group.add(createMesh(lg.clone(), woodMaterial, { x: -lofW, y: lh / 2, z: lofD }));
315
- group.add(createMesh(lg.clone(), woodMaterial, { x: lofW, y: lh / 2, z: lofD }));
316
- const ss = 0.4;
317
- const sg = new THREE.BoxGeometry(ss, ss * 0.8, ss);
318
- group.add(createMesh(sg, darkWoodMaterial, { x: -tw * 0.6, y: ss * 0.4, z: 0 }));
319
- group.add(createMesh(sg.clone(), darkWoodMaterial, { x: tw * 0.6, y: ss * 0.4, z: 0 }));
320
  group.add(createGroundPlane(stoneMaterial));
321
  return group;
322
  }
323
 
324
- function createForestAssembly(tc = 10, a = 10) {
325
  const group = new THREE.Group();
326
- const cT = (x, z) => {
327
- const tg = new THREE.Group();
328
- const th = Math.random() * 1.5 + 2;
329
- const tr = Math.random() * 0.1 + 0.1;
330
- const tGeo = new THREE.CylinderGeometry(tr * 0.7, tr, th, 8);
331
- tg.add(createMesh(tGeo, woodMaterial, { x: 0, y: th / 2, z: 0 }));
332
- const fr = th * 0.4 + 0.2;
333
- const fGeo = new THREE.SphereGeometry(fr, 8, 6);
334
- tg.add(createMesh(fGeo, leafMaterial, { x: 0, y: th * 0.9, z: 0 }));
335
- tg.position.set(x, 0, z);
336
  return tg;
337
  };
338
- for (let i = 0; i < tc; i++) {
339
- const x = (Math.random() - 0.5) * a;
340
- const z = (Math.random() - 0.5) * a;
341
- if (Math.sqrt(x * x + z * z) > 1.0) group.add(cT(x, z));
342
  }
343
- group.add(createGroundPlane(groundMaterial, a * 1.1));
344
  return group;
345
  }
346
 
347
  function createRoadAmbushAssembly() {
348
  const group = new THREE.Group();
349
- const a = 12;
350
  const fg = createForestAssembly(8, a);
351
  group.add(fg);
352
- const rw = 3, rl = a * 1.2;
353
- const rGeo = new THREE.PlaneGeometry(rw, rl);
354
- const rMat = new THREE.MeshStandardMaterial({ color: 0x966F33, roughness: 0.9 });
355
- const r = createMesh(rGeo, rMat, { x: 0, y: 0.01, z: 0 }, { x: -Math.PI / 2 });
356
- r.receiveShadow = true;
357
  group.add(r);
358
- const rkGeo = new THREE.SphereGeometry(0.5, 5, 4);
359
- const rkMat = new THREE.MeshStandardMaterial({ color: 0x666666, roughness: 0.8 });
360
- group.add(createMesh(rkGeo, rkMat, { x: rw * 0.7, y: 0.25, z: 1 }, { y: Math.random() * Math.PI }));
361
- group.add(createMesh(rkGeo.clone().scale(0.8, 0.8, 0.8), rkMat, { x: -rw * 0.8, y: 0.2, z: -2 }, { y: Math.random() * Math.PI }));
362
  return group;
363
  }
364
 
365
  function createForestEdgeAssembly() {
366
  const group = new THREE.Group();
367
- const a = 15;
368
  const fg = createForestAssembly(15, a);
369
- const ttr = [];
370
  fg.children.forEach(c => {
371
- if (c.type === 'Group' && c.position.x > 0) ttr.push(c);
372
  });
373
  ttr.forEach(t => fg.remove(t));
374
  group.add(fg);
@@ -377,20 +366,20 @@
377
 
378
  function createPrisonerCellAssembly() {
379
  const group = new THREE.Group();
380
- const cs = 3, wh = 2.5, wt = 0.2, br = 0.05, bsp = 0.25;
381
- const cfMat = stoneMaterial.clone();
382
  cfMat.color.setHex(0x555555);
383
  group.add(createGroundPlane(cfMat, cs));
384
- const wbGeo = new THREE.BoxGeometry(cs, wh, wt);
385
- group.add(createMesh(wbGeo, stoneMaterial, { x: 0, y: wh / 2, z: -cs / 2 }));
386
- const wsGeo = new THREE.BoxGeometry(wt, wh, cs);
387
- group.add(createMesh(wsGeo, stoneMaterial, { x: -cs / 2, y: wh / 2, z: 0 }));
388
- group.add(createMesh(wsGeo.clone(), stoneMaterial, { x: cs / 2, y: wh / 2, z: 0 }));
389
- const bGeo = new THREE.CylinderGeometry(br, br, wh, 8);
390
- const nb = Math.floor(cs / bsp);
391
- for (let i = 0; i < nb; i++) {
392
- const xp = -cs / 2 + (i + 0.5) * bsp;
393
- group.add(createMesh(bGeo.clone(), metalMaterial, { x: xp, y: wh / 2, z: cs / 2 }));
394
  }
395
  return group;
396
  }
@@ -399,7 +388,7 @@
399
  const group = new THREE.Group();
400
  const boxGeo = new THREE.BoxGeometry(2, 2, 2);
401
  group.add(createMesh(boxGeo, gameOverMaterial, { x: 0, y: 1, z: 0 }));
402
- group.add(createGroundPlane(stoneMaterial.clone().set({ color: 0x333333 })));
403
  return group;
404
  }
405
 
@@ -483,25 +472,19 @@
483
  return group;
484
  }
485
 
486
- function createOvergrownPathAssembly(treeCount = 15, objectCount = 30, creatureCount = 0, lightIntensity = 0.6) {
487
  const group = new THREE.Group();
488
  group.add(createGroundPlane(dirtMaterial, 15));
489
- const forest = createForestAssembly(treeCount, 10);
490
  group.add(forest);
491
  const fungiGeo = new THREE.SphereGeometry(0.1, 8, 8);
492
- for (let i = 0; i < objectCount; i++) {
493
  group.add(createMesh(fungiGeo, glowMaterial, { x: (Math.random() - 0.5) * 8, y: 0.1, z: (Math.random() - 0.5) * 8 }));
494
  }
495
  const vineGeo = new THREE.CylinderGeometry(0.05, 0.05, 2, 8);
496
- for (let i = 0; i < Math.floor(objectCount / 3); i++) {
497
  group.add(createMesh(vineGeo, leafMaterial, { x: (Math.random() - 0.5) * 6, y: 2, z: (Math.random() - 0.5) * 6 }, { z: Math.random() * Math.PI }));
498
  }
499
- if (creatureCount > 0) {
500
- const creatureGeo = new THREE.SphereGeometry(0.2, 8, 8);
501
- for (let i = 0; i < creatureCount; i++) {
502
- group.add(createMesh(creatureGeo, birdMaterial, { x: (Math.random() - 0.5) * 8, y: 2 + Math.random(), z: (Math.random() - 0.5) * 8 }));
503
- }
504
- }
505
  return group;
506
  }
507
 
@@ -522,7 +505,7 @@
522
  }
523
 
524
  function createGoblinAmbushAssembly() {
525
- const group = createOvergrownPathAssembly(15, 30, 2);
526
  const bodyGeo = new THREE.CylinderGeometry(0.3, 0.3, 1, 8);
527
  const headGeo = new THREE.SphereGeometry(0.2, 8, 8);
528
  const goblinMat = new THREE.MeshStandardMaterial({ color: 0x556B2F });
@@ -573,90 +556,19 @@
573
  return group;
574
  }
575
 
576
- function createMossyRavineAssembly(treeCount = 10, objectCount = 20, creatureCount = 3, lightIntensity = 0.5) {
577
- const group = new THREE.Group();
578
- group.add(createGroundPlane(groundMaterial, 20));
579
- const forest = createForestAssembly(treeCount, 15);
580
- group.add(forest);
581
- const bridgeGeo = new THREE.BoxGeometry(5, 0.1, 1);
582
- group.add(createMesh(bridgeGeo, woodMaterial, { y: 1, z: 2 }));
583
- const ropeGeo = new THREE.CylinderGeometry(0.05, 0.05, 5, 8);
584
- group.add(createMesh(ropeGeo, woodMaterial, { x: -2.5, y: 1.5, z: 2 }, { z: Math.PI / 2 }));
585
- group.add(createMesh(ropeGeo, woodMaterial, { x: 2.5, y: 1.5, z: 2 }, { z: Math.PI / 2 }));
586
- const rockGeo = new THREE.SphereGeometry(0.4, 6, 6);
587
- for (let i = 0; i < objectCount; i++) {
588
- group.add(createMesh(rockGeo, stoneMaterial, { x: (Math.random() - 0.5) * 10, y: 0.2, z: (Math.random() - 0.5) * 10 }));
589
- }
590
- if (creatureCount > 0) {
591
- const birdGeo = new THREE.SphereGeometry(0.15, 8, 8);
592
- for (let i = 0; i < creatureCount; i++) {
593
- const bird = createMesh(birdGeo, birdMaterial, { x: (Math.random() - 0.5) * 8, y: 3 + Math.random(), z: (Math.random() - 0.5) * 8 });
594
- bird.userData.update = (time) => {
595
- bird.position.y += Math.sin(time + i) * 0.05;
596
- };
597
- group.add(bird);
598
- }
599
- }
600
- return group;
601
- }
602
-
603
- function createRockyBadlandsAssembly(treeCount = 5, objectCount = 15, creatureCount = 2, lightIntensity = 1.2) {
604
- const group = new THREE.Group();
605
- group.add(createGroundPlane(crackedEarthMaterial, 25));
606
- const sparseVeg = createForestAssembly(treeCount, 20);
607
- sparseVeg.children.forEach(c => {
608
- if (c.type === 'Group') c.scale.set(0.5, 0.5, 0.5);
609
- });
610
- group.add(sparseVeg);
611
- const rockGeo = new THREE.SphereGeometry(0.6, 6, 6);
612
- for (let i = 0; i < objectCount; i++) {
613
- group.add(createMesh(rockGeo, stoneMaterial, { x: (Math.random() - 0.5) * 15, y: 0.3, z: (Math.random() - 0.5) * 15 }));
614
- }
615
- if (creatureCount > 0) {
616
- const scorpionGeo = new THREE.BoxGeometry(0.3, 0.1, 0.5);
617
- for (let i = 0; i < creatureCount; i++) {
618
- group.add(createMesh(scorpionGeo, scorpionMaterial, { x: (Math.random() - 0.5) * 10, y: 0.05, z: (Math.random() - 0.5) * 10 }));
619
- }
620
- }
621
- return group;
622
- }
623
-
624
- function createMountainFortressAssembly(treeCount = 3, objectCount = 10, creatureCount = 2, lightIntensity = 0.8) {
625
- const group = new THREE.Group();
626
- group.add(createGroundPlane(stoneMaterial, 20));
627
- const wallGeo = new THREE.BoxGeometry(15, 3, 0.5);
628
- group.add(createMesh(wallGeo, stoneMaterial, { y: 1.5, z: -5 }));
629
- const towerGeo = new THREE.CylinderGeometry(1, 1, 4, 12);
630
- group.add(createMesh(towerGeo, stoneMaterial, { x: -6, y: 2, z: -5 }));
631
- group.add(createMesh(towerGeo, stoneMaterial, { x: 6, y: 2, z: -5 }));
632
- const crateGeo = new THREE.BoxGeometry(0.8, 0.8, 0.8);
633
- for (let i = 0; i < objectCount; i++) {
634
- group.add(createMesh(crateGeo, woodMaterial, { x: (Math.random() - 0.5) * 8, y: 0.4, z: (Math.random() - 0.5) * 4 + 2 }));
635
- }
636
- if (creatureCount > 0) {
637
- const guardGeo = new THREE.CylinderGeometry(0.3, 0.3, 1.5, 8);
638
- for (let i = 0; i < creatureCount; i++) {
639
- group.add(createMesh(guardGeo, darkWoodMaterial, { x: -4 + i * 8, y: 0.75, z: -5 }));
640
- }
641
- }
642
- const sparseTrees = createForestAssembly(treeCount, 15);
643
- group.add(sparseTrees);
644
- return group;
645
- }
646
-
647
  // Game Data
648
  const itemsData = {
649
- "Flaming Sword": { type: "weapon", description: "A fiery blade" },
650
- "Whispering Bow": { type: "weapon", description: "A silent bow" },
651
- "Guardian Shield": { type: "armor", description: "A protective shield" },
652
- "Healing Light Spell": { type: "spell", description: "Mends minor wounds" },
653
- "Shield of Faith Spell": { type: "spell", description: "Temporary shield" },
654
- "Binding Runes Scroll": { type: "spell", description: "Binds an enemy" },
655
- "Secret Tunnel Map": { type: "quest", description: "Shows a hidden path" },
656
- "Poison Daggers": { type: "weapon", description: "Daggers with poison" },
657
- "Master Key": { type: "quest", description: "Unlocks many doors" },
658
- "Crude Dagger": { type: "weapon", description: "A roughly made dagger." },
659
- "Scout's Pouch": { type: "quest", description: "Contains odds and ends." }
660
  };
661
 
662
  const gameData = {
@@ -670,7 +582,7 @@
670
  "8": { title: "Hidden Game Trail", content: `<p>Your sharp eyes spot a faint trail... It leads towards a ravine spanned by a rickety rope bridge.</p><p>(+20 XP)</p>`, options: [ { text: "Risk crossing the rope bridge (Dexterity Check)", check: { stat: 'dexterity', dc: 10, onFailure: 81 }, next: 80 }, { text: "Search for another way across the ravine", next: 82 } ], illustration: "narrow-game-trail-forest-rope-bridge-ravine", reward: { xp: 20 } },
671
  "10": { title: "Goblin Ambush!", content: `<p>Two scraggly goblins leap out, brandishing crude spears!</p>`, options: [ { text: "Fight the goblins!", next: 12 }, { text: "Attempt to dodge past them (Dexterity Check)", check: { stat: 'dexterity', dc: 13, onFailure: 10 }, next: 13 } ], illustration: "two-goblins-ambush-forest-path-spears" },
672
  "11": { title: "Hidden Evasion", content: `<p>You melt into the shadows as the goblins blunder past.</p><p>(+30 XP)</p>`, options: [ { text: "Continue cautiously", next: 14 } ], illustration: "forest-shadows-hiding-goblins-walking-past", reward: { xp: 30 } },
673
- "12": { title: "Ambush Victory!", content: `<p>You defeat the goblins! Found a Crude Dagger.</p><p>(+50 XP)</p>`, options: [ { text: "Press onward", next: 14 } ], illustration: "defeated-goblins-forest-path-loot", reward: { xp: 50, addItem: "Crude Dagger", accomplishment: "Defeated Goblins" } },
674
  "13": { title: "Daring Escape", content: `<p>With surprising agility, you tumble past the goblins!</p><p>(+25 XP)</p>`, options: [ { text: "Keep running!", next: 14 } ], illustration: "blurred-motion-running-past-goblins-forest", reward: { xp: 25 } },
675
  "14": { title: "Forest Stream Crossing", content: `<p>The path leads to a clear, shallow stream...</p>`, options: [ { text: "Wade across the stream", next: 16 }, { text: "Look for a drier crossing point (fallen log?)", next: 15 } ], illustration: "forest-stream-crossing-dappled-sunlight-stones" },
676
  "15": { title: "Log Bridge", content: `<p>Further upstream, a large, mossy log spans the stream.</p>`, options: [ { text: "Cross carefully on the log (Dexterity Check)", check: { stat: 'dexterity', dc: 9, onFailure: 151 }, next: 16 }, { text: "Go back and wade instead", next: 14 } ], illustration: "mossy-log-bridge-over-forest-stream" },
@@ -685,14 +597,14 @@
685
  "32": { title: "No Easier Path", content: `<p>You scan the cliffs intently but find no obviously easier routes.</p>`, options: [ { text: "Attempt the precarious descent (Dexterity Check)", check: { stat: 'dexterity', dc: 12, onFailure: 31 }, next: 30 } ], illustration: "scanning-sea-cliffs-no-other-paths-visible" },
686
  "33": { title: "Smuggler's Steps?", content: `<p>Your keen eyes spot a series of barely visible handholds and steps carved into the rock...</p><p>(+15 XP)</p>`, options: [ { text: "Use the hidden steps (Easier Dex Check)", check: { stat: 'dexterity', dc: 8, onFailure: 31 }, next: 30 } ], illustration: "close-up-handholds-carved-in-cliff-face", reward: { xp: 15 } },
687
  "35": { title: "Dark Cave", content: `<p>The cave smells of salt and decay. Water drips somewhere within.</p>`, options: [{ text: "Press deeper into the darkness", next: 99 } ], illustration: "dark-cave-entrance-dripping-water" },
688
- "40": { title: "Overgrown Shrine", content: `<p>Wildflowers grow thick around a small stone shrine. It feels ancient and neglected.</p>`, options: [{ text: "Examine the carvings (Intelligence Check)", check: { stat: 'intelligence', dc: 11, onFailure: 401 }, next: 400 } ], illustration: "overgrown-stone-shrine-wildflowers-close" },
689
  "41": { title: "Rocky Badlands", content: `<p>The green hills give way to cracked earth and jagged rock formations under a harsh sun.</p>`, options: [{ text: "Scout ahead", next: 99 } ], illustration: "rocky-badlands-cracked-earth-harsh-sun" },
690
- "190": { title: "Over the Rocks", content: "<p>With considerable effort, you manage to climb over the rockslide.</p><p>(+35 XP)</p>", options: [{ text: "Continue up the path", next: 22 }], illustration: "character-climbing-over-boulders", reward: { xp: 35 } },
691
- "191": { title: "Climb Fails", content: "<p>The boulders are too unstable or sheer. You cannot climb them safely.</p>", options: [{ text: "Search for another way around", next: 192 }], illustration: "character-slipping-on-rockslide-boulders" },
692
- "192": { title: "Detour Found", content: "<p>After some searching, you find a rough path leading around the rockslide, eventually rejoining the main trail.</p>", options: [{ text: "Continue up the path", next: 22 }], illustration: "rough-detour-path-around-rockslide" },
693
- "21": { title: "Western Ridge", content: "<p>The ridge path is narrow and exposed, with strong winds threatening to push you off.</p>", options: [{ text: "Proceed carefully (Dexterity Check)", check: { stat: 'dexterity', dc: 14, onFailure: 211 }, next: 22 } ], illustration: "narrow-windy-mountain-ridge-path" },
694
- "22": { title: "Fortress Approach", content: "<p>You've navigated the treacherous paths and now stand near the outer walls of the dark fortress. Guards patrol the battlements.</p>", options: [{ text: "Look for an unguarded entrance", next: 99 }], illustration: "approaching-dark-fortress-walls-guards" },
695
- "211": { title: "Lost Balance", content: "<p>A strong gust of wind catches you off guard, sending you tumbling down a steep slope! You lose 10 HP.</p>", options: [{ text: "Climb back up and find another way", next: 17 }], illustration: "character-falling-off-windy-ridge", hpLoss: 10 },
696
  "99": { title: "Game Over / To Be Continued...", content: "<p>Your adventure ends here (for now).</p>", options: [{ text: "Restart", next: 1 }], illustration: "game-over-generic", gameOver: true }
697
  };
698
 
@@ -700,77 +612,20 @@
700
  let gameState = {
701
  currentPageId: 1,
702
  character: {
703
- name: "Hero",
704
- race: "Human",
705
- alignment: "Neutral Good",
706
- class: "Adventurer",
707
- level: 1,
708
- xp: 0,
709
- xpToNextLevel: 100,
710
- stats: {
711
- strength: 8,
712
- intelligence: 10,
713
- wisdom: 10,
714
- dexterity: 10,
715
- constitution: 10,
716
- charisma: 8,
717
- hp: 12,
718
- maxHp: 12
719
- },
720
- inventory: [],
721
- wins: {
722
- strength: 0,
723
- intelligence: 0,
724
- wisdom: 0,
725
- dexterity: 0,
726
- constitution: 0,
727
- charisma: 0
728
- },
729
- accomplishments: []
730
  }
731
  };
732
 
733
  // Game Logic Functions
734
  function startGame() {
735
- const defaultChar = {
736
- name: "Hero",
737
- race: "Human",
738
- alignment: "Neutral Good",
739
- class: "Adventurer",
740
- level: 1,
741
- xp: 0,
742
- xpToNextLevel: 100,
743
- stats: {
744
- strength: 8,
745
- intelligence: 10,
746
- wisdom: 10,
747
- dexterity: 10,
748
- constitution: 10,
749
- charisma: 8,
750
- hp: 12,
751
- maxHp: 12
752
- },
753
- inventory: [],
754
- wins: {
755
- strength: 0,
756
- intelligence: 0,
757
- wisdom: 0,
758
- dexterity: 0,
759
- constitution: 0,
760
- charisma: 0
761
- },
762
- accomplishments: []
763
- };
764
  gameState = { currentPageId: 1, character: { ...defaultChar } };
765
  renderPage(gameState.currentPageId);
766
  }
767
 
768
- function getAttributeModifier(statValue) {
769
- if (statValue >= 14) return 3;
770
- if (statValue >= 12) return 2;
771
- return 1;
772
- }
773
-
774
  function handleChoiceClick(choiceData) {
775
  const optionNextPageId = parseInt(choiceData.nextPage);
776
  const itemToAdd = choiceData.addItem;
@@ -783,15 +638,13 @@
783
  if (check) {
784
  const statValue = gameState.character.stats[check.stat] || 10;
785
  const modifier = Math.floor((statValue - 10) / 2);
786
- const accomplishmentBonus = gameState.character.accomplishments.includes("Defeated Goblins") && check.stat === 'dexterity' ? 1 : 0;
787
  const roll = Math.floor(Math.random() * 20) + 1;
788
- const totalResult = roll + modifier + accomplishmentBonus;
789
  const dc = check.dc;
790
- console.log(`Check: ${check.stat} (DC ${dc}) | Roll: ${roll} + Mod: ${modifier} + Acc: ${accomplishmentBonus} = ${totalResult}`);
791
  if (totalResult >= dc) {
792
  nextPageId = optionNextPageId;
793
  rollResultMessage = `<p class="roll-success"><em>Check Success! (${totalResult} vs DC ${dc})</em></p>`;
794
- gameState.character.wins[check.stat]++;
795
  } else {
796
  nextPageId = parseInt(check.onFailure);
797
  rollResultMessage = `<p class="roll-failure"><em>Check Failed! (${totalResult} vs DC ${dc})</em></p>`;
@@ -807,7 +660,6 @@
807
  gameState.currentPageId = nextPageId;
808
  const nextPageData = gameData[nextPageId];
809
 
810
- let levelUpMessage = "";
811
  if (nextPageData) {
812
  if (nextPageData.hpLoss) {
813
  gameState.character.stats.hp -= nextPageData.hpLoss;
@@ -815,15 +667,7 @@
815
  if (gameState.character.stats.hp <= 0) { gameState.character.stats.hp = 0; console.log("Player died!"); nextPageId = 99; }
816
  }
817
  if (nextPageData.reward) {
818
- if (nextPageData.reward.xp) {
819
- gameState.character.xp += nextPageData.reward.xp;
820
- console.log(`Gained ${nextPageData.reward.xp} XP! Total: ${gameState.character.xp}`);
821
- if (gameState.character.xp >= gameState.character.xpToNextLevel && gameState.character.level === 1) {
822
- gameState.character.level = 2;
823
- gameState.character.xpToNextLevel = 200;
824
- levelUpMessage = `<p class="level-up"><em>Congratulations! You've reached Level 2! New XP goal: 200.</em></p>`;
825
- }
826
- }
827
  if (nextPageData.reward.statIncrease) {
828
  const stat = nextPageData.reward.statIncrease.stat;
829
  const amount = nextPageData.reward.statIncrease.amount;
@@ -832,28 +676,24 @@
832
  console.log(`Stat ${stat} increased by ${amount}.`);
833
  }
834
  }
835
- if (nextPageData.reward.addItem && !gameState.character.inventory.includes(nextPageData.reward.addItem)) {
836
  gameState.character.inventory.push(nextPageData.reward.addItem);
837
  console.log(`Found item: ${nextPageData.reward.addItem}`);
838
  }
839
- if (nextPageData.reward.accomplishment && !gameState.character.accomplishments.includes(nextPageData.reward.accomplishment)) {
840
- gameState.character.accomplishments.push(nextPageData.reward.accomplishment);
841
- console.log(`Accomplishment earned: ${nextPageData.reward.accomplishment}`);
842
- }
843
  }
844
  const conModifier = Math.floor((gameState.character.stats.constitution - 10) / 2);
845
  gameState.character.stats.maxHp = 10 + (conModifier * gameState.character.level);
846
  gameState.character.stats.hp = Math.min(gameState.character.stats.hp, gameState.character.stats.maxHp);
847
  if (nextPageId === 99 && gameState.character.stats.hp <= 0) {
848
- renderPageInternal(99, gameData[99], rollResultMessage + levelUpMessage);
849
  return;
850
  }
851
  } else {
852
  console.error(`Data for page ${nextPageId} not found!`);
853
- renderPageInternal(99, gameData[99], "<p><em>Error: Next page data missing!</em></p>" + levelUpMessage);
854
  return;
855
  }
856
- renderPageInternal(nextPageId, nextPageData, rollResultMessage + levelUpMessage);
857
  }
858
 
859
  function renderPageInternal(pageId, pageData, message = "") {
@@ -862,7 +702,6 @@
862
  storyContentElement.innerHTML = message + (pageData.content || "<p>...</p>");
863
  updateStatsDisplay();
864
  updateInventoryDisplay();
865
- updateCharacterSheet();
866
  choicesElement.innerHTML = '';
867
  if (pageData.options && pageData.options.length > 0) {
868
  pageData.options.forEach(option => {
@@ -897,47 +736,24 @@
897
  function renderPage(pageId) { renderPageInternal(pageId, gameData[pageId]); }
898
 
899
  function updateStatsDisplay() {
900
- const char = gameState.character;
901
  statsElement.innerHTML = `<strong>Stats:</strong> <span>Lvl: ${char.level}</span> <span>XP: ${char.xp}/${char.xpToNextLevel}</span> <span>HP: ${char.stats.hp}/${char.stats.maxHp}</span> <span>Str: ${char.stats.strength}</span> <span>Int: ${char.stats.intelligence}</span> <span>Wis: ${char.stats.wisdom}</span> <span>Dex: ${char.stats.dexterity}</span> <span>Con: ${char.stats.constitution}</span> <span>Cha: ${char.stats.charisma}</span>`;
902
  }
903
 
904
  function updateInventoryDisplay() {
905
- let h = '<strong>Inventory:</strong> ';
906
- if (gameState.character.inventory.length === 0) {
907
- h += '<em>Empty</em>';
908
  } else {
909
- gameState.character.inventory.forEach(i => {
910
- const d = itemsData[i] || { type: 'unknown', description: '???' };
911
- const c = `item-${d.type || 'unknown'}`;
912
- h += `<span class="${c}" title="${d.description}">${i}</span>`;
913
  });
914
  }
915
  inventoryElement.innerHTML = h;
916
  }
917
 
918
- function updateCharacterSheet() {
919
- const char = gameState.character;
920
- let h = '<strong>Character Sheet:</strong> ';
921
- const attributes = ['strength', 'intelligence', 'wisdom', 'dexterity', 'constitution', 'charisma'];
922
- let totalScore = 0;
923
- attributes.forEach(attr => {
924
- const value = char.stats[attr];
925
- const wins = char.wins[attr];
926
- const modifier = getAttributeModifier(value);
927
- const score = (value + wins) * char.level;
928
- totalScore += score;
929
- h += `<span class="attribute">${attr.charAt(0).toUpperCase() + attr.slice(1)}: ${value} (Wins: ${wins}, Mod: +${modifier}, Score: ${score})</span>`;
930
- });
931
- h += `<span>Total Score: ${totalScore}</span>`;
932
- if (char.accomplishments.length > 0) {
933
- h += '<br><strong>Accomplishments:</strong> ';
934
- char.accomplishments.forEach(acc => {
935
- h += `<span class="accomplishment">${acc}</span>`;
936
- });
937
- }
938
- characterSheetElement.innerHTML = h;
939
- }
940
-
941
  function updateScene(illustrationKey) {
942
  if (currentAssemblyGroup) { scene.remove(currentAssemblyGroup); }
943
  scene.fog = null;
@@ -997,20 +813,6 @@
997
  scene.background = new THREE.Color(0x1A1A1A);
998
  camera.position.set(0, 1.5, 4); camera.lookAt(0, 1, 0);
999
  assemblyFunction = createDarkCaveAssembly; break;
1000
- case 'narrow-game-trail-forest-rope-bridge-ravine':
1001
- scene.fog = new THREE.Fog(0x2E4F3A, 5, 20);
1002
- camera.position.set(0, 2, 8); camera.lookAt(0, 1, 0);
1003
- assemblyFunction = createMossyRavineAssembly; break;
1004
- case 'rocky-badlands-cracked-earth-harsh-sun':
1005
- scene.fog = new THREE.Fog(0xCC9966, 10, 40);
1006
- scene.background = new THREE.Color(0xFFCC99);
1007
- camera.position.set(0, 3, 12); camera.lookAt(0, 1, 0);
1008
- assemblyFunction = createRockyBadlandsAssembly; break;
1009
- case 'approaching-dark-fortress-walls-guards':
1010
- scene.fog = new THREE.Fog(0x666666, 5, 30);
1011
- scene.background = new THREE.Color(0x666666);
1012
- camera.position.set(0, 3, 10); camera.lookAt(0, 2, -2);
1013
- assemblyFunction = createMountainFortressAssembly; break;
1014
  default:
1015
  console.warn(`Unknown illustration key: "${illustrationKey}". Using default.`);
1016
  assemblyFunction = createDefaultAssembly; break;
@@ -1021,4 +823,63 @@
1021
  adjustLighting(illustrationKey);
1022
  } catch (error) {
1023
  console.error(`Error creating assembly for ${illustrationKey}:`, error);
1024
- current
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
70
  border-bottom: 1px solid #555;
71
  font-size: 0.9em;
72
  }
73
+ #stats-display, #inventory-display {
74
  margin-bottom: 10px;
75
  line-height: 1.8;
76
  }
77
+ #stats-display span, #inventory-display span {
78
  display: inline-block;
79
  background-color: #444;
80
  padding: 3px 8px;
 
84
  border: 1px solid #666;
85
  white-space: nowrap;
86
  }
87
+ #stats-display strong, #inventory-display strong { color: #aaa; margin-right: 5px; }
88
  #inventory-display em { color: #888; font-style: normal; }
 
 
89
 
90
  #inventory-display .item-quest { background-color: #666030; border-color: #999048;}
91
  #inventory-display .item-weapon { background-color: #663030; border-color: #994848;}
 
114
 
115
  .roll-success { color: #7f7; border-left: 3px solid #4a4; padding-left: 8px; margin-bottom: 1em; font-size: 0.9em; }
116
  .roll-failure { color: #f77; border-left: 3px solid #a44; padding-left: 8px; margin-bottom: 1em; font-size: 0.9em; }
 
117
  </style>
118
  </head>
119
  <body>
 
127
  <div id="stats-inventory-container">
128
  <div id="stats-display"></div>
129
  <div id="inventory-display"></div>
 
130
  </div>
131
  <div id="choices-container">
132
  <h3>What will you do?</h3>
 
153
  const choicesElement = document.getElementById('choices');
154
  const statsElement = document.getElementById('stats-display');
155
  const inventoryElement = document.getElementById('inventory-display');
 
156
 
157
  let scene, camera, renderer;
158
  let currentAssemblyGroup = null;
 
173
  const sandMaterial = new THREE.MeshStandardMaterial({ color: 0xF4A460, roughness: 0.9 });
174
  const wetStoneMaterial = new THREE.MeshStandardMaterial({ color: 0x2F4F4F, roughness: 0.7 });
175
  const glowMaterial = new THREE.MeshStandardMaterial({ color: 0x00FFAA, emissive: 0x00FFAA, emissiveIntensity: 0.5 });
 
 
 
176
 
177
  function initThreeJS() {
178
  if (!sceneContainer) { console.error("Scene container not found!"); return; }
 
222
  mesh.position.set(position.x, position.y, position.z);
223
  mesh.rotation.set(rotation.x, rotation.y, rotation.z);
224
  mesh.scale.set(scale.x, scale.y, scale.z);
225
+ mesh.castShadow = true; mesh.receiveShadow = true;
 
226
  return mesh;
227
  }
228
 
229
  function createGroundPlane(material = groundMaterial, size = 20) {
230
  const groundGeo = new THREE.PlaneGeometry(size, size);
231
  const ground = new THREE.Mesh(groundGeo, material);
232
+ ground.rotation.x = -Math.PI / 2; ground.position.y = -0.05;
233
+ ground.receiveShadow = true; ground.castShadow = false;
 
 
234
  return ground;
235
  }
236
 
 
245
 
246
  function createCityGatesAssembly() {
247
  const group = new THREE.Group();
248
+ const gh=4, gw=1.5, gd=0.8, ah=1, aw=3;
249
  const tlGeo = new THREE.BoxGeometry(gw, gh, gd);
250
+ group.add(createMesh(tlGeo, stoneMaterial, { x:-(aw/2+gw/2), y:gh/2, z:0 }));
251
  const trGeo = new THREE.BoxGeometry(gw, gh, gd);
252
+ group.add(createMesh(trGeo, stoneMaterial, { x:(aw/2+gw/2), y:gh/2, z:0 }));
253
  const aGeo = new THREE.BoxGeometry(aw, ah, gd);
254
+ group.add(createMesh(aGeo, stoneMaterial, { x:0, y:gh-ah/2, z:0 }));
255
+ const cs=0.4;
256
+ const cg = new THREE.BoxGeometry(cs, cs, gd*1.1);
257
+ for(let i=-1; i<=1; i+=2){
258
+ group.add(createMesh(cg.clone(), stoneMaterial, { x:-(aw/2+gw/2)+i*cs*0.7, y:gh+cs/2, z:0 }));
259
+ group.add(createMesh(cg.clone(), stoneMaterial, { x:(aw/2+gw/2)+i*cs*0.7, y:gh+cs/2, z:0 }));
260
+ }
261
+ group.add(createMesh(cg.clone(), stoneMaterial, { x:0, y:gh+ah-cs/2, z:0 }));
262
  group.add(createGroundPlane(stoneMaterial));
263
  return group;
264
  }
265
 
266
  function createWeaponsmithAssembly() {
267
  const group = new THREE.Group();
268
+ const bw=3, bh=2.5, bd=3.5;
269
  const bGeo = new THREE.BoxGeometry(bw, bh, bd);
270
+ group.add(createMesh(bGeo, darkWoodMaterial, { x:0, y:bh/2, z:0 }));
271
+ const ch=3.5;
272
  const cGeo = new THREE.CylinderGeometry(0.3, 0.4, ch, 8);
273
+ group.add(createMesh(cGeo, stoneMaterial, { x:bw*0.3, y:ch/2, z:-bd*0.3 }));
274
  group.add(createGroundPlane());
275
  return group;
276
  }
277
 
278
  function createTempleAssembly() {
279
  const group = new THREE.Group();
280
+ const bs=5, bsh=0.5, ch=3, cr=0.25, rh=0.5;
281
  const bGeo = new THREE.BoxGeometry(bs, bsh, bs);
282
+ group.add(createMesh(bGeo, templeMaterial, { x:0, y:bsh/2, z:0 }));
283
  const cGeo = new THREE.CylinderGeometry(cr, cr, ch, 12);
284
+ const cPos = [{x:-bs/3, z:-bs/3}, {x:bs/3, z:-bs/3}, {x:-bs/3, z:bs/3}, {x:bs/3, z:bs/3}];
285
+ cPos.forEach(p=>group.add(createMesh(cGeo.clone(), templeMaterial, { x:p.x, y:bsh+ch/2, z:p.z })));
286
+ const rGeo = new THREE.BoxGeometry(bs*0.9, rh, bs*0.9);
287
+ group.add(createMesh(rGeo, templeMaterial, { x:0, y:bsh+ch+rh/2, z:0 }));
288
  group.add(createGroundPlane());
289
  return group;
290
  }
291
 
292
  function createResistanceMeetingAssembly() {
293
  const group = new THREE.Group();
294
+ const tw=2, th=0.8, td=1, tt=0.1;
295
  const ttg = new THREE.BoxGeometry(tw, tt, td);
296
+ group.add(createMesh(ttg, woodMaterial, { x:0, y:th-tt/2, z:0 }));
297
+ const lh=th-tt, ls=0.1;
298
+ const lg=new THREE.BoxGeometry(ls, lh, ls);
299
+ const lofW=tw/2-ls*1.5;
300
+ const lofD=td/2-ls*1.5;
301
+ group.add(createMesh(lg, woodMaterial, { x:-lofW, y:lh/2, z:-lofD }));
302
+ group.add(createMesh(lg.clone(), woodMaterial, { x:lofW, y:lh/2, z:-lofD }));
303
+ group.add(createMesh(lg.clone(), woodMaterial, { x:-lofW, y:lh/2, z:lofD }));
304
+ group.add(createMesh(lg.clone(), woodMaterial, { x:lofW, y:lh/2, z:lofD }));
305
+ const ss=0.4;
306
+ const sg=new THREE.BoxGeometry(ss, ss*0.8, ss);
307
+ group.add(createMesh(sg, darkWoodMaterial, { x:-tw*0.6, y:ss*0.4, z:0 }));
308
+ group.add(createMesh(sg.clone(), darkWoodMaterial, { x:tw*0.6, y:ss*0.4, z:0 }));
309
  group.add(createGroundPlane(stoneMaterial));
310
  return group;
311
  }
312
 
313
+ function createForestAssembly(tc=10, a=10) {
314
  const group = new THREE.Group();
315
+ const cT=(x,z)=>{
316
+ const tg=new THREE.Group();
317
+ const th=Math.random()*1.5+2;
318
+ const tr=Math.random()*0.1+0.1;
319
+ const tGeo = new THREE.CylinderGeometry(tr*0.7, tr, th, 8);
320
+ tg.add(createMesh(tGeo, woodMaterial, {x:0, y:th/2, z:0}));
321
+ const fr=th*0.4+0.2;
322
+ const fGeo=new THREE.SphereGeometry(fr, 8, 6);
323
+ tg.add(createMesh(fGeo, leafMaterial, {x:0, y:th*0.9, z:0}));
324
+ tg.position.set(x,0,z);
325
  return tg;
326
  };
327
+ for(let i=0; i<tc; i++){
328
+ const x=(Math.random()-0.5)*a;
329
+ const z=(Math.random()-0.5)*a;
330
+ if(Math.sqrt(x*x+z*z)>1.0) group.add(cT(x,z));
331
  }
332
+ group.add(createGroundPlane(groundMaterial, a*1.1));
333
  return group;
334
  }
335
 
336
  function createRoadAmbushAssembly() {
337
  const group = new THREE.Group();
338
+ const a=12;
339
  const fg = createForestAssembly(8, a);
340
  group.add(fg);
341
+ const rw=3, rl=a*1.2;
342
+ const rGeo=new THREE.PlaneGeometry(rw, rl);
343
+ const rMat=new THREE.MeshStandardMaterial({color:0x966F33, roughness:0.9});
344
+ const r=createMesh(rGeo, rMat, {x:0, y:0.01, z:0}, {x:-Math.PI/2});
345
+ r.receiveShadow=true;
346
  group.add(r);
347
+ const rkGeo=new THREE.SphereGeometry(0.5, 5, 4);
348
+ const rkMat=new THREE.MeshStandardMaterial({color:0x666666, roughness:0.8});
349
+ group.add(createMesh(rkGeo, rkMat, {x:rw*0.7, y:0.25, z:1}, {y:Math.random()*Math.PI}));
350
+ group.add(createMesh(rkGeo.clone().scale(0.8,0.8,0.8), rkMat, {x:-rw*0.8, y:0.2, z:-2}, {y:Math.random()*Math.PI}));
351
  return group;
352
  }
353
 
354
  function createForestEdgeAssembly() {
355
  const group = new THREE.Group();
356
+ const a=15;
357
  const fg = createForestAssembly(15, a);
358
+ const ttr=[];
359
  fg.children.forEach(c => {
360
+ if(c.type === 'Group' && c.position.x > 0) ttr.push(c);
361
  });
362
  ttr.forEach(t => fg.remove(t));
363
  group.add(fg);
 
366
 
367
  function createPrisonerCellAssembly() {
368
  const group = new THREE.Group();
369
+ const cs=3, wh=2.5, wt=0.2, br=0.05, bsp=0.25;
370
+ const cfMat=stoneMaterial.clone();
371
  cfMat.color.setHex(0x555555);
372
  group.add(createGroundPlane(cfMat, cs));
373
+ const wbGeo=new THREE.BoxGeometry(cs, wh, wt);
374
+ group.add(createMesh(wbGeo, stoneMaterial, {x:0, y:wh/2, z:-cs/2}));
375
+ const wsGeo=new THREE.BoxGeometry(wt, wh, cs);
376
+ group.add(createMesh(wsGeo, stoneMaterial, {x:-cs/2, y:wh/2, z:0}));
377
+ group.add(createMesh(wsGeo.clone(), stoneMaterial, {x:cs/2, y:wh/2, z:0}));
378
+ const bGeo=new THREE.CylinderGeometry(br, br, wh, 8);
379
+ const nb=Math.floor(cs/bsp);
380
+ for(let i=0; i<nb; i++){
381
+ const xp=-cs/2+(i+0.5)*bsp;
382
+ group.add(createMesh(bGeo.clone(), metalMaterial, {x:xp, y:wh/2, z:cs/2}));
383
  }
384
  return group;
385
  }
 
388
  const group = new THREE.Group();
389
  const boxGeo = new THREE.BoxGeometry(2, 2, 2);
390
  group.add(createMesh(boxGeo, gameOverMaterial, { x: 0, y: 1, z: 0 }));
391
+ group.add(createGroundPlane(stoneMaterial.clone().set({color: 0x333333})));
392
  return group;
393
  }
394
 
 
472
  return group;
473
  }
474
 
475
+ function createOvergrownPathAssembly() {
476
  const group = new THREE.Group();
477
  group.add(createGroundPlane(dirtMaterial, 15));
478
+ const forest = createForestAssembly(15, 10);
479
  group.add(forest);
480
  const fungiGeo = new THREE.SphereGeometry(0.1, 8, 8);
481
+ for (let i = 0; i < 30; i++) {
482
  group.add(createMesh(fungiGeo, glowMaterial, { x: (Math.random() - 0.5) * 8, y: 0.1, z: (Math.random() - 0.5) * 8 }));
483
  }
484
  const vineGeo = new THREE.CylinderGeometry(0.05, 0.05, 2, 8);
485
+ for (let i = 0; i < 10; i++) {
486
  group.add(createMesh(vineGeo, leafMaterial, { x: (Math.random() - 0.5) * 6, y: 2, z: (Math.random() - 0.5) * 6 }, { z: Math.random() * Math.PI }));
487
  }
 
 
 
 
 
 
488
  return group;
489
  }
490
 
 
505
  }
506
 
507
  function createGoblinAmbushAssembly() {
508
+ const group = createOvergrownPathAssembly();
509
  const bodyGeo = new THREE.CylinderGeometry(0.3, 0.3, 1, 8);
510
  const headGeo = new THREE.SphereGeometry(0.2, 8, 8);
511
  const goblinMat = new THREE.MeshStandardMaterial({ color: 0x556B2F });
 
556
  return group;
557
  }
558
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
559
  // Game Data
560
  const itemsData = {
561
+ "Flaming Sword":{type:"weapon", description:"A fiery blade"},
562
+ "Whispering Bow":{type:"weapon", description:"A silent bow"},
563
+ "Guardian Shield":{type:"armor", description:"A protective shield"},
564
+ "Healing Light Spell":{type:"spell", description:"Mends minor wounds"},
565
+ "Shield of Faith Spell":{type:"spell", description:"Temporary shield"},
566
+ "Binding Runes Scroll":{type:"spell", description:"Binds an enemy"},
567
+ "Secret Tunnel Map":{type:"quest", description:"Shows a hidden path"},
568
+ "Poison Daggers":{type:"weapon", description:"Daggers with poison"},
569
+ "Master Key":{type:"quest", description:"Unlocks many doors"},
570
+ "Crude Dagger":{type:"weapon", description:"A roughly made dagger."},
571
+ "Scout's Pouch":{type:"quest", description:"Contains odds and ends."}
572
  };
573
 
574
  const gameData = {
 
582
  "8": { title: "Hidden Game Trail", content: `<p>Your sharp eyes spot a faint trail... It leads towards a ravine spanned by a rickety rope bridge.</p><p>(+20 XP)</p>`, options: [ { text: "Risk crossing the rope bridge (Dexterity Check)", check: { stat: 'dexterity', dc: 10, onFailure: 81 }, next: 80 }, { text: "Search for another way across the ravine", next: 82 } ], illustration: "narrow-game-trail-forest-rope-bridge-ravine", reward: { xp: 20 } },
583
  "10": { title: "Goblin Ambush!", content: `<p>Two scraggly goblins leap out, brandishing crude spears!</p>`, options: [ { text: "Fight the goblins!", next: 12 }, { text: "Attempt to dodge past them (Dexterity Check)", check: { stat: 'dexterity', dc: 13, onFailure: 10 }, next: 13 } ], illustration: "two-goblins-ambush-forest-path-spears" },
584
  "11": { title: "Hidden Evasion", content: `<p>You melt into the shadows as the goblins blunder past.</p><p>(+30 XP)</p>`, options: [ { text: "Continue cautiously", next: 14 } ], illustration: "forest-shadows-hiding-goblins-walking-past", reward: { xp: 30 } },
585
+ "12": { title: "Ambush Victory!", content: `<p>You defeat the goblins! Found a Crude Dagger.</p><p>(+50 XP)</p>`, options: [ { text: "Press onward", next: 14 } ], illustration: "defeated-goblins-forest-path-loot", reward: { xp: 50, addItem: "Crude Dagger" } },
586
  "13": { title: "Daring Escape", content: `<p>With surprising agility, you tumble past the goblins!</p><p>(+25 XP)</p>`, options: [ { text: "Keep running!", next: 14 } ], illustration: "blurred-motion-running-past-goblins-forest", reward: { xp: 25 } },
587
  "14": { title: "Forest Stream Crossing", content: `<p>The path leads to a clear, shallow stream...</p>`, options: [ { text: "Wade across the stream", next: 16 }, { text: "Look for a drier crossing point (fallen log?)", next: 15 } ], illustration: "forest-stream-crossing-dappled-sunlight-stones" },
588
  "15": { title: "Log Bridge", content: `<p>Further upstream, a large, mossy log spans the stream.</p>`, options: [ { text: "Cross carefully on the log (Dexterity Check)", check: { stat: 'dexterity', dc: 9, onFailure: 151 }, next: 16 }, { text: "Go back and wade instead", next: 14 } ], illustration: "mossy-log-bridge-over-forest-stream" },
 
597
  "32": { title: "No Easier Path", content: `<p>You scan the cliffs intently but find no obviously easier routes.</p>`, options: [ { text: "Attempt the precarious descent (Dexterity Check)", check: { stat: 'dexterity', dc: 12, onFailure: 31 }, next: 30 } ], illustration: "scanning-sea-cliffs-no-other-paths-visible" },
598
  "33": { title: "Smuggler's Steps?", content: `<p>Your keen eyes spot a series of barely visible handholds and steps carved into the rock...</p><p>(+15 XP)</p>`, options: [ { text: "Use the hidden steps (Easier Dex Check)", check: { stat: 'dexterity', dc: 8, onFailure: 31 }, next: 30 } ], illustration: "close-up-handholds-carved-in-cliff-face", reward: { xp: 15 } },
599
  "35": { title: "Dark Cave", content: `<p>The cave smells of salt and decay. Water drips somewhere within.</p>`, options: [{ text: "Press deeper into the darkness", next: 99 } ], illustration: "dark-cave-entrance-dripping-water" },
600
+ "40": { title: "Overgrown Shrine", content: `<p>Wildflowers grow thick around a small stone shrine. It feels ancient and neglected.</p>`, options: [{ text: "Examine the carvings (Intelligence Check)", check:{stat:'intelligence', dc:11, onFailure: 401}, next: 400 } ], illustration: "overgrown-stone-shrine-wildflowers-close" },
601
  "41": { title: "Rocky Badlands", content: `<p>The green hills give way to cracked earth and jagged rock formations under a harsh sun.</p>`, options: [{ text: "Scout ahead", next: 99 } ], illustration: "rocky-badlands-cracked-earth-harsh-sun" },
602
+ "190": { title: "Over the Rocks", content:"<p>With considerable effort, you manage to climb over the rockslide.</p><p>(+35 XP)</p>", options: [{text:"Continue up the path", next: 22}], illustration:"character-climbing-over-boulders", reward: {xp:35} },
603
+ "191": { title: "Climb Fails", content:"<p>The boulders are too unstable or sheer. You cannot climb them safely.</p>", options: [{text:"Search for another way around", next: 192}], illustration:"character-slipping-on-rockslide-boulders"},
604
+ "192": { title: "Detour Found", content:"<p>After some searching, you find a rough path leading around the rockslide, eventually rejoining the main trail.</p>", options: [{text:"Continue up the path", next: 22}], illustration:"rough-detour-path-around-rockslide"},
605
+ "21": { title: "Western Ridge", content:"<p>The ridge path is narrow and exposed, with strong winds threatening to push you off.</p>", options: [{text:"Proceed carefully (Dexterity Check)", check:{stat:'dexterity', dc: 14, onFailure: 211}, next: 22 } ], illustration:"narrow-windy-mountain-ridge-path" },
606
+ "22": { title: "Fortress Approach", content:"<p>You've navigated the treacherous paths and now stand near the outer walls of the dark fortress. Guards patrol the battlements.</p>", options: [{text:"Look for an unguarded entrance", next: 99}], illustration:"approaching-dark-fortress-walls-guards"},
607
+ "211": {title:"Lost Balance", content:"<p>A strong gust of wind catches you off guard, sending you tumbling down a steep slope! You lose 10 HP.</p>", options:[{text:"Climb back up and find another way", next: 17}], illustration:"character-falling-off-windy-ridge", hpLoss: 10},
608
  "99": { title: "Game Over / To Be Continued...", content: "<p>Your adventure ends here (for now).</p>", options: [{ text: "Restart", next: 1 }], illustration: "game-over-generic", gameOver: true }
609
  };
610
 
 
612
  let gameState = {
613
  currentPageId: 1,
614
  character: {
615
+ name: "Hero", race: "Human", alignment: "Neutral Good", class: "Adventurer",
616
+ level: 1, xp: 0, xpToNextLevel: 100,
617
+ stats: { strength: 8, intelligence: 10, wisdom: 10, dexterity: 10, constitution: 10, charisma: 8, hp: 12, maxHp: 12 },
618
+ inventory: []
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
619
  }
620
  };
621
 
622
  // Game Logic Functions
623
  function startGame() {
624
+ const defaultChar = { name: "Hero", race: "Human", alignment: "Neutral Good", class: "Adventurer", level: 1, xp: 0, xpToNextLevel: 100, stats: { strength: 8, intelligence: 10, wisdom: 10, dexterity: 10, constitution: 10, charisma: 8, hp: 12, maxHp: 12 }, inventory: [] };
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
625
  gameState = { currentPageId: 1, character: { ...defaultChar } };
626
  renderPage(gameState.currentPageId);
627
  }
628
 
 
 
 
 
 
 
629
  function handleChoiceClick(choiceData) {
630
  const optionNextPageId = parseInt(choiceData.nextPage);
631
  const itemToAdd = choiceData.addItem;
 
638
  if (check) {
639
  const statValue = gameState.character.stats[check.stat] || 10;
640
  const modifier = Math.floor((statValue - 10) / 2);
 
641
  const roll = Math.floor(Math.random() * 20) + 1;
642
+ const totalResult = roll + modifier;
643
  const dc = check.dc;
644
+ console.log(`Check: ${check.stat} (DC ${dc}) | Roll: ${roll} + Mod: ${modifier} = ${totalResult}`);
645
  if (totalResult >= dc) {
646
  nextPageId = optionNextPageId;
647
  rollResultMessage = `<p class="roll-success"><em>Check Success! (${totalResult} vs DC ${dc})</em></p>`;
 
648
  } else {
649
  nextPageId = parseInt(check.onFailure);
650
  rollResultMessage = `<p class="roll-failure"><em>Check Failed! (${totalResult} vs DC ${dc})</em></p>`;
 
660
  gameState.currentPageId = nextPageId;
661
  const nextPageData = gameData[nextPageId];
662
 
 
663
  if (nextPageData) {
664
  if (nextPageData.hpLoss) {
665
  gameState.character.stats.hp -= nextPageData.hpLoss;
 
667
  if (gameState.character.stats.hp <= 0) { gameState.character.stats.hp = 0; console.log("Player died!"); nextPageId = 99; }
668
  }
669
  if (nextPageData.reward) {
670
+ if (nextPageData.reward.xp) { gameState.character.xp += nextPageData.reward.xp; console.log(`Gained ${nextPageData.reward.xp} XP! Total: ${gameState.character.xp}`); }
 
 
 
 
 
 
 
 
671
  if (nextPageData.reward.statIncrease) {
672
  const stat = nextPageData.reward.statIncrease.stat;
673
  const amount = nextPageData.reward.statIncrease.amount;
 
676
  console.log(`Stat ${stat} increased by ${amount}.`);
677
  }
678
  }
679
+ if(nextPageData.reward.addItem && !gameState.character.inventory.includes(nextPageData.reward.addItem)){
680
  gameState.character.inventory.push(nextPageData.reward.addItem);
681
  console.log(`Found item: ${nextPageData.reward.addItem}`);
682
  }
 
 
 
 
683
  }
684
  const conModifier = Math.floor((gameState.character.stats.constitution - 10) / 2);
685
  gameState.character.stats.maxHp = 10 + (conModifier * gameState.character.level);
686
  gameState.character.stats.hp = Math.min(gameState.character.stats.hp, gameState.character.stats.maxHp);
687
  if (nextPageId === 99 && gameState.character.stats.hp <= 0) {
688
+ renderPageInternal(99, gameData[99], rollResultMessage);
689
  return;
690
  }
691
  } else {
692
  console.error(`Data for page ${nextPageId} not found!`);
693
+ renderPageInternal(99, gameData[99], "<p><em>Error: Next page data missing!</em></p>");
694
  return;
695
  }
696
+ renderPageInternal(nextPageId, gameData[nextPageId], rollResultMessage);
697
  }
698
 
699
  function renderPageInternal(pageId, pageData, message = "") {
 
702
  storyContentElement.innerHTML = message + (pageData.content || "<p>...</p>");
703
  updateStatsDisplay();
704
  updateInventoryDisplay();
 
705
  choicesElement.innerHTML = '';
706
  if (pageData.options && pageData.options.length > 0) {
707
  pageData.options.forEach(option => {
 
736
  function renderPage(pageId) { renderPageInternal(pageId, gameData[pageId]); }
737
 
738
  function updateStatsDisplay() {
739
+ const char=gameState.character;
740
  statsElement.innerHTML = `<strong>Stats:</strong> <span>Lvl: ${char.level}</span> <span>XP: ${char.xp}/${char.xpToNextLevel}</span> <span>HP: ${char.stats.hp}/${char.stats.maxHp}</span> <span>Str: ${char.stats.strength}</span> <span>Int: ${char.stats.intelligence}</span> <span>Wis: ${char.stats.wisdom}</span> <span>Dex: ${char.stats.dexterity}</span> <span>Con: ${char.stats.constitution}</span> <span>Cha: ${char.stats.charisma}</span>`;
741
  }
742
 
743
  function updateInventoryDisplay() {
744
+ let h='<strong>Inventory:</strong> ';
745
+ if(gameState.character.inventory.length === 0){
746
+ h+='<em>Empty</em>';
747
  } else {
748
+ gameState.character.inventory.forEach(i=>{
749
+ const d=itemsData[i]||{type:'unknown',description:'???'};
750
+ const c=`item-${d.type||'unknown'}`;
751
+ h+=`<span class="${c}" title="${d.description}">${i}</span>`;
752
  });
753
  }
754
  inventoryElement.innerHTML = h;
755
  }
756
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
757
  function updateScene(illustrationKey) {
758
  if (currentAssemblyGroup) { scene.remove(currentAssemblyGroup); }
759
  scene.fog = null;
 
813
  scene.background = new THREE.Color(0x1A1A1A);
814
  camera.position.set(0, 1.5, 4); camera.lookAt(0, 1, 0);
815
  assemblyFunction = createDarkCaveAssembly; break;
 
 
 
 
 
 
 
 
 
 
 
 
 
 
816
  default:
817
  console.warn(`Unknown illustration key: "${illustrationKey}". Using default.`);
818
  assemblyFunction = createDefaultAssembly; break;
 
823
  adjustLighting(illustrationKey);
824
  } catch (error) {
825
  console.error(`Error creating assembly for ${illustrationKey}:`, error);
826
+ currentAssemblyGroup = createErrorAssembly();
827
+ scene.add(currentAssemblyGroup);
828
+ }
829
+ }
830
+
831
+ function adjustLighting(illustrationKey) {
832
+ scene.children.forEach(child => {
833
+ if (child.isLight && child !== scene.children.find(c => c.isAmbientLight)) {
834
+ scene.remove(child);
835
+ }
836
+ });
837
+ const ambient = scene.children.find(c => c.isAmbientLight);
838
+ let directionalLight;
839
+ switch (illustrationKey) {
840
+ case 'crossroads-signpost-sunny':
841
+ ambient.intensity = 0.8;
842
+ directionalLight = new THREE.DirectionalLight(0xFFF8E1, 1.5);
843
+ directionalLight.position.set(10, 15, 10);
844
+ break;
845
+ case 'dark-forest-entrance-gnarled-roots-filtered-light':
846
+ case 'overgrown-forest-path-glowing-fungi-vines':
847
+ ambient.intensity = 0.3;
848
+ directionalLight = new THREE.DirectionalLight(0xA8E4A0, 0.6);
849
+ directionalLight.position.set(5, 10, 5);
850
+ break;
851
+ case 'dark-cave-entrance-dripping-water':
852
+ ambient.intensity = 0.1;
853
+ directionalLight = new THREE.DirectionalLight(0x666666, 0.2);
854
+ directionalLight.position.set(2, 5, 2);
855
+ break;
856
+ default:
857
+ ambient.intensity = 0.5;
858
+ directionalLight = new THREE.DirectionalLight(0xffffff, 1.2);
859
+ directionalLight.position.set(8, 15, 10);
860
+ }
861
+ directionalLight.castShadow = true;
862
+ directionalLight.shadow.mapSize.set(1024, 1024);
863
+ directionalLight.shadow.camera.near = 0.5;
864
+ directionalLight.shadow.camera.far = 50;
865
+ directionalLight.shadow.camera.left = -15;
866
+ directionalLight.shadow.camera.right = 15;
867
+ directionalLight.shadow.camera.top = 15;
868
+ directionalLight.shadow.camera.bottom = -15;
869
+ scene.add(directionalLight);
870
+ }
871
+
872
+ document.addEventListener('DOMContentLoaded', () => {
873
+ console.log("DOM Ready.");
874
+ try {
875
+ initThreeJS();
876
+ startGame();
877
+ } catch (error) {
878
+ console.error("Init failed:", error);
879
+ storyTitleElement.textContent = "Error";
880
+ storyContentElement.innerHTML = `<p>Init Error. Check console.</p><pre>${error}</pre>`;
881
+ }
882
+ });
883
+ </script>
884
+ </body>
885
+ </html>