Spaces:
Running
Running
<html lang="en"> | |
<head> | |
<meta charset="UTF-8"> | |
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
<title>Text Generation with DistilGPT-2</title> | |
</head> | |
<body> | |
<h2>Text Generation using DistilGPT-2</h2> | |
<p id="status">β³ Loading model, please wait...</p> | |
<textarea id="inputText" rows="3" cols="50" placeholder="Enter your text..."></textarea> | |
<button id="generateBtn" disabled>Generate Text</button> | |
<p><strong>Generated Output:</strong></p> | |
<p id="output"></p> | |
<script type="module"> | |
import { pipeline } from "@xenova/transformers"; | |
let generator; | |
async function initializeModel() { | |
document.getElementById("status").innerText = "β³ Loading model, please wait..."; | |
try { | |
generator = await pipeline("text-generation", "Xenova/distilgpt2"); | |
document.getElementById("status").innerText = "β Model loaded! Ready to generate text."; | |
document.getElementById("generateBtn").disabled = false; | |
} catch (error) { | |
document.getElementById("status").innerText = "β Failed to load model."; | |
console.error("Model loading error:", error); | |
} | |
} | |
async function generateText() { | |
const inputText = document.getElementById("inputText").value; | |
if (!inputText.trim()) { | |
alert("Please enter some text!"); | |
return; | |
} | |
document.getElementById("output").innerText = "β³ Generating..."; | |
try { | |
const output = await generator(inputText, { max_new_tokens: 64, do_sample: true }); | |
document.getElementById("output").innerText = output[0].generated_text; | |
} catch (error) { | |
document.getElementById("output").innerText = "β Error in generation."; | |
console.error("Text generation error:", error); | |
} | |
} | |
document.getElementById("generateBtn").addEventListener("click", generateText); | |
// Initialize model on page load | |
initializeModel(); | |
</script> | |
</body> | |
</html> | |