Merge pull request #1004 from JeLuF/toosmall

Warn users about small image dimensions
This commit is contained in:
cmdr2 2023-03-14 10:42:13 +05:30 committed by GitHub
commit 0ddcc98a57
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 22 additions and 7 deletions

View File

@ -211,6 +211,7 @@
<option value="2048">2048</option>
</select>
<label for="height"><small>(height)</small></label>
<div id="small_image_warning" class="displayNone">Small image sizes can cause bad image quality</div>
</td></tr>
<tr class="pl-5"><td><label for="num_inference_steps">Inference Steps:</label></td><td> <input id="num_inference_steps" name="num_inference_steps" size="4" value="25" onkeypress="preventNonNumericalInput(event)"></td></tr>
<tr class="pl-5"><td><label for="guidance_scale_slider">Guidance Scale:</label></td><td> <input id="guidance_scale_slider" name="guidance_scale_slider" class="editor-slider" value="75" type="range" min="11" max="500"> <input id="guidance_scale" name="guidance_scale" size="4" pattern="^[0-9\.]+$" onkeypress="preventNonNumericalInput(event)"></td></tr>

View File

@ -1203,6 +1203,11 @@ div.top-right {
right: 8px;
}
#small_image_warning {
font-size: smaller;
color: var(--status-orange);
}
button#save-system-settings-btn {
padding: 4pt 8pt;
}

View File

@ -37,6 +37,9 @@
/* Main theme color, hex color fallback. */
--theme-color-fallback: #673AB6;
--status-orange: rgb(200, 139, 0);
--status-green: green;
--status-red: red;
}
.theme-light {

View File

@ -24,6 +24,7 @@ let randomSeedField = document.querySelector("#random_seed")
let seedField = document.querySelector('#seed')
let widthField = document.querySelector('#width')
let heightField = document.querySelector('#height')
let smallImageWarning = document.querySelector('#small_image_warning')
let initImageSelector = document.querySelector("#init_image")
let initImagePreview = document.querySelector("#init_image_preview")
let initImageSizeBox = document.querySelector("#init_image_size_box")
@ -169,18 +170,18 @@ function setStatus(statusType, msg, msgType) {
function setServerStatus(event) {
switch(event.type) {
case 'online':
serverStatusColor.style.color = 'green'
serverStatusMsg.style.color = 'green'
serverStatusColor.style.color = 'var(--status-green)'
serverStatusMsg.style.color = 'var(--status-green)'
serverStatusMsg.innerText = 'Stable Diffusion is ' + event.message
break
case 'busy':
serverStatusColor.style.color = 'rgb(200, 139, 0)'
serverStatusMsg.style.color = 'rgb(200, 139, 0)'
serverStatusColor.style.color = 'var(--status-orange)'
serverStatusMsg.style.color = 'var(--status-orange)'
serverStatusMsg.innerText = 'Stable Diffusion is ' + event.message
break
case 'error':
serverStatusColor.style.color = 'red'
serverStatusMsg.style.color = 'red'
serverStatusColor.style.color = 'var(--status-red)'
serverStatusMsg.style.color = 'var(--status-red)'
serverStatusMsg.innerText = 'Stable Diffusion has stopped'
break
}
@ -1307,6 +1308,11 @@ function onDimensionChange() {
else {
imageInpainter.setImage(initImagePreview.src, widthValue, heightValue)
}
if ( widthValue < 512 && heightValue < 512 ) {
smallImageWarning.classList.remove('displayNone')
} else {
smallImageWarning.classList.add('displayNone')
}
}
diskPathField.disabled = !saveToDiskField.checked