File size: 2,762 Bytes
45bcb9b | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 |
<!DOCTYPE html>
<html>
<head>
<title>Multilingual LM Demo</title>
<style>
body { font-family: Arial, sans-serif; max-width: 800px; margin: 0 auto; padding: 20px; }
.container { display: flex; flex-direction: column; gap: 20px; }
textarea { width: 100%; height: 100px; padding: 10px; font-size: 16px; }
button { padding: 10px 20px; background: #4CAF50; color: white; border: none; cursor: pointer; }
button:hover { background: #45a049; }
.output { border: 1px solid #ccc; padding: 15px; min-height: 100px; background: #f9f9f9; }
.language-tag { display: inline-block; margin: 5px; padding: 5px 10px; background: #e0e0e0; cursor: pointer; }
</style>
</head>
<body>
<div class="container">
<h1>Multilingual Language Model Demo</h1>
<div>
<strong>Language:</strong>
<span class="language-tag" onclick="setLanguage('[EN] ')">English</span>
<span class="language-tag" onclick="setLanguage('[HI] ')">Hindi</span>
<span class="language-tag" onclick="setLanguage('[PA] ')">Punjabi</span>
</div>
<textarea id="prompt" placeholder="Enter your prompt here..."></textarea>
<div>
<label>Temperature: <input type="range" id="temp" min="0.1" max="2.0" step="0.1" value="0.7"></label>
<label>Max Length: <input type="number" id="maxlen" min="20" max="500" value="100"></label>
</div>
<button onclick="generate()">Generate</button>
<div class="output" id="output">Response will appear here...</div>
</div>
<script>
function setLanguage(tag) {
document.getElementById('prompt').value = tag;
}
async function generate() {
const prompt = document.getElementById('prompt').value;
const temp = document.getElementById('temp').value;
const maxlen = document.getElementById('maxlen').value;
document.getElementById('output').innerHTML = 'Generating...';
try {
const response = await fetch('/generate', {
method: 'POST',
headers: {'Content-Type': 'application/json'},
body: JSON.stringify({prompt, temp, maxlen})
});
const data = await response.json();
document.getElementById('output').innerHTML = data.response;
} catch (error) {
document.getElementById('output').innerHTML = 'Error: ' + error;
}
}
</script>
</body>
</html>
|