aboutsummaryrefslogtreecommitdiff
path: root/javascript
diff options
context:
space:
mode:
Diffstat (limited to 'javascript')
-rw-r--r--javascript/dragdrop.js4
-rw-r--r--javascript/edit-attention.js2
-rw-r--r--javascript/hints.js2
-rw-r--r--javascript/imageParams.js2
-rw-r--r--javascript/progressbar.js35
-rw-r--r--javascript/ui.js12
6 files changed, 43 insertions, 14 deletions
diff --git a/javascript/dragdrop.js b/javascript/dragdrop.js
index fe0185a5..070cf255 100644
--- a/javascript/dragdrop.js
+++ b/javascript/dragdrop.js
@@ -43,7 +43,7 @@ function dropReplaceImage( imgWrap, files ) {
window.document.addEventListener('dragover', e => {
const target = e.composedPath()[0];
const imgWrap = target.closest('[data-testid="image"]');
- if ( !imgWrap && target.placeholder != "Prompt") {
+ if ( !imgWrap && target.placeholder.indexOf("Prompt") == -1) {
return;
}
e.stopPropagation();
@@ -53,7 +53,7 @@ window.document.addEventListener('dragover', e => {
window.document.addEventListener('drop', e => {
const target = e.composedPath()[0];
- if (target.placeholder === "Prompt") {
+ if (target.placeholder.indexOf("Prompt") == -1) {
return;
}
const imgWrap = target.closest('[data-testid="image"]');
diff --git a/javascript/edit-attention.js b/javascript/edit-attention.js
index 3f1d2fbb..67084e7a 100644
--- a/javascript/edit-attention.js
+++ b/javascript/edit-attention.js
@@ -2,6 +2,8 @@ addEventListener('keydown', (event) => {
let target = event.originalTarget || event.composedPath()[0];
if (!target.hasAttribute("placeholder")) return;
if (!target.placeholder.toLowerCase().includes("prompt")) return;
+ if (! (event.metaKey || event.ctrlKey)) return;
+
let plus = "ArrowUp"
let minus = "ArrowDown"
diff --git a/javascript/hints.js b/javascript/hints.js
index 8fec907d..b98012f5 100644
--- a/javascript/hints.js
+++ b/javascript/hints.js
@@ -16,6 +16,8 @@ titles = {
"\u{1f3a8}": "Add a random artist to the prompt.",
"\u2199\ufe0f": "Read generation parameters from prompt or last generation if prompt is empty into user interface.",
"\u{1f4c2}": "Open images output directory",
+ "\u{1f4be}": "Save style",
+ "\u{1f4cb}": "Apply selected styles to current prompt",
"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",
diff --git a/javascript/imageParams.js b/javascript/imageParams.js
index 4a7b0900..67404a89 100644
--- a/javascript/imageParams.js
+++ b/javascript/imageParams.js
@@ -2,7 +2,7 @@ window.onload = (function(){
window.addEventListener('drop', e => {
const target = e.composedPath()[0];
const idx = selected_gallery_index();
- if (target.placeholder != "Prompt") return;
+ if (target.placeholder.indexOf("Prompt") == -1) return;
let prompt_target = get_tab_index('tabs') == 1 ? "img2img_prompt_image" : "txt2img_prompt_image";
diff --git a/javascript/progressbar.js b/javascript/progressbar.js
index 4395a215..076f0a97 100644
--- a/javascript/progressbar.js
+++ b/javascript/progressbar.js
@@ -1,5 +1,7 @@
// code related to showing and updating progressbar shown as the image is being made
global_progressbars = {}
+galleries = {}
+galleryObservers = {}
function check_progressbar(id_part, id_progressbar, id_progressbar_span, id_skip, id_interrupt, id_preview, id_gallery){
var progressbar = gradioApp().getElementById(id_progressbar)
@@ -31,13 +33,24 @@ function check_progressbar(id_part, id_progressbar, id_progressbar_span, id_skip
preview.style.width = gallery.clientWidth + "px"
preview.style.height = gallery.clientHeight + "px"
+ //only watch gallery if there is a generation process going on
+ check_gallery(id_gallery);
+
var progressDiv = gradioApp().querySelectorAll('#' + id_progressbar_span).length > 0;
if(!progressDiv){
if (skip) {
skip.style.display = "none"
}
interrupt.style.display = "none"
+
+ //disconnect observer once generation finished, so user can close selected image if they want
+ if (galleryObservers[id_gallery]) {
+ galleryObservers[id_gallery].disconnect();
+ galleries[id_gallery] = null;
+ }
}
+
+
}
window.setTimeout(function() { requestMoreProgress(id_part, id_progressbar_span, id_skip, id_interrupt) }, 500)
@@ -46,6 +59,28 @@ function check_progressbar(id_part, id_progressbar, id_progressbar_span, id_skip
}
}
+function check_gallery(id_gallery){
+ let gallery = gradioApp().getElementById(id_gallery)
+ // if gallery has no change, no need to setting up observer again.
+ if (gallery && galleries[id_gallery] !== gallery){
+ galleries[id_gallery] = gallery;
+ if(galleryObservers[id_gallery]){
+ galleryObservers[id_gallery].disconnect();
+ }
+ let prevSelectedIndex = selected_gallery_index();
+ galleryObservers[id_gallery] = new MutationObserver(function (){
+ let galleryButtons = gradioApp().querySelectorAll('#'+id_gallery+' .gallery-item')
+ let galleryBtnSelected = gradioApp().querySelector('#'+id_gallery+' .gallery-item.\\!ring-2')
+ if (prevSelectedIndex !== -1 && galleryButtons.length>prevSelectedIndex && !galleryBtnSelected) {
+ //automatically re-open previously selected index (if exists)
+ galleryButtons[prevSelectedIndex].click();
+ showGalleryImage();
+ }
+ })
+ galleryObservers[id_gallery].observe( gallery, { childList:true, subtree:false })
+ }
+}
+
onUiUpdate(function(){
check_progressbar('txt2img', 'txt2img_progressbar', 'txt2img_progress_span', 'txt2img_skip', 'txt2img_interrupt', 'txt2img_preview', 'txt2img_gallery')
check_progressbar('img2img', 'img2img_progressbar', 'img2img_progress_span', 'img2img_skip', 'img2img_interrupt', 'img2img_preview', 'img2img_gallery')
diff --git a/javascript/ui.js b/javascript/ui.js
index 0f8fe68e..9e1bed4c 100644
--- a/javascript/ui.js
+++ b/javascript/ui.js
@@ -141,7 +141,7 @@ function submit_img2img(){
function ask_for_style_name(_, prompt_text, negative_prompt_text) {
name_ = prompt('Style name:')
- return name_ === null ? [null, null, null]: [name_, prompt_text, negative_prompt_text]
+ return [name_, prompt_text, negative_prompt_text]
}
@@ -187,12 +187,10 @@ onUiUpdate(function(){
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"));
}
})
@@ -220,14 +218,6 @@ function update_token_counter(button_id) {
token_timeout = setTimeout(() => gradioApp().getElementById(button_id)?.click(), wait_time);
}
-function submit_prompt(event, generate_button_id) {
- if (event.altKey && event.keyCode === 13) {
- event.preventDefault();
- gradioApp().getElementById(generate_button_id).click();
- return;
- }
-}
-
function restart_reload(){
document.body.innerHTML='<h1 style="font-family:monospace;margin-top:20%;color:lightgray;text-align:center;">Reloading...</h1>';
setTimeout(function(){location.reload()},2000)
generated by cgit v1.2.1 (git 2.18.0) at 2024-09-21 05:45:35 +0000