mirror of
https://github.com/Sygil-Dev/sygil-webui.git
synced 2024-12-14 14:05:36 +03:00
refactor js_Call hook to take all gradio arguments
This commit is contained in:
parent
648dc020a8
commit
ffb2d7ae9c
@ -24,19 +24,6 @@ def js(opt):
|
||||
return data
|
||||
|
||||
|
||||
|
||||
def js_painterro_launch(to_id):
|
||||
return w(f"Painterro.init('{to_id}')")
|
||||
|
||||
def js_move_image(from_id, to_id):
|
||||
return w(f"moveImageFromGallery('{from_id}', '{to_id}')")
|
||||
|
||||
def js_copy_to_clipboard(from_id):
|
||||
return w(f"copyImageFromGalleryToClipboard('{from_id}')")
|
||||
|
||||
def js_img2img_submit(prompt_row_id):
|
||||
return w(f"clickFirstVisibleButton('{prompt_row_id}')")
|
||||
|
||||
# TODO : @altryne fix this to the new JS format
|
||||
js_copy_txt2img_output = "(x) => {navigator.clipboard.writeText(document.querySelector('gradio-app').shadowRoot.querySelector('#highlight .textfield').textContent.replace(/\s+/g,' ').replace(/: /g,':'))}"
|
||||
|
||||
@ -93,12 +80,13 @@ return [txt2img_prompt, parseInt(txt2img_width), parseInt(txt2img_height), parse
|
||||
"""
|
||||
|
||||
|
||||
# @altryne this came up as conflict, still needed or no?
|
||||
# Wrap the typical SD method call into async closure for ease of use
|
||||
# Supplies the js function with a params object
|
||||
# That includes all the passed arguments and input from Gradio: x
|
||||
# ATTENTION: x is an array of values of all components passed to your
|
||||
# python event handler
|
||||
# Example call in Gradio component's event handler (pass the result to _js arg):
|
||||
# _js=call_JS("myJsMethod", arg1="string", arg2=100, arg3=[])
|
||||
def call_JS(sd_method, **kwargs):
|
||||
param_str = json.dumps(kwargs)
|
||||
return f"async (x) => {{ return await SD.{sd_method}({{ x, ...{param_str} }}) ?? []; }}"
|
||||
return f"async (...x) => {{ return await SD.{sd_method}({{ x, ...{param_str} }}) ?? []; }}"
|
||||
|
@ -372,7 +372,7 @@ def draw_gradio_ui(opt, img2img=lambda x: x, txt2img=lambda x: x, imgproc=lambda
|
||||
rowId="prompt_row"))
|
||||
|
||||
img2img_painterro_btn.click(None,
|
||||
[img2img_image_editor],
|
||||
[img2img_image_editor, img2img_image_mask, img2img_image_editor_mode],
|
||||
[img2img_image_editor, img2img_image_mask],
|
||||
_js=call_JS("Painterro.init", toId="img2img_editor")
|
||||
)
|
||||
|
@ -6,8 +6,9 @@ window.SD = (() => {
|
||||
class PainterroClass {
|
||||
static isOpen = false;
|
||||
static async init ({ x, toId }) {
|
||||
const img = x;
|
||||
const originalImage = Array.isArray(img) ? img[0] : img;
|
||||
console.log(x)
|
||||
|
||||
const originalImage = x[2] === 'Mask' ? x[1]?.image : x[0];
|
||||
|
||||
if (window.Painterro === undefined) {
|
||||
try {
|
||||
@ -52,8 +53,8 @@ window.SD = (() => {
|
||||
|
||||
return result ? this.success(result) : this.fallback(originalImage);
|
||||
}
|
||||
static success (result) { return [result, result]; }
|
||||
static fallback (image) { return [image, image]; }
|
||||
static success (result) { return [result, { image: result, mask: result }] };
|
||||
static fallback (image) { return [image, { image: image, mask: image }] };
|
||||
static load () {
|
||||
return new Promise((resolve, reject) => {
|
||||
const scriptId = '__painterro-script';
|
||||
@ -112,6 +113,7 @@ window.SD = (() => {
|
||||
el = new ElementCache();
|
||||
Painterro = PainterroClass;
|
||||
moveImageFromGallery ({ x, fromId, toId }) {
|
||||
x = x[0];
|
||||
if (!Array.isArray(x) || x.length === 0) return;
|
||||
|
||||
this.clearImageInput(this.el.get(`#${toId}`));
|
||||
@ -121,6 +123,7 @@ window.SD = (() => {
|
||||
return [x[i].replace('data:;','data:image/png;')];
|
||||
}
|
||||
async copyImageFromGalleryToClipboard ({ x, fromId }) {
|
||||
x = x[0];
|
||||
if (!Array.isArray(x) || x.length === 0) return;
|
||||
|
||||
const i = this.#getGallerySelectedIndex(this.el.get(`#${fromId}`));
|
||||
@ -147,7 +150,7 @@ window.SD = (() => {
|
||||
}
|
||||
}
|
||||
}
|
||||
async gradioInputToClipboard ({ x }) { return this.copyToClipboard(x); }
|
||||
async gradioInputToClipboard ({ x }) { return this.copyToClipboard(x[0]); }
|
||||
async copyToClipboard (value) {
|
||||
if (!value || typeof value === 'boolean') return;
|
||||
try {
|
||||
|
Loading…
Reference in New Issue
Block a user