Upload generate_story.html.js

generate_story.html.js

@@ -0,0 +1,29 @@
+<script>
+    function generateStory() {
+        // Get the selected options
+        var genre = document.querySelector('input[name="genre"]:checked').value;
+        var storyTeller = document.querySelector('input[name="story_teller"]:checked').value;
+        var storyTellingStyle = document.querySelector('input[name="story_telling_style"]:checked').value;
+        var creativity = document.querySelector('input[name="creativity"]:checked').value;
+        
+        // Call the Flask endpoint to generate the story
+        var xhr = new XMLHttpRequest();
+        xhr.open("POST", "/generate_story", true);
+        xhr.setRequestHeader("Content-Type", "application/json");
+        xhr.onreadystatechange = function() {
+            if (xhr.readyState === 4 && xhr.status === 200) {
+                // Update the HTML with the generated story
+                document.querySelector("#generated-story").innerHTML = xhr.responseText;
+            }
+        };
+        xhr.send(JSON.stringify({
+            "genre": genre,
+            "story_teller": storyTeller,
+            "story_telling_style": storyTellingStyle,
+            "creativity": creativity
+        }));
+    }
+</script>
+
+<button onclick="generateStory()">Generate Story</button>
+<div id="generated-story"></div>