aboutsummaryrefslogtreecommitdiffstats
path: root/javascript
diff options
context:
space:
mode:
Diffstat (limited to 'javascript')
-rw-r--r--javascript/extensions.js24
-rw-r--r--javascript/hints.js5
-rw-r--r--javascript/images_history.js206
-rw-r--r--javascript/imageviewer.js39
-rw-r--r--javascript/localization.js21
-rw-r--r--javascript/ui.js24
6 files changed, 89 insertions, 230 deletions
diff --git a/javascript/extensions.js b/javascript/extensions.js
new file mode 100644
index 00000000..86f5336d
--- /dev/null
+++ b/javascript/extensions.js
@@ -0,0 +1,24 @@
+
+function extensions_apply(_, _){
+ disable = []
+ update = []
+ gradioApp().querySelectorAll('#extensions input[type="checkbox"]').forEach(function(x){
+ if(x.name.startsWith("enable_") && ! x.checked)
+ disable.push(x.name.substr(7))
+
+ if(x.name.startsWith("update_") && x.checked)
+ update.push(x.name.substr(7))
+ })
+
+ restart_reload()
+
+ return [JSON.stringify(disable), JSON.stringify(update)]
+}
+
+function extensions_check(){
+ gradioApp().querySelectorAll('#extensions .extension_status').forEach(function(x){
+ x.innerHTML = "Loading..."
+ })
+
+ return []
+} \ No newline at end of file
diff --git a/javascript/hints.js b/javascript/hints.js
index 54c8c238..04ec67fb 100644
--- a/javascript/hints.js
+++ b/javascript/hints.js
@@ -63,8 +63,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_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.",
+ "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], [datetime<Format>], [datetime<Format><Time Zone>], [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], [datetime<Format>], [datetime<Format><Time Zone>], [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.",
@@ -76,6 +76,7 @@ titles = {
"Create style": "Save current prompts as a style. If you add the token {prompt} to the text, the style use that as placeholder for your prompt when you use the style in the future.",
"Checkpoint name": "Loads weights from checkpoint before making images. You can either use hash or a part of filename (as seen in settings) for checkpoint name. Recommended to use with Y axis for less switching.",
+ "Inpainting conditioning mask strength": "Only applies to inpainting models. Determines how strongly to mask off the original image for inpainting and img2img. 1.0 means fully masked, which is the default behaviour. 0.0 means a fully unmasked conditioning. Lower values will help preserve the overall composition of the image, but will struggle with large changes.",
"vram": "Torch active: Peak amount of VRAM used by Torch during generation, excluding cached data.\nTorch reserved: Peak amount of VRAM allocated by Torch, including all active and cached data.\nSys VRAM: Peak amount of VRAM allocation across all applications / total GPU VRAM (peak utilization%).",
diff --git a/javascript/images_history.js b/javascript/images_history.js
deleted file mode 100644
index f7d052c3..00000000
--- a/javascript/images_history.js
+++ /dev/null
@@ -1,206 +0,0 @@
-var images_history_click_image = function(){
- if (!this.classList.contains("transform")){
- var gallery = images_history_get_parent_by_class(this, "images_history_cantainor");
- var buttons = gallery.querySelectorAll(".gallery-item");
- var i = 0;
- var hidden_list = [];
- buttons.forEach(function(e){
- if (e.style.display == "none"){
- hidden_list.push(i);
- }
- i += 1;
- })
- if (hidden_list.length > 0){
- setTimeout(images_history_hide_buttons, 10, hidden_list, gallery);
- }
- }
- images_history_set_image_info(this);
-}
-
-var images_history_click_tab = function(){
- var tabs_box = gradioApp().getElementById("images_history_tab");
- if (!tabs_box.classList.contains(this.getAttribute("tabname"))) {
- gradioApp().getElementById(this.getAttribute("tabname") + "_images_history_renew_page").click();
- tabs_box.classList.add(this.getAttribute("tabname"))
- }
-}
-
-function images_history_disabled_del(){
- gradioApp().querySelectorAll(".images_history_del_button").forEach(function(btn){
- btn.setAttribute('disabled','disabled');
- });
-}
-
-function images_history_get_parent_by_class(item, class_name){
- var parent = item.parentElement;
- while(!parent.classList.contains(class_name)){
- parent = parent.parentElement;
- }
- return parent;
-}
-
-function images_history_get_parent_by_tagname(item, tagname){
- var parent = item.parentElement;
- tagname = tagname.toUpperCase()
- while(parent.tagName != tagname){
- console.log(parent.tagName, tagname)
- parent = parent.parentElement;
- }
- return parent;
-}
-
-function images_history_hide_buttons(hidden_list, gallery){
- var buttons = gallery.querySelectorAll(".gallery-item");
- var num = 0;
- buttons.forEach(function(e){
- if (e.style.display == "none"){
- num += 1;
- }
- });
- if (num == hidden_list.length){
- setTimeout(images_history_hide_buttons, 10, hidden_list, gallery);
- }
- for( i in hidden_list){
- buttons[hidden_list[i]].style.display = "none";
- }
-}
-
-function images_history_set_image_info(button){
- var buttons = images_history_get_parent_by_tagname(button, "DIV").querySelectorAll(".gallery-item");
- var index = -1;
- var i = 0;
- buttons.forEach(function(e){
- if(e == button){
- index = i;
- }
- if(e.style.display != "none"){
- i += 1;
- }
- });
- var gallery = images_history_get_parent_by_class(button, "images_history_cantainor");
- var set_btn = gallery.querySelector(".images_history_set_index");
- var curr_idx = set_btn.getAttribute("img_index", index);
- if (curr_idx != index) {
- set_btn.setAttribute("img_index", index);
- images_history_disabled_del();
- }
- set_btn.click();
-
-}
-
-function images_history_get_current_img(tabname, image_path, files){
- return [
- gradioApp().getElementById(tabname + '_images_history_set_index').getAttribute("img_index"),
- image_path,
- files
- ];
-}
-
-function images_history_delete(del_num, tabname, img_path, img_file_name, page_index, filenames, image_index){
- image_index = parseInt(image_index);
- var tab = gradioApp().getElementById(tabname + '_images_history');
- var set_btn = tab.querySelector(".images_history_set_index");
- var buttons = [];
- tab.querySelectorAll(".gallery-item").forEach(function(e){
- if (e.style.display != 'none'){
- buttons.push(e);
- }
- });
- var img_num = buttons.length / 2;
- if (img_num <= del_num){
- setTimeout(function(tabname){
- gradioApp().getElementById(tabname + '_images_history_renew_page').click();
- }, 30, tabname);
- } else {
- var next_img
- for (var i = 0; i < del_num; i++){
- if (image_index + i < image_index + img_num){
- buttons[image_index + i].style.display = 'none';
- buttons[image_index + img_num + 1].style.display = 'none';
- next_img = image_index + i + 1
- }
- }
- var bnt;
- if (next_img >= img_num){
- btn = buttons[image_index - del_num];
- } else {
- btn = buttons[next_img];
- }
- setTimeout(function(btn){btn.click()}, 30, btn);
- }
- images_history_disabled_del();
- return [del_num, tabname, img_path, img_file_name, page_index, filenames, image_index];
-}
-
-function images_history_turnpage(img_path, page_index, image_index, tabname){
- var buttons = gradioApp().getElementById(tabname + '_images_history').querySelectorAll(".gallery-item");
- buttons.forEach(function(elem) {
- elem.style.display = 'block';
- })
- return [img_path, page_index, image_index, tabname];
-}
-
-function images_history_enable_del_buttons(){
- gradioApp().querySelectorAll(".images_history_del_button").forEach(function(btn){
- btn.removeAttribute('disabled');
- })
-}
-
-function images_history_init(){
- var load_txt2img_button = gradioApp().getElementById('txt2img_images_history_renew_page')
- if (load_txt2img_button){
- for (var i in images_history_tab_list ){
- tab = images_history_tab_list[i];
- gradioApp().getElementById(tab + '_images_history').classList.add("images_history_cantainor");
- gradioApp().getElementById(tab + '_images_history_set_index').classList.add("images_history_set_index");
- gradioApp().getElementById(tab + '_images_history_del_button').classList.add("images_history_del_button");
- gradioApp().getElementById(tab + '_images_history_gallery').classList.add("images_history_gallery");
-
- }
- var tabs_box = gradioApp().getElementById("tab_images_history").querySelector("div").querySelector("div").querySelector("div");
- tabs_box.setAttribute("id", "images_history_tab");
- var tab_btns = tabs_box.querySelectorAll("button");
- for (var i in images_history_tab_list){
- var tabname = images_history_tab_list[i]
- tab_btns[i].setAttribute("tabname", tabname);
-
- // this refreshes history upon tab switch
- // until the history is known to work well, which is not the case now, we do not do this at startup
- //tab_btns[i].addEventListener('click', images_history_click_tab);
- }
- tabs_box.classList.add(images_history_tab_list[0]);
-
- // same as above, at page load
- //load_txt2img_button.click();
- } else {
- setTimeout(images_history_init, 500);
- }
-}
-
-var images_history_tab_list = ["txt2img", "img2img", "extras"];
-setTimeout(images_history_init, 500);
-document.addEventListener("DOMContentLoaded", function() {
- var mutationObserver = new MutationObserver(function(m){
- for (var i in images_history_tab_list ){
- let tabname = images_history_tab_list[i]
- var buttons = gradioApp().querySelectorAll('#' + tabname + '_images_history .gallery-item');
- buttons.forEach(function(bnt){
- bnt.addEventListener('click', images_history_click_image, true);
- });
-
- // same as load_txt2img_button.click() above
- /*
- var cls_btn = gradioApp().getElementById(tabname + '_images_history_gallery').querySelector("svg");
- if (cls_btn){
- cls_btn.addEventListener('click', function(){
- gradioApp().getElementById(tabname + '_images_history_renew_page').click();
- }, false);
- }*/
-
- }
- });
- mutationObserver.observe( gradioApp(), { childList:true, subtree:true });
-
-});
-
-
diff --git a/javascript/imageviewer.js b/javascript/imageviewer.js
index 9e380c65..67916536 100644
--- a/javascript/imageviewer.js
+++ b/javascript/imageviewer.js
@@ -13,6 +13,15 @@ function showModal(event) {
}
lb.style.display = "block";
lb.focus()
+
+ const tabTxt2Img = gradioApp().getElementById("tab_txt2img")
+ const tabImg2Img = gradioApp().getElementById("tab_img2img")
+ // show the save button in modal only on txt2img or img2img tabs
+ if (tabTxt2Img.style.display != "none" || tabImg2Img.style.display != "none") {
+ gradioApp().getElementById("modal_save").style.display = "inline"
+ } else {
+ gradioApp().getElementById("modal_save").style.display = "none"
+ }
event.stopPropagation()
}
@@ -81,6 +90,25 @@ function modalImageSwitch(offset) {
}
}
+function saveImage(){
+ const tabTxt2Img = gradioApp().getElementById("tab_txt2img")
+ const tabImg2Img = gradioApp().getElementById("tab_img2img")
+ const saveTxt2Img = "save_txt2img"
+ const saveImg2Img = "save_img2img"
+ if (tabTxt2Img.style.display != "none") {
+ gradioApp().getElementById(saveTxt2Img).click()
+ } else if (tabImg2Img.style.display != "none") {
+ gradioApp().getElementById(saveImg2Img).click()
+ } else {
+ console.error("missing implementation for saving modal of this type")
+ }
+}
+
+function modalSaveImage(event) {
+ saveImage()
+ event.stopPropagation()
+}
+
function modalNextImage(event) {
modalImageSwitch(1)
event.stopPropagation()
@@ -93,6 +121,9 @@ function modalPrevImage(event) {
function modalKeyHandler(event) {
switch (event.key) {
+ case "s":
+ saveImage()
+ break;
case "ArrowLeft":
modalPrevImage(event)
break;
@@ -198,6 +229,14 @@ document.addEventListener("DOMContentLoaded", function() {
modalTileImage.title = "Preview tiling";
modalControls.appendChild(modalTileImage)
+ const modalSave = document.createElement("span")
+ modalSave.className = "modalSave cursor"
+ modalSave.id = "modal_save"
+ modalSave.innerHTML = "&#x1F5AB;"
+ modalSave.addEventListener("click", modalSaveImage, true)
+ modalSave.title = "Save Image(s)"
+ modalControls.appendChild(modalSave)
+
const modalClose = document.createElement('span')
modalClose.className = 'modalClose cursor';
modalClose.innerHTML = '&times;'
diff --git a/javascript/localization.js b/javascript/localization.js
index e6644635..f92d2d24 100644
--- a/javascript/localization.js
+++ b/javascript/localization.js
@@ -108,6 +108,9 @@ function processNode(node){
function dumpTranslations(){
dumped = {}
+ if (localization.rtl) {
+ dumped.rtl = true
+ }
Object.keys(original_lines).forEach(function(text){
if(dumped[text] !== undefined) return
@@ -129,6 +132,24 @@ onUiUpdate(function(m){
document.addEventListener("DOMContentLoaded", function() {
processNode(gradioApp())
+
+ if (localization.rtl) { // if the language is from right to left,
+ (new MutationObserver((mutations, observer) => { // wait for the style to load
+ mutations.forEach(mutation => {
+ mutation.addedNodes.forEach(node => {
+ if (node.tagName === 'STYLE') {
+ observer.disconnect();
+
+ for (const x of node.sheet.rules) { // find all rtl media rules
+ if (Array.from(x.media || []).includes('rtl')) {
+ x.media.appendMedium('all'); // enable them
+ }
+ }
+ }
+ })
+ });
+ })).observe(gradioApp(), { childList: true });
+ }
})
function download_localization() {
diff --git a/javascript/ui.js b/javascript/ui.js
index 39011079..be47ec64 100644
--- a/javascript/ui.js
+++ b/javascript/ui.js
@@ -45,14 +45,14 @@ function switch_to_txt2img(){
return args_to_array(arguments);
}
-function switch_to_img2img_img2img(){
+function switch_to_img2img(){
gradioApp().querySelector('#tabs').querySelectorAll('button')[1].click();
gradioApp().getElementById('mode_img2img').querySelectorAll('button')[0].click();
return args_to_array(arguments);
}
-function switch_to_img2img_inpaint(){
+function switch_to_inpaint(){
gradioApp().querySelector('#tabs').querySelectorAll('button')[1].click();
gradioApp().getElementById('mode_img2img').querySelectorAll('button')[1].click();
@@ -65,26 +65,6 @@ function switch_to_extras(){
return args_to_array(arguments);
}
-function extract_image_from_gallery_txt2img(gallery){
- switch_to_txt2img()
- return extract_image_from_gallery(gallery);
-}
-
-function extract_image_from_gallery_img2img(gallery){
- switch_to_img2img_img2img()
- return extract_image_from_gallery(gallery);
-}
-
-function extract_image_from_gallery_inpaint(gallery){
- switch_to_img2img_inpaint()
- return extract_image_from_gallery(gallery);
-}
-
-function extract_image_from_gallery_extras(gallery){
- switch_to_extras()
- return extract_image_from_gallery(gallery);
-}
-
function get_tab_index(tabId){
var res = 0
generated by cgit v1.2.3 (git 2.25.1) at 2025-04-28 22:31:36 +0000