Merge pull request #564 from iocanel/email-me-a-poem-index

Add minimal html UI for email me a peom
quarkiverse · May 11, 2024 · d2b2f11 · d2b2f11
2 parents 6eeb8ae + ffe7133
commit d2b2f11
Show file tree

Hide file tree

Showing 2 changed files with 39 additions and 1 deletion.
diff --git a/samples/email-a-poem/src/main/java/io/quarkiverse/langchain4j/sample/MyAiService.java b/samples/email-a-poem/src/main/java/io/quarkiverse/langchain4j/sample/MyAiService.java
@@ -15,7 +15,7 @@ public interface MyAiService {
      * @return the poem
      */
     @SystemMessage("You are a professional poet")
-    @UserMessage("Write a poem about {topic}. The poem should be {lines} lines long. Then send this poem by email.")
+    @UserMessage("Write a poem about {topic}. The poem should be {lines} lines long. Then send this poem by email. Your response should include the poem")
     String writeAPoem(String topic, int lines);
 
 }
diff --git a/samples/email-a-poem/src/main/resources/META-INF/resources/index.html b/samples/email-a-poem/src/main/resources/META-INF/resources/index.html
@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Email me a poem</title>
+  </head>
+  <body>
+    <h3>Email me a poem</h3>
+    Click on the button to get a poem.  
+    </p>
+    <div id="status"></div>
+    </p>
+    <textarea id="poem" rows="10" cols="50" readonly></textarea>
+    </p>
+    <button id="emailMe">Email me a poem</button>
+    <button id="clear" disabled>Clear</button>
+
+    <script>
+        document.getElementById('emailMe').addEventListener('click', function() {
+          fetch('http://localhost:8080/email-me-a-poem')
+            .then(response => response.text())
+            .then(data => {
+              document.getElementById('poem').value = data;
+              document.getElementById('clear').disabled = false;
+            })
+            .catch(error => {
+              document.getElementById('status').textContent = 'Failed! Have you started the mock mail container? ';
+            });
+        });
+
+        document.getElementById('clear').addEventListener('click', function() {
+          document.getElementById('poem').value = '';
+          this.disabled = true;
+        });
+    </script>
+  </body>
+</html>