aboutsummaryrefslogtreecommitdiffstats
path: root/javascript
diff options
context:
space:
mode:
Diffstat (limited to 'javascript')
-rw-r--r--javascript/dragdrop.js24
-rw-r--r--javascript/hints.js5
-rw-r--r--javascript/notification.js3
-rw-r--r--javascript/ui.js29
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);
+}