|
<!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> |
