diff --git a/extensions-builtin/sd_forge_controlnet/lib_controlnet/controlnet_ui/controlnet_ui_group.py b/extensions-builtin/sd_forge_controlnet/lib_controlnet/controlnet_ui/controlnet_ui_group.py index fa3b27e9..aec8111f 100644 --- a/extensions-builtin/sd_forge_controlnet/lib_controlnet/controlnet_ui/controlnet_ui_group.py +++ b/extensions-builtin/sd_forge_controlnet/lib_controlnet/controlnet_ui/controlnet_ui_group.py @@ -228,7 +228,7 @@ class ControlNetUiGroup: with gr.Row(elem_classes=["cnet-image-row"], equal_height=True): with gr.Group(elem_classes=["cnet-input-image-group"]): - self.image = ForgeCanvas(elem_id=f"{elem_id_tabname}_{tabname}_input_image", elem_classes=["cnet-image"], height=384, contrast_scribbles=True, numpy=True) + self.image = ForgeCanvas(elem_id=f"{elem_id_tabname}_{tabname}_input_image", elem_classes=["cnet-image"], height=384, contrast_scribbles=shared.opts.img2img_inpaint_mask_high_contrast, scribble_color=shared.opts.img2img_inpaint_mask_brush_color, scribble_color_fixed=True, scribble_alpha=shared.opts.img2img_inpaint_mask_scribble_alpha, scribble_alpha_fixed=True, scribble_softness_fixed=True, numpy=True) self.openpose_editor.render_upload() with gr.Group(visible=False, elem_classes=["cnet-generated-image-group"]) as self.generated_image_group: @@ -237,10 +237,24 @@ class ControlNetUiGroup: with gr.Group(elem_classes=["cnet-generated-image-control-group"]): self.openpose_editor.render_edit() preview_check_elem_id = f"{elem_id_tabname}_{tabname}_controlnet_preprocessor_preview_checkbox" + preview_download_button_js = f""" + const image = document.querySelector('#{elem_id_tabname}_{tabname}_generated_image img.forge-image'); + const src = image.getAttribute('src'); + if (!src || !image.complete || image.naturalWidth === 0) return; + + const a = document.createElement('a'); + a.href = src; a.download = 'preview.jpg'; + + document.body.appendChild(a); + a.click(); a.remove(); + """ preview_close_button_js = f"document.querySelector('#{preview_check_elem_id} input[type=\\'checkbox\\']').click();" gr.HTML( - value=f"""Close""", - visible=True, + value=f'Download', + elem_classes=["cnet-download-preview"], + ) + gr.HTML( + value=f'Close', elem_classes=["cnet-close-preview"], ) diff --git a/extensions-builtin/sd_forge_controlnet/lib_controlnet/controlnet_ui/openpose_editor.py b/extensions-builtin/sd_forge_controlnet/lib_controlnet/controlnet_ui/openpose_editor.py index 20977e46..74ab2da1 100644 --- a/extensions-builtin/sd_forge_controlnet/lib_controlnet/controlnet_ui/openpose_editor.py +++ b/extensions-builtin/sd_forge_controlnet/lib_controlnet/controlnet_ui/openpose_editor.py @@ -24,8 +24,6 @@ def encode_data_url(json_string: str) -> str: class OpenposeEditor: - # Filename used when user click the download link - download_file = "pose.json" def __init__(self) -> None: self.render_button = None @@ -42,15 +40,21 @@ class OpenposeEditor: self.pose_input = gr.Textbox(visible=False, elem_classes=["cnet-pose-json"]) # The button to download the pose json. self.download_link = gr.HTML( - value=f'JSON', + value=f'JSON', visible=False, elem_classes=["cnet-download-pose"], ) def render_upload(self): """Renders the button in input image control button group.""" + + upload_button_js = 'this.querySelector("input").click()' self.upload_link = gr.HTML( - value='', + value=f""" + + Upload JSON + + """, visible=False, elem_classes=["cnet-upload-pose"], ) @@ -98,9 +102,9 @@ class OpenposeEditor: ) def update_upload_link(model: str) -> dict: - return gr.update(visible=("openpose" in model.lower())) + return gr.update(visible=(any(key in model.lower() for key in ("openpose", "union", "promax", "unicontrol")))) - model.change(fn=update_upload_link, inputs=[model], outputs=[self.upload_link]) + model.change(fn=update_upload_link, inputs=[model], outputs=[self.upload_link], queue=False) def outputs(self) -> list[gr.components.Component]: return [self.download_link] @@ -117,10 +121,5 @@ class OpenposeEditor: An gr.update event. """ - hint = "Download the pose as .json file" - html = f'JSON' - visible: bool = json_string != "" - return [ - # Download link update - gr.update(value=html, visible=visible), - ] + html = f'JSON' + return [gr.update(value=html, visible=(json_string != ""))] diff --git a/extensions-builtin/sd_forge_controlnet/style.css b/extensions-builtin/sd_forge_controlnet/style.css index c826c221..3922d144 100644 --- a/extensions-builtin/sd_forge_controlnet/style.css +++ b/extensions-builtin/sd_forge_controlnet/style.css @@ -25,9 +25,9 @@ bottom: var(--size-4); } -.cnet-download-pose a, +.cnet-download-pose, .cnet-close-preview, -.cnet-edit-pose, +.cnet-download-preview, .cnet-upload-pose { font-size: x-small !important; font-weight: bold !important; @@ -47,9 +47,9 @@ margin-bottom: 16px; } -.cnet-download-pose:hover a, -.cnet-close-preview:hover a, -.cnet-edit-pose:hover, +.cnet-download-pose:hover, +.cnet-close-preview:hover, +.cnet-download-preview:hover, .cnet-upload-pose:hover { color: var(--block-label-text-color) !important; }