From 83a9dd82db511f8f7545d953d6c6baf2c2c9a7a3 Mon Sep 17 00:00:00 2001 From: missionfloyd Date: Sat, 16 Mar 2024 16:08:42 -0600 Subject: [PATCH] Download image client-side --- javascript/dragdrop.js | 22 +++++++++------------- modules/images.py | 35 +++++++++++------------------------ modules/ui_toprow.py | 8 -------- 3 files changed, 20 insertions(+), 45 deletions(-) diff --git a/javascript/dragdrop.js b/javascript/dragdrop.js index bb7be89f9..86591aa24 100644 --- a/javascript/dragdrop.js +++ b/javascript/dragdrop.js @@ -56,10 +56,6 @@ function eventHasFiles(e) { return false; } -function getEventUrl(e) { - return e.dataTransfer?.getData('text/uri-list') || e.dataTransfer?.getData('text/plain'); -} - function dragDropTargetIsPrompt(target) { if (target?.placeholder && target?.placeholder.indexOf("Prompt") >= 0) return true; if (target?.parentNode?.parentNode?.className?.indexOf("prompt") > 0) return true; @@ -78,9 +74,9 @@ window.document.addEventListener('dragover', e => { e.dataTransfer.dropEffect = 'copy'; }); -window.document.addEventListener('drop', e => { +window.document.addEventListener('drop', async e => { const target = e.composedPath()[0]; - const url = getEventUrl(e); + const url = e.dataTransfer.getData('text/uri-list') || e.dataTransfer.getData('text/plain'); if (!eventHasFiles(e) && !url) return; if (dragDropTargetIsPrompt(target)) { @@ -89,19 +85,19 @@ window.document.addEventListener('drop', e => { const isImg2img = get_tab_index('tabs') == 1; let prompt_image_target = isImg2img ? "img2img_prompt_image" : "txt2img_prompt_image"; - let prompt_url_target = isImg2img ? "img2img_prompt_url" : "txt2img_prompt_url"; const imgParent = gradioApp().getElementById(prompt_image_target); - const urlParent = gradioApp().getElementById(prompt_url_target); const files = e.dataTransfer.files; const fileInput = imgParent.querySelector('input[type="file"]'); - const urlInput = urlParent.querySelector('textarea'); - if (url && urlInput) { - urlInput.value = url; - urlInput.dispatchEvent(new Event('input')); - } else if (files && fileInput) { + if (eventHasFiles(e) && fileInput) { fileInput.files = files; fileInput.dispatchEvent(new Event('change')); + } else if (url) { + const request = await fetch(url); + const data = new DataTransfer(); + data.items.add(new File([await request.blob()], 'image.png')); + fileInput.files = data.files; + fileInput.dispatchEvent(new Event('change')); } } diff --git a/modules/images.py b/modules/images.py index 665dbc372..c50b2455d 100644 --- a/modules/images.py +++ b/modules/images.py @@ -772,31 +772,18 @@ Steps: {json_info["steps"]}, Sampler: {sampler}, CFG scale: {json_info["scale"]} def image_data(data): import gradio as gr - if not data: - return gr.update(), None - - if isinstance(data, bytes): - try: - image = Image.open(io.BytesIO(data)) - textinfo, _ = read_info_from_image(image) - return textinfo, None - except Exception: - pass - - try: - text = data.decode('utf8') - assert len(text) < 10000 - return text, None - except Exception: - pass - - import requests try: - r = requests.get(data, timeout=5) - if r.status_code == 200: - image = Image.open(io.BytesIO(r.content)) - textinfo, _ = read_info_from_image(image) - return textinfo, None + image = read(io.BytesIO(data)) + textinfo, _ = read_info_from_image(image) + return textinfo, None + except Exception: + pass + + try: + text = data.decode('utf8') + assert len(text) < 10000 + return text, None + except Exception: pass diff --git a/modules/ui_toprow.py b/modules/ui_toprow.py index bce93da95..dc3c3aa38 100644 --- a/modules/ui_toprow.py +++ b/modules/ui_toprow.py @@ -82,7 +82,6 @@ class Toprow: with gr.Row(elem_id=f"{self.id_part}_prompt_row", elem_classes=["prompt-row"]): self.prompt = gr.Textbox(label="Prompt", elem_id=f"{self.id_part}_prompt", show_label=False, lines=3, placeholder="Prompt\n(Press Ctrl+Enter to generate, Alt+Enter to skip, Esc to interrupt)", elem_classes=["prompt"]) self.prompt_img = gr.File(label="", elem_id=f"{self.id_part}_prompt_image", file_count="single", type="binary", visible=False) - self.prompt_url = gr.Textbox(label="", elem_id=f"{self.id_part}_prompt_url", visible=False) with gr.Row(elem_id=f"{self.id_part}_neg_prompt_row", elem_classes=["prompt-row"]): self.negative_prompt = gr.Textbox(label="Negative prompt", elem_id=f"{self.id_part}_neg_prompt", show_label=False, lines=3, placeholder="Negative prompt\n(Press Ctrl+Enter to generate, Alt+Enter to skip, Esc to interrupt)", elem_classes=["prompt"]) @@ -94,13 +93,6 @@ class Toprow: show_progress=False, ) - self.prompt_url.input( - fn=modules.images.image_data, - inputs=[self.prompt_url], - outputs=[self.prompt, self.prompt_url], - show_progress=False, - ) - def create_submit_box(self): with gr.Row(elem_id=f"{self.id_part}_generate_box", elem_classes=["generate-box"] + (["generate-box-compact"] if self.is_compact else []), render=not self.is_compact) as submit_box: self.submit_box = submit_box