Update index.html

index.html

@@ -35,18 +35,27 @@
     </div>
 
     <script>
-        let jsonObjects;
+        let jsonDataArray = [];
 
         async function fetchData() {
-            const response = await fetch('characters.output.manually'); // Replace 'your_data_file.txt' with the correct path
-            const data = await response.text();
-            jsonObjects = data.split('\n').filter(Boolean).map(JSON.parse);
+            try {
+                const response = await fetch('characters.json'); // Corrected file name
+                if (!response.ok) {
+                    throw new Error(`Failed to fetch data. Status: ${response.status}`);
+                }
+                const rawData = await response.text();
+                const lines = rawData.split('\n').filter(Boolean);
+
+                jsonDataArray = lines.map(line => JSON.parse(line));
+            } catch (error) {
+                console.error('Fetch error:', error.message);
+            }
         }
 
         function populateDropdown() {
             const selector = document.getElementById('jsonSelector');
 
-            jsonObjects.forEach((_, index) => {
+            jsonDataArray.forEach((_, index) => {
                 const option = document.createElement('option');
                 option.value = index;
                 option.text = `Object ${index + 1}`;
@@ -60,7 +69,7 @@
             const selectedIndex = selector.value;
 
             if (selectedIndex >= 0) {
-                const jsonObject = jsonObjects[selectedIndex];
+                const jsonObject = jsonDataArray[selectedIndex];
 
                 // Update the display container
                 displayContainer.innerHTML = `<div class="json-container">${renderJson(jsonObject)}</div>`;