Spaces:

awacke1
/

ChooseYourOwnAdventure2

Running

App Files Files Community

awacke1 commited on 24 days ago

Commit

ddb7f9e

verified ·

1 Parent(s): 44893d0

Update index.html

Browse files

Files changed (1) hide show

index.html +31 -32

index.html CHANGED Viewed

@@ -3,7 +3,7 @@
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>World Grid Test (Fixed)</title>
     <style>
         body { font-family: 'Courier New', monospace; background-color: #111; color: #eee; margin: 0; padding: 0; overflow: hidden; display: flex; flex-direction: column; height: 100vh; }
         #game-container { display: flex; flex-grow: 1; overflow: hidden; }
@@ -69,9 +69,9 @@
         const choicesElement = document.getElementById('choices');
         const statsElement = document.getElementById('stats-display');
         const inventoryElement = document.getElementById('inventory-display');
-        const actionInfoElement = document.getElementById('action-info'); // <<< Declaration was missing
-        let scene, camera, renderer, clock, controls, raycaster, mouse;
         let worldGroup = null;
         let zoneGroups = {};
         let currentMessage = "";
@@ -105,8 +105,6 @@
             scene = new THREE.Scene();
             scene.background = new THREE.Color(0x1a1a1a);
             clock = new THREE.Clock();
-            raycaster = new THREE.Raycaster();
-            mouse = new THREE.Vector2();
             worldGroup = new THREE.Group();
             scene.add(worldGroup);
@@ -169,9 +167,9 @@
         function setupLighting(type = 'default') {
              currentLights.forEach(light => {
-                 if (light) scene.remove(light); // Remove from main scene
              });
-             currentLights = []; // Reset tracked lights
              let ambientIntensity = 0.5;
              let dirIntensity = 1.0;
@@ -182,16 +180,17 @@
              if (type === 'cave') {
                  ambientIntensity = 0.2; dirIntensity = 0;
                  const ptLight = new THREE.PointLight(0xffaa55, 1.5, 12, 1);
-                 ptLight.position.set(0, 3, 0); // Place light relative to zone origin
-                 ptLight.castShadow = true; ptLight.shadow.mapSize.set(512, 512);
-                 // Point light will be added to the zone group later
-                 currentLights.push(ptLight); // Track it to add later
             }
              if (type === 'ruins') { ambientIntensity = 0.4; dirIntensity = 0.7; dirColor = 0xaaaaff; dirPosition = new THREE.Vector3(-8, 12, -5); }
              const ambientLight = new THREE.AmbientLight(0xffffff, ambientIntensity);
-             scene.add(ambientLight); // Add ambient to main scene
-             currentLights.push(ambientLight); // Track ambient
              if (dirIntensity > 0) {
                  const directionalLight = new THREE.DirectionalLight(dirColor, dirIntensity);
@@ -203,7 +202,7 @@
                  directionalLight.shadow.camera.left = -sb; directionalLight.shadow.camera.right = sb;
                  directionalLight.shadow.camera.top = sb; directionalLight.shadow.camera.bottom = -sb;
                  directionalLight.shadow.bias = -0.0005;
-                 scene.add(directionalLight); // Add directional to main scene
                  currentLights.push(directionalLight);
              }
         }
@@ -252,11 +251,11 @@
                  const st = createMesh(coneGeo, MAT.stone, {x: (Math.random()-0.5)*16, y: 6 + Math.random()*2, z: (Math.random()-0.5)*16}, {x:Math.PI});
                  group.add(st);
              }
-             const ptLight = new THREE.PointLight(0xffaa55, 1.5, 12, 1); // Create cave light
-             ptLight.position.set(0, 3, 0);
-             ptLight.castShadow = true;
-             ptLight.shadow.mapSize.set(512, 512);
-             group.add(ptLight); // Add light to the cave group itself
              group.visible = false;
              return { group, lighting: 'cave', title: "Dim Cave", entryText: "It's dark and damp in here. Water drips.", options: [], zoneId: zoneId };
          }
@@ -279,11 +278,10 @@
              return { group, lighting: 'ruins', title: "Crumbling Ruins", entryText: "The wind whistles through broken walls.", options: [], zoneId: zoneId };
          }
         function getZoneId(row, col) { return `zone_${row}_${col}`; }
         function populateZoneCreators() {
-            zoneCreators = {}; // Clear previous if any
             for (let r = 0; r < MAP_ROWS; r++) {
                 for (let c = 0; c < MAP_COLS; c++) {
                     const zoneId = getZoneId(r, c);
@@ -322,13 +320,12 @@
                 character: JSON.parse(JSON.stringify(defaultChar))
             };
             populateZoneCreators();
-            zoneGroups = {}; // Clear loaded zones
-            // Clear existing groups from worldGroup if any
              while(worldGroup.children.length > 0){
                  worldGroup.remove(worldGroup.children[0]);
              }
             console.log("Starting new game:", gameState);
-            transitionToZone(getZoneId(1, 1)); // Start in center
         }
         function transitionToZone(newZoneId) {
@@ -367,16 +364,15 @@
              }
              gameState.currentZoneId = newZoneId;
-             setupLighting(zoneInfo.lighting || 'default');
-             // Add zone-specific lights to the group if they exist in currentLights but not scene
              currentLights.forEach(light => {
-                if (light.isPointLight && !light.parent) { // Only add point lights not already in scene
-                    zoneInfo.group.add(light);
                 }
              });
              camera.position.set(0, 6, 12);
              controls.target.set(0, 1, 0);
              controls.update();
@@ -411,7 +407,7 @@
                   const button = document.createElement('button');
                   button.classList.add('choice-button');
                   button.textContent = `Go ${directions[dir]}`;
-                  button.onclick = () => transitionToZone(neighborId);
                   choicesElement.appendChild(button);
              }
@@ -430,7 +426,7 @@
              updateActionInfo();
         }
-        window.transitionToZone = transitionToZone; // Make accessible from potential inline event handlers if needed
         function updateStatsDisplay() {
@@ -454,6 +450,7 @@
         }
         function updateActionInfo() {
             actionInfoElement.textContent = `Zone: ${gameState.currentZoneId || 'None'}`;
         }
@@ -462,6 +459,8 @@
         function togglePlacementMode() { console.log("Placement disabled.");}
         function startCombat(enemyTypeId) { console.log("Combat disabled."); }
         function handleCombatAction(action) { console.log("Combat disabled."); }
         document.addEventListener('DOMContentLoaded', () => {
@@ -469,7 +468,7 @@
              try {
                  initThreeJS();
                  if (!scene || !camera || !renderer) throw new Error("Three.js failed to initialize.");
-                 startGame();
                  console.log("Game world initialized and started.");
              } catch (error) {
                  console.error("Initialization failed:", error);

 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>World Grid Test (Fixed Const Assignment)</title>
     <style>
         body { font-family: 'Courier New', monospace; background-color: #111; color: #eee; margin: 0; padding: 0; overflow: hidden; display: flex; flex-direction: column; height: 100vh; }
         #game-container { display: flex; flex-grow: 1; overflow: hidden; }
         const choicesElement = document.getElementById('choices');
         const statsElement = document.getElementById('stats-display');
         const inventoryElement = document.getElementById('inventory-display');
+        const actionInfoElement = document.getElementById('action-info');
+        let scene, camera, renderer, clock, controls;
         let worldGroup = null;
         let zoneGroups = {};
         let currentMessage = "";
             scene = new THREE.Scene();
             scene.background = new THREE.Color(0x1a1a1a);
             clock = new THREE.Clock();
             worldGroup = new THREE.Group();
             scene.add(worldGroup);
         function setupLighting(type = 'default') {
              currentLights.forEach(light => {
+                 if (light) scene.remove(light);
              });
+             currentLights = [];
              let ambientIntensity = 0.5;
              let dirIntensity = 1.0;
              if (type === 'cave') {
                  ambientIntensity = 0.2; dirIntensity = 0;
                  const ptLight = new THREE.PointLight(0xffaa55, 1.5, 12, 1);
+                 ptLight.position.set(0, 3, 0);
+                 ptLight.castShadow = true;
+                 ptLight.shadow.mapSize.set(512, 512);
+                 // Will be added to zone group later
+                 currentLights.push(ptLight);
             }
              if (type === 'ruins') { ambientIntensity = 0.4; dirIntensity = 0.7; dirColor = 0xaaaaff; dirPosition = new THREE.Vector3(-8, 12, -5); }
              const ambientLight = new THREE.AmbientLight(0xffffff, ambientIntensity);
+             scene.add(ambientLight);
+             currentLights.push(ambientLight);
              if (dirIntensity > 0) {
                  const directionalLight = new THREE.DirectionalLight(dirColor, dirIntensity);
                  directionalLight.shadow.camera.left = -sb; directionalLight.shadow.camera.right = sb;
                  directionalLight.shadow.camera.top = sb; directionalLight.shadow.camera.bottom = -sb;
                  directionalLight.shadow.bias = -0.0005;
+                 scene.add(directionalLight);
                  currentLights.push(directionalLight);
              }
         }
                  const st = createMesh(coneGeo, MAT.stone, {x: (Math.random()-0.5)*16, y: 6 + Math.random()*2, z: (Math.random()-0.5)*16}, {x:Math.PI});
                  group.add(st);
              }
+             // Add point light specific to cave if tracked
+             const caveLight = currentLights.find(l => l && l.isPointLight);
+             if (caveLight) {
+                 group.add(caveLight);
+             }
              group.visible = false;
              return { group, lighting: 'cave', title: "Dim Cave", entryText: "It's dark and damp in here. Water drips.", options: [], zoneId: zoneId };
          }
              return { group, lighting: 'ruins', title: "Crumbling Ruins", entryText: "The wind whistles through broken walls.", options: [], zoneId: zoneId };
          }
         function getZoneId(row, col) { return `zone_${row}_${col}`; }
         function populateZoneCreators() {
+            // No reassignment here! Just adding properties to existing const object.
             for (let r = 0; r < MAP_ROWS; r++) {
                 for (let c = 0; c < MAP_COLS; c++) {
                     const zoneId = getZoneId(r, c);
                 character: JSON.parse(JSON.stringify(defaultChar))
             };
             populateZoneCreators();
+            zoneGroups = {};
              while(worldGroup.children.length > 0){
                  worldGroup.remove(worldGroup.children[0]);
              }
             console.log("Starting new game:", gameState);
+            transitionToZone(getZoneId(1, 1));
         }
         function transitionToZone(newZoneId) {
              }
              gameState.currentZoneId = newZoneId;
+             setupLighting(zoneInfo.lighting || 'default'); // Setup general lighting
+              // Add zone-specific lights from setupLighting to the *current* zone's group
              currentLights.forEach(light => {
+                if (light && light.isPointLight && !light.parent) { // If it's a point light tracked but not in scene
+                    zoneInfo.group.add(light); // Add it to the now visible group
                 }
              });
              camera.position.set(0, 6, 12);
              controls.target.set(0, 1, 0);
              controls.update();
                   const button = document.createElement('button');
                   button.classList.add('choice-button');
                   button.textContent = `Go ${directions[dir]}`;
+                  button.onclick = () => transitionToZone(neighborId); // Use transitionToZone directly
                   choicesElement.appendChild(button);
              }
              updateActionInfo();
         }
+        window.transitionToZone = transitionToZone; // Make globally accessible
         function updateStatsDisplay() {
         }
         function updateActionInfo() {
+            if (!actionInfoElement) return; // Guard against element not existing yet
             actionInfoElement.textContent = `Zone: ${gameState.currentZoneId || 'None'}`;
         }
         function togglePlacementMode() { console.log("Placement disabled.");}
         function startCombat(enemyTypeId) { console.log("Combat disabled."); }
         function handleCombatAction(action) { console.log("Combat disabled."); }
+         window.startCombat = startCombat;
+         window.handleCombatAction = handleCombatAction;
         document.addEventListener('DOMContentLoaded', () => {
              try {
                  initThreeJS();
                  if (!scene || !camera || !renderer) throw new Error("Three.js failed to initialize.");
+                 startGame(); // Start game directly
                  console.log("Game world initialized and started.");
              } catch (error) {
                  console.error("Initialization failed:", error);