Update public/index.html

public/index.html

@@ -55,6 +55,9 @@
     select{background:var(--surface);color:var(--text)}
     select:focus{outline:none;border-color:#555}
 
+    /* --- legördülő lista (option) látható legyen sötét témán is --- */
+    select option{background:var(--surface);color:var(--text);}
+
     button{
       font-weight:600;cursor:pointer;margin-top:1rem;background:var(--btn-bg);
     }
@@ -83,7 +86,7 @@
   <main class="card">
     <header>
       <h1>Theos ex Machina</h1>
-      <p style="opacity:0.83;margin-bottom:1.6rem">itt az idő, hogy Te, Isten és a AI találkozzanak egymással. Válassz idézetet, vagy Tolle lege, pörgess egy random verset kattinva a <strong>🎲 Random</strong> gombra!<br><small style="opacity:0.7">A forrás a biblia meg az AI &amp; ha nincs benne értelem, ne legyen</small></p>
+      <p style="opacity:0.83;margin-bottom:1.6rem">Válassz könyvet, fejezetet és verset, vagy kattints a <strong>🎲 Random</strong> gombra!<br><small style="opacity:0.7">Forrás: KJV → AI által fordított &amp; értelmezett magyar szöveg</small></p>
     </header>
 
     <label for="book">Könyv</label>
@@ -101,8 +104,8 @@
     </div>
 
     <div class="grid btns">
-      <button id="randomBtn">🎲 Tolle lege, nyisd és olvasd</button>
-      <button id="generateBtn">📖 Beleőrülök</button>
+      <button id="randomBtn">🎲 Random vers</button>
+      <button id="generateBtn">📖 Elemzés</button>
     </div>
 
     <section id="result">
@@ -129,4 +132,29 @@ refresh();
 
 randomBtn.addEventListener("click",()=>{const chIdx=Math.floor(Math.random()*window.chapterMap.length);chapterSel.value=chIdx+1;fill(verseSel,window.chapterMap[chIdx]);verseSel.value=Math.floor(Math.random()*window.chapterMap[chIdx])+1;});
 
-async function generate(){const payload={book:bookSel.value,chapter:chapterSel.value,verse:verseSel.value};generateBtn.disabled=true;generateBtn.textContent="⏳ Kérem…";try{const r
+async function generate(){
+  const payload = { book: bookSel.value, chapter: chapterSel.value, verse: verseSel.value };
+  generateBtn.disabled = true;
+  generateBtn.textContent = "⏳ Kérem…";
+  try {
+    const r = await fetch("/api/analyze", {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify(payload)
+    });
+    if (!r.ok) throw new Error((await r.json()).error);
+    const d = await r.json();
+    analysisEl.textContent = d.output;
+    resultBox.style.display = "block";
+  } catch (e) {
+    alert(e.message);
+  } finally {
+    generateBtn.disabled = false;
+    generateBtn.textContent = "📖 Elemzés";
+  }
+}
+
+generateBtn.addEventListener("click", generate);
+</script>
+</body>
+</html>