resolution presets for image generation extension (#1394)

+ New drawer with resolution presets at image generation extension

---------

Co-authored-by: Cohee <18619528+Cohee1207@users.noreply.github.com>
This commit is contained in:
deffcolony 2023-11-26 16:55:49 +01:00 committed by GitHub
parent 9c01a849cb
commit aaeaa643e3
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 54 additions and 0 deletions

View File

@ -636,6 +636,37 @@ function onSamplerChange() {
saveSettingsDebounced();
}
const resolutionOptions = {
sd_res_512x512: { width: 512, height: 512 },
sd_res_600x600: { width: 600, height: 600 },
sd_res_512x768: { width: 512, height: 768 },
sd_res_768x512: { width: 768, height: 512 },
sd_res_960x540: { width: 960, height: 540 },
sd_res_540x960: { width: 540, height: 960 },
sd_res_1920x1088: { width: 1920, height: 1088 },
sd_res_1088x1920: { width: 1088, height: 1920 },
sd_res_1280x720: { width: 1280, height: 720 },
sd_res_720x1280: { width: 720, height: 1280 },
sd_res_1024x1024: { width: 1024, height: 1024 },
sd_res_1152x896: { width: 1152, height: 896 },
sd_res_896x1152: { width: 896, height: 1152 },
sd_res_1216x832: { width: 1216, height: 832 },
sd_res_832x1216: { width: 832, height: 1216 },
sd_res_1344x768: { width: 1344, height: 768 },
sd_res_768x1344: { width: 768, height: 1344 },
sd_res_1536x640: { width: 1536, height: 640 },
sd_res_640x1536: { width: 640, height: 1536 },
};
function onResolutionChange() {
const selectedOption = $("#sd_resolution").val();
const selectedResolution = resolutionOptions[selectedOption];
$("#sd_width_value").text(selectedResolution.width);
$("#sd_height_value").text(selectedResolution.height);
$("#sd_height").val(selectedResolution.height);
$("#sd_width").val(selectedResolution.width);
}
function onSchedulerChange() {
extension_settings.sd.scheduler = $('#sd_scheduler').find(':selected').val();
saveSettingsDebounced();
@ -2391,6 +2422,7 @@ jQuery(async () => {
$('#sd_model').on('change', onModelChange);
$('#sd_vae').on('change', onVaeChange);
$('#sd_sampler').on('change', onSamplerChange);
$('#sd_resolution').on('change', onResolutionChange);
$('#sd_scheduler').on('change', onSchedulerChange);
$('#sd_prompt_prefix').on('input', onPromptPrefixInput);
$('#sd_negative_prompt').on('input', onNegativePromptInput);

View File

@ -155,6 +155,28 @@
<select id="sd_model"></select>
<label for="sd_sampler">Sampling method</label>
<select id="sd_sampler"></select>
<label for="sd_resolution">Resolution</label>
<select id="sd_resolution">
<option value="sd_res_512x512">512x512 (1:1, icons, profile pictures)</option>
<option value="sd_res_600x600">600x600 (1:1, icons, profile pictures)</option>
<option value="sd_res_512x768">512x768 (2:3, vertical character card)</option>
<option value="sd_res_768x512">768x512 (3:2, horizontale 35 mm movie film)</option>
<option value="sd_res_960x540">960x540 (16:9, horizontale wallpaper)</option>
<option value="sd_res_540x960">540x960 (9:16, vertical wallpaper)</option>
<option value="sd_res_1920x1088">1920x1088 (16:9, 1080p, horizontale wallpaper)</option>
<option value="sd_res_1088x1920">1088x1920 (9:16, 1080p, vertical wallpaper)</option>
<option value="sd_res_1280x720">1280x720 (16:9, 720p, horizontale wallpaper)</option>
<option value="sd_res_720x1280">720x1280 (9:16, 720p, vertical wallpaper)</option>
<option value="sd_res_1024x1024">1024x1024 (1:1, SDXL)</option>
<option value="sd_res_1152x896">1152x896 (9:7, SDXL)</option>
<option value="sd_res_896x1152">896x1152 (7:9, SDXL)</option>
<option value="sd_res_1216x832">1216x832 (19:13, SDXL)</option>
<option value="sd_res_832x1216">832x1216 (13:19, SDXL)</option>
<option value="sd_res_1344x768">1344x768 (4:3, SDXL)</option>
<option value="sd_res_768x1344">768x1344 (3:4, SDXL)</option>
<option value="sd_res_1536x640">1536x640 (24:10, SDXL)</option>
<option value="sd_res_640x1536">640x1536 (10:24, SDXL)</option>
</select>
<div data-sd-source="comfy">
<label for="sd_scheduler">Scheduler</label>
<select id="sd_scheduler"></select>