added word shuffle functionality

experiment-scripts/index.html

@@ -299,6 +299,7 @@
             <br>
     
             <div class="button-container">
+                <button type="button" id="button-shuffle-words">Shuffle</button>
                 <button type="button" id="button-create-word-items">Modify</button>
             </div>
         </div>
@@ -441,6 +442,40 @@
             window.open('data:text/csv;charset=utf-8,' + escape(data), '_blank');
         });
 
+        document.getElementById("button-shuffle-words").addEventListener("click", async () => {
+            const wordList = document.getElementById("word-list");
+            const text = wordList.value.trim();
+            
+            if (!text) {
+                alert("Please enter words to shuffle first.");
+                return;
+            }
+            
+            // Don't allow shuffle if word list is already running
+            if (frameId !== undefined) {
+                alert("Cannot shuffle while word list is running. Please stop first.");
+                return;
+            }
+            
+            const words = text.split('\n').map(word => word.trim()).filter(word => word);
+            
+            try {
+                const response = await fetch("/shuffle", {
+                    method: "POST",
+                    headers: {'Content-Type': 'application/json'},
+                    body: JSON.stringify({ words: words }),
+                });
+                
+                const result = await response.json();
+                if (result.status === "ok") {
+                    wordList.value = result.shuffled_words.join('\n');
+                }
+            } catch (error) {
+                console.error("Error shuffling words:", error);
+                alert("Failed to shuffle words. Please try again.");
+            }
+        });
+
         document.getElementById("button-create-word-items").addEventListener("click", () => {
             createWordItems();
             if (frameId) {