| <!DOCTYPE html> |
| <html> |
| <head> |
| <meta charset="utf-8" /> |
| <meta name="viewport" content="width=device-width" /> |
| <title>OpenBuddy Text Generation</title> |
| <link rel="stylesheet" href="style.css" /> |
| </head> |
| <body> |
| <div class="container"> |
| <h1>OpenBuddy Text Generation</h1> |
| <form id="generateForm"> |
| <div class="form-group"> |
| <label for="promptInput">Enter your prompt:</label> |
| <textarea id="promptInput" rows="5" cols="50" required></textarea> |
| </div> |
| <button type="submit">Generate Text</button> |
| </form> |
| <div id="resultContainer" style="display: none;"> |
| <h2>Generated Text:</h2> |
| <p id="generatedText"></p> |
| </div> |
| </div> |
|
|
| <script> |
| document.getElementById('generateForm').addEventListener('submit', function(e) { |
| e.preventDefault(); |
| const promptInput = document.getElementById('promptInput'); |
| const prompt = promptInput.value.trim(); |
| if (prompt !== '') { |
| generateText(prompt); |
| } |
| }); |
| |
| function generateText(prompt) { |
| const apiUrl = 'https://aringad-test.hf.space/run'; |
| const requestData = { |
| prompt: prompt, |
| model: 'OpenBuddy/openbuddy-llama3-8b-v21.1-8k' |
| }; |
| |
| fetch(apiUrl, { |
| method: 'POST', |
| headers: { |
| 'Content-Type': 'application/json' |
| }, |
| body: JSON.stringify(requestData) |
| }) |
| .then(response => response.json()) |
| .then(data => { |
| const generatedText = data.output; |
| document.getElementById('generatedText').textContent = generatedText; |
| document.getElementById('resultContainer').style.display = 'block'; |
| }) |
| .catch(error => { |
| console.error('Error:', error); |
| alert('An error occurred while generating text.'); |
| }); |
| } |
| </script> |
| </body> |
| </html> |
