Spaces:

mgokg
/

gradio_html

Running

App Files Files Community

mgokg commited on Nov 26, 2024

Commit

ceeca2d

verified ·

1 Parent(s): 59bc002

Update index.html

Browse files

Files changed (1) hide show

index.html +28 -51

index.html CHANGED Viewed

@@ -1,62 +1,39 @@
 <!DOCTYPE html>
-<html>
 <head>
-    <title>Gradio App</title>
-    <script src="https://cdn.jsdelivr.net/npm/@gradio/client/dist/index.min.js"></script>
-    <style>
-        body {
-            font-family: Arial, sans-serif;
-            display: flex;
-            justify-content: center;
-            align-items: center;
-            height: 100vh;
-            margin: 0;
-            background-color: #f0f0f0;
-        }
-        #app {
-            width: 80%;
-            max-width: 600px;
-        }
-    </style>
 </head>
 <body>
-    <div id="app"></div>
     <script>
-        const app = new gradio.App({ cors: true });
-        function transcribeAudio(audio) {
-            return new Promise((resolve, reject) => {
-                const reader = new FileReader();
-                reader.readAsDataURL(audio);
-                reader.onloadend = () => {
-                    const base64data = reader.result.split(',')[1]; // Encode audio to base64
-                    fetch('/api/transcribe', {
-                        method: 'POST',
-                        headers: {
-                            'Content-Type': 'application/json'
-                        },
-                        body: JSON.stringify({ audio: base64data })
-                    })
-                    .then(response => response.json())
-                    .then(data => resolve(data.transcription))
-                    .catch(error => reject('Error transcribing audio: ' + error));
-                };
             });
-        }
-        app.launch(() => {
-            return [
-                gradio.Audio({ label: "Spracheingabe" }),
-                gradio.Textbox({ label: "Textausgabe" })
-            ];
-        }, {
-            fn: transcribeAudio,
-            inputs: "audio",
-            outputs: "textbox",
-            title: "Sprachtranskription",
-            description: "Lade eine Audioaufnahme hoch oder spreche direkten Text ein."
-        });
     </script>
 </body>
 </html>

 <!DOCTYPE html>
+<html lang="en">
 <head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Textfeld mit FastAPI</title>
 </head>
 <body>
+    <h1>Textfeld mit FastAPI</h1>
+    <form id="myForm">
+        <label for="prompt">Prompt:</label>
+        <input type="text" id="prompt" name="prompt">
+        <button type="button" onclick="sendData()">Senden</button>
+    </form>
     <script>
+        async function sendData() {
+            const prompt = document.getElementById("prompt").value;
+            const zeitstempel = Math.floor(Date.now() / 1000); // Unix-Zeitstempel
+            const data = {
+                prompt: prompt,
+                zeitstempel: zeitstempel
+            };
+            const response = await fetch("https://huggingface.co/spaces/mgokg.hf.space/items/", {
+                method: "POST",
+                headers: {
+                    "Content-Type": "application/json"
+                },
+                body: JSON.stringify(data)
             });
+            const result = await response.json();
+            console.log(result);
+        }
     </script>
 </body>
 </html>