Easier random seed control; Show the seed number used for a random image, incase it is good and can be refined further

This commit is contained in:
cmdr2 2022-08-24 14:16:48 +05:30
parent 83e3288177
commit eee82fbd32

View File

@ -47,7 +47,7 @@
<div id="configHeader"><b>Advanced settings:</b> [<a id="configToggleBtn" href="#">show</a>]</div>
<div id="config">
<label for="seed">Seed:</label> <input id="seed" name="seed" value="30000"> <small>(use -1 for random seed)</small><br/>
<label for="seed">Seed:</label> <input id="seed" name="seed" value="30000"> <input id="random_seed" name="random_seed" type="checkbox"> <label for="random_seed">Random Image</label> <br/>
<label for="num_outputs">Number of outputs:</label> <select id="num_outputs" name="num_outputs" value="1"><option value="1" selected>1</option><option value="4">4</option></select><br/>
<label for="width">Width:</label> <select id="width" name="width" value="512"><option value="128">128</option><option value="256">256</option><option value="512" selected>512</option><option value="768">768</option><option value="1024">1024</option></select><br/>
<label for="height">Height:</label> <select id="height" name="height" value="512"><option value="128">128</option><option value="256">256</option><option value="512" selected>512</option><option value="768">768</option></select><br/>
@ -118,6 +118,7 @@ async function makeImage() {
btn.disabled = true;
let outputMsg = document.querySelector('#outputMsg')
outputMsg.innerHTML = 'Fetching..'
function logError(msg, res) {
outputMsg.innerHTML = '<span style="color: red">Error: ' + msg + '</span>'
@ -125,6 +126,9 @@ async function makeImage() {
setStatus('request', 'error', 'error')
}
let random_seed = document.querySelector("#random_seed")
let seed = (random_seed.checked ? Math.floor(Math.random() * 10000) : document.querySelector('#seed').value)
let reqBody = {
prompt: document.querySelector('#prompt').value,
num_outputs: document.querySelector('#num_outputs').value,
@ -132,7 +136,7 @@ async function makeImage() {
guidance_scale: document.querySelector('#guidance_scale').value / 10,
width: document.querySelector('#width').value,
height: document.querySelector('#height').value,
seed: document.querySelector('#seed').value,
seed: seed,
}
let res = ''
let time = new Date().getTime()
@ -180,7 +184,7 @@ async function makeImage() {
time = new Date().getTime() - time
time /= 1000
outputMsg.innerHTML = 'Processed in ' + time + ' seconds'
outputMsg.innerHTML = 'Processed in ' + time + ' seconds. Seed: ' + seed
let images = document.querySelector('#images')
images.innerHTML = ''
@ -205,6 +209,11 @@ async function makeImage() {
}
setStatus('request', 'done', 'success')
if (random_seed.checked) {
let seedEl = document.querySelector("#seed")
seedEl.value = seed
}
}
document.querySelector('#makeImage').addEventListener('click', makeImage)
@ -227,6 +236,19 @@ function updateGuidanceScale() {
guidanceScale.addEventListener('input', updateGuidanceScale)
updateGuidanceScale()
let random_seed = document.querySelector("#random_seed")
function checkRandomSeed() {
let seed = document.querySelector("#seed")
if (random_seed.checked) {
seed.disabled = true
seed.value = "random"
} else {
seed.disabled = false
}
}
random_seed.addEventListener('input', checkRandomSeed)
checkRandomSeed()
setInterval(healthCheck, HEALTH_PING_INTERVAL * 1000)
</script>