diff options
Diffstat (limited to 'javascript')
-rw-r--r-- | javascript/dragdrop.js | 24 | ||||
-rw-r--r-- | javascript/hints.js | 5 | ||||
-rw-r--r-- | javascript/notification.js | 3 | ||||
-rw-r--r-- | javascript/ui.js | 29 |
4 files changed, 50 insertions, 11 deletions
diff --git a/javascript/dragdrop.js b/javascript/dragdrop.js index c01f66e2..5aac57f7 100644 --- a/javascript/dragdrop.js +++ b/javascript/dragdrop.js @@ -68,13 +68,19 @@ window.addEventListener('paste', e => { if ( ! isValidImageList( files ) ) { return; } - [...gradioApp().querySelectorAll('input[type=file][accept="image/x-png,image/gif,image/jpeg"]')] - .filter(input => !input.matches('.\\!hidden input[type=file]')) - .forEach(input => { - input.files = files; - input.dispatchEvent(new Event('change')) - }); - [...gradioApp().querySelectorAll('[data-testid="image"]')] - .filter(imgWrap => !imgWrap.closest('.\\!hidden')) - .forEach(imgWrap => dropReplaceImage( imgWrap, files )); + + const visibleImageFields = [...gradioApp().querySelectorAll('[data-testid="image"]')] + .filter(el => uiElementIsVisible(el)); + if ( ! visibleImageFields.length ) { + return; + } + + const firstFreeImageField = visibleImageFields + .filter(el => el.querySelector('input[type=file]'))?.[0]; + + dropReplaceImage( + firstFreeImageField ? + firstFreeImageField : + visibleImageFields[visibleImageFields.length - 1] + , files ); }); diff --git a/javascript/hints.js b/javascript/hints.js index 59dd770c..84694eeb 100644 --- a/javascript/hints.js +++ b/javascript/hints.js @@ -15,6 +15,7 @@ titles = { "\u267b\ufe0f": "Reuse seed from last generation, mostly useful if it was randomed", "\u{1f3a8}": "Add a random artist to the prompt.", "\u2199\ufe0f": "Read generation parameters from prompt into user interface.", + "\uD83D\uDCC2": "Open images output directory", "Inpaint a part of image": "Draw a mask over an image, and the script will regenerate the masked area with content according to prompt", "SD upscale": "Upscale image normally, split result into tiles, improve each tile using img2img, merge whole image back", @@ -57,8 +58,8 @@ titles = { "Interrogate": "Reconstruct prompt from existing image and put it into the prompt field.", - "Images filename pattern": "Use following tags to define how filenames for images are chosen: [steps], [cfg], [prompt], [prompt_spaces], [width], [height], [styles], [sampler], [seed], [model_hash], [prompt_words], [date], [datetime], [job_timestamp]; leave empty for default.", - "Directory name pattern": "Use following tags to define how subdirectories for images and grids are chosen: [steps], [cfg], [prompt], [prompt_spaces], [width], [height], [styles], [sampler], [seed], [model_hash], [prompt_words], [date], [datetime], [job_timestamp]; leave empty for default.", + "Images filename pattern": "Use following tags to define how filenames for images are chosen: [steps], [cfg], [prompt], [prompt_no_styles], [prompt_spaces], [width], [height], [styles], [sampler], [seed], [model_hash], [prompt_words], [date], [datetime], [job_timestamp]; leave empty for default.", + "Directory name pattern": "Use following tags to define how subdirectories for images and grids are chosen: [steps], [cfg], [prompt], [prompt_no_styles], [prompt_spaces], [width], [height], [styles], [sampler], [seed], [model_hash], [prompt_words], [date], [datetime], [job_timestamp]; leave empty for default.", "Max prompt words": "Set the maximum number of words to be used in the [prompt_words] option; ATTENTION: If the words are too long, they may exceed the maximum length of the file path that the system can handle", "Loopback": "Process an image, use it as an input, repeat.", diff --git a/javascript/notification.js b/javascript/notification.js index e8159a7e..bdf614ad 100644 --- a/javascript/notification.js +++ b/javascript/notification.js @@ -25,6 +25,9 @@ onUiUpdate(function(){ lastHeadImg = headImg; + // play notification sound if available + gradioApp().querySelector('#audio_notification audio')?.play(); + if (document.hasFocus()) return; // Multiple copies of the images are in the DOM when one is selected. Dedup with a Set to get the real number generated. diff --git a/javascript/ui.js b/javascript/ui.js index 7db4db48..bfe02410 100644 --- a/javascript/ui.js +++ b/javascript/ui.js @@ -182,4 +182,33 @@ onUiUpdate(function(){ }); json_elem.parentElement.style.display="none" + + if (!txt2img_textarea) { + txt2img_textarea = gradioApp().querySelector("#txt2img_prompt > label > textarea"); + txt2img_textarea?.addEventListener("input", () => update_token_counter("txt2img_token_button")); + txt2img_textarea?.addEventListener("keyup", (event) => submit_prompt(event, "txt2img_generate")); + } + if (!img2img_textarea) { + img2img_textarea = gradioApp().querySelector("#img2img_prompt > label > textarea"); + img2img_textarea?.addEventListener("input", () => update_token_counter("img2img_token_button")); + img2img_textarea?.addEventListener("keyup", (event) => submit_prompt(event, "img2img_generate")); + } }) + +let txt2img_textarea, img2img_textarea = undefined; +let wait_time = 800 +let token_timeout; + +function submit_prompt(event, generate_button_id) { + if (event.altKey && event.keyCode === 13) { + event.preventDefault(); + gradioApp().getElementById(generate_button_id).click(); + return; + } +} + +function update_token_counter(button_id) { + if (token_timeout) + clearTimeout(token_timeout); + token_timeout = setTimeout(() => gradioApp().getElementById(button_id)?.click(), wait_time); +} |