File size: 1,961 Bytes
bfedca6 |
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 68 69 |
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>T2I Prompt Generator</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 20px;
}
label {
display: block;
margin: 10px 0 5px;
}
input, textarea, button {
width: 100%;
padding: 10px;
margin-bottom: 10px;
}
button {
cursor: pointer;
}
#result {
margin-top: 20px;
}
</style>
</head>
<body>
<h1>Challenge Prompt Generator</h1>
<form id="prompt-form">
<label for="prompt">Prompt:</label>
<input type="text" id="prompt" name="prompt" required>
<label for="max_length">Max Length (optional):</label>
<input type="number" id="max_length" name="max_length" value="77">
<button type="submit">Generate Prompt</button>
</form>
<div id="result">
<h2>Generated Prompt</h2>
<p id="generated-prompt"></p>
</div>
<script>
document.getElementById('prompt-form').addEventListener('submit', async (event) => {
event.preventDefault();
const prompt = document.getElementById('prompt').value;
const max_length = document.getElementById('max_length').value;
const response = await fetch('/', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({
prompt: prompt,
max_length: max_length ? parseInt(max_length) : 77
})
});
const data = await response.json();
document.getElementById('generated-prompt').innerText = data;
});
</script>
</body>
</html>
|