Update script.js

script.js

@@ -1,67 +1,40 @@
-let data; // Placeholder for slide configuration
-let currentIndex = 0;
-
-const slideTitle = document.getElementById("slide-title");
-const slideImage = document.getElementById("slide-image");
-const contentArea = document.getElementById("content-area");
+const slideTitle = document.getElementById('slide-title');
+const slideImage = document.getElementById('slide-image');
+const prevBtn = document.getElementById('prev-btn');
+const nextBtn = document.getElementById('next-btn');
 
-const textIcon = document.getElementById("text-icon");
-const imageIcon = document.getElementById("image-icon");
-const videoIcon = document.getElementById("video-icon");
-
-const prevBtn = document.getElementById("prev-btn");
-const nextBtn = document.getElementById("next-btn");
+let data = [];
+let currentIndex = 0;
 
-// Fetch configuration from the JSON file
-async function loadConfig() {
-    const response = await fetch('slide_config.json');
-    data = await response.json();
-    loadSlide(currentIndex);
+// Fetch slide configuration
+async function fetchSlideConfig() {
+    try {
+        const response = await fetch('slide_config.json');
+        const jsonData = await response.json();
+        data = jsonData.slides;
+        loadSlide(currentIndex);
+    } catch (error) {
+        console.error('Error loading slide configuration:', error);
+    }
 }
 
 function loadSlide(index) {
-    const slide = data.slides[index];
-    slideTitle.textContent = slide.id.replace("_", " ");
-    slideImage.src = slide.image;
+    if (data.length === 0) return;
 
-    const existingText = document.getElementById("slide-text");
-    if (existingText) existingText.remove();
-
-    const existingVideo = document.getElementById("slide-video");
-    if (existingVideo) existingVideo.remove();
+    const slide = data[index];
+    slideTitle.textContent = slide.id.replace('_', ' ');
+    slideImage.src = slide.image;
 }
 
-textIcon.addEventListener("click", () => {
-    const slide = data.slides[currentIndex];
-    const textOverlay = document.createElement("div");
-    textOverlay.id = "slide-text";
-    textOverlay.textContent = slide.text;
-    contentArea.appendChild(textOverlay);
-});
-
-imageIcon.addEventListener("click", () => {
-    loadSlide(currentIndex);
-});
-
-videoIcon.addEventListener("click", () => {
-    const slide = data.slides[currentIndex];
-    const videoEmbed = document.createElement("iframe");
-    videoEmbed.id = "slide-video";
-    videoEmbed.src = slide.video;
-    videoEmbed.frameBorder = "0";
-    videoEmbed.allow = "autoplay; encrypted-media";
-    contentArea.appendChild(videoEmbed);
-});
-
-prevBtn.addEventListener("click", () => {
-    currentIndex = (currentIndex - 1 + data.slides.length) % data.slides.length;
+prevBtn.addEventListener('click', () => {
+    currentIndex = (currentIndex - 1 + data.length) % data.length;
     loadSlide(currentIndex);
 });
 
-nextBtn.addEventListener("click", () => {
-    currentIndex = (currentIndex + 1) % data.slides.length;
+nextBtn.addEventListener('click', () => {
+    currentIndex = (currentIndex + 1) % data.length;
     loadSlide(currentIndex);
 });
 
-// Load configuration and initialize the app
-loadConfig();
+// Initialize
+fetchSlideConfig();