Send to ControlNet, #67

README.md

@@ -17,6 +17,7 @@ and restart your stable-diffusion-webui, then you can see the new tab "Image Bro
 Please be aware that when scanning a directory for the first time, the png-cache will be built. This can take several minutes, depending on the amount of images.
 
 ## Recent updates
+- Send to ControlNet
 - Hidable UI components
 - Send to openOutpaint
 - Regex search

javascript/image_browser.js

@@ -93,7 +93,17 @@ function image_browser_turnpage(tab_base_tag) {
     });
 }
 
-async function image_browser_openoutpaint_get_image(tab_base_tag, image_index) {
+function image_browser_gototab(tabname, tabsId = "tabs") {
+	Array.from(
+		gradioApp().querySelectorAll(`#${tabsId} > div:first-child button`)
+	).forEach((button) => {
+		if (button.textContent.trim() === tabname) {
+			button.click();
+		}
+	});
+}
+
+async function image_browser_get_image_for_ext(tab_base_tag, image_index) {
     var image_browser_image = gradioApp().querySelectorAll(`#${tab_base_tag}_image_browser_gallery .gallery-item`)[image_index];
 
 	const canvas = document.createElement("canvas");
@@ -111,7 +121,7 @@ async function image_browser_openoutpaint_get_image(tab_base_tag, image_index) {
 }
 
 function image_browser_openoutpaint_send(tab_base_tag, image_index, image_browser_prompt, image_browser_neg_prompt, name = "WebUI Resource") {
-    image_browser_openoutpaint_get_image(tab_base_tag, image_index)
+    image_browser_get_image_for_ext(tab_base_tag, image_index)
 		.then((dataURL) => {
 			// Send to openOutpaint
 			openoutpaint_send_image(dataURL, name);
@@ -129,10 +139,47 @@ function image_browser_openoutpaint_send(tab_base_tag, image_index, image_browse
             });
 
 			// Change Tab
-			openoutpaint_gototab();
+            image_browser_gototab("openOutpaint");
 		})
 }
 
+async function image_browser_controlnet_send(toTab,tab_base_tag, image_index, controlnetNum) {
+    const dataURL = await image_browser_get_image_for_ext(tab_base_tag, image_index);
+    const blob = await (await fetch(dataURL)).blob();
+    const dt = new DataTransfer();
+    dt.items.add(new File([blob], "ImageBrowser.png", { type: blob.type }));
+    const container = gradioApp().querySelector(
+        toTab === "txt2img" ? "#txt2img_script_container" : "#img2img_script_container"
+    );
+    const accordion = container.querySelector("#controlnet .transition");
+    if (accordion.classList.contains("rotate-90")) accordion.click();
+
+    const tab = container.querySelectorAll(
+        "#controlnet > div:nth-child(2) > .tabs > .tabitem, #controlnet > div:nth-child(2) > div:not(.tabs)"
+    )[controlnetNum];
+    if (tab.classList.contains("tabitem"))
+        tab.parentElement.firstElementChild.querySelector(`:nth-child(${Number(controlnetNum) + 1})`).click();
+
+    const input = tab.querySelector("input[type='file']");
+    try {
+        input.previousElementSibling.previousElementSibling.querySelector("button[aria-label='Clear']").click();
+    } catch (e) {}
+
+    input.value = "";
+    input.files = dt.files;
+    input.dispatchEvent(new Event("change", { bubbles: true, composed: true }));
+
+    image_browser_gototab(toTab);
+};
+
+function image_browser_controlnet_send_txt2img(tab_base_tag, image_index, controlnetNum) {
+    image_browser_controlnet_send("txt2img", tab_base_tag, image_index, controlnetNum);
+}
+  
+function image_browser_controlnet_send_img2img(tab_base_tag, image_index, controlnetNum) {
+    image_browser_controlnet_send("img2img", tab_base_tag, image_index, controlnetNum);
+}
+
 function image_browser_init() {
     const tab_base_tags = gradioApp().getElementById("image_browser_tab_base_tags_list");
     if (tab_base_tags) {

scripts/image_browser.py

@@ -63,6 +63,7 @@ copy_move = ["Move", "Copy"]
 copied_moved = ["Moved", "Copied"]
 np = "negative_prompt: "
 openoutpaint = False
+controlnet = False
 
 path_maps = {
     "txt2img": opts.outdir_samples or opts.outdir_txt2img_samples,
@@ -825,7 +826,7 @@ def update_ranking(img_file_name, ranking, img_file_info):
     return img_file_info
             
 def create_tab(tab: ImageBrowserTab, current_gr_tab: gr.Tab):
-    global init, exif_cache, aes_cache, openoutpaint
+    global init, exif_cache, aes_cache, openoutpaint, controlnet
     dir_name = None
     others_dir = False
     maint = False
@@ -843,6 +844,7 @@ def create_tab(tab: ImageBrowserTab, current_gr_tab: gr.Tab):
     
     path_recorder, path_recorder_formatted, path_recorder_unformatted = read_path_recorder()
     openoutpaint = check_ext("openoutpaint")
+    controlnet = check_ext("controlnet")
 
     if tab.name == "Others":
         others_dir = True
@@ -947,6 +949,12 @@ def create_tab(tab: ImageBrowserTab, current_gr_tab: gr.Tab):
                         except:
                             pass
                         sendto_openoutpaint = gr.Button("Send to openOutpaint", elem_id=f"{tab.base_tag}_image_browser_openoutpaint_btn", visible=openoutpaint)
+                        gr.HTML("&nbsp")
+                        gr.HTML("&nbsp")
+                        sendto_controlnet_txt2img = gr.Button("Send to txt2img ControlNet", visible=controlnet)
+                        sendto_controlnet_img2img = gr.Button("Send to img2img ControlNet", visible=controlnet)
+                        controlnet_max = opts.data.get("control_net_max_models_num", 1)
+                        sendto_controlnet_num = gr.Dropdown(list(range(controlnet_max)), label="ControlNet number", value="0", interactive=True, visible=(controlnet and controlnet_max > 1))
                     with gr.Row(elem_id=f"{tab.base_tag}_image_browser_to_dir_panel", visible=False) as to_dir_panel:
                         with gr.Box():
                             with gr.Row():
@@ -1186,6 +1194,18 @@ def create_tab(tab: ImageBrowserTab, current_gr_tab: gr.Tab):
             outputs=[],
             _js="image_browser_openoutpaint_send"
         )
+        sendto_controlnet_txt2img.click(
+            fn=None,
+            inputs=[tab_base_tag_box, image_index, sendto_controlnet_num],
+            outputs=[],
+            _js="image_browser_controlnet_send_txt2img"
+        )
+        sendto_controlnet_img2img.click(
+            fn=None,
+            inputs=[tab_base_tag_box, image_index, sendto_controlnet_num],
+            outputs=[],
+            _js="image_browser_controlnet_send_img2img"
+        )
 
 def run_pnginfo(image, image_path, image_file_name):
     if image is None: