repair file paste for Firefox from #10615

remove animation when pasting files into prompt
rework two dragdrop js files into one
This commit is contained in:
AUTOMATIC 2023-05-22 09:49:51 +03:00
parent 0cbcc4d828
commit ee65e72931
3 changed files with 46 additions and 33 deletions

View File

@ -48,12 +48,27 @@ function dropReplaceImage(imgWrap, files) {
}
}
function eventHasFiles(e) {
if (!e.dataTransfer || !e.dataTransfer.files) return false;
if (e.dataTransfer.files.length > 0) return true;
if (e.dataTransfer.items.length > 0 && e.dataTransfer.items[0].kind == "file") return true;
return false;
}
function dragDropTargetIsPrompt(target) {
if (!(target?.placeholder?.indexOf("Prompt") >= 0)) return true;
if (target?.parentNode?.parentNode) return true;
return false;
}
window.document.addEventListener('dragover', e => {
const target = e.composedPath()[0];
const imgWrap = target.closest('[data-testid="image"]');
if (e.dataTransfer.files.length == 0 || (!imgWrap && target.placeholder && target.placeholder.indexOf("Prompt") == -1)) {
return;
}
if (!eventHasFiles(e)) return;
var targetImage = target.closest('[data-testid="image"]');
if (!dragDropTargetIsPrompt(target) && !targetImage) return;
e.stopPropagation();
e.preventDefault();
e.dataTransfer.dropEffect = 'copy';
@ -61,17 +76,31 @@ window.document.addEventListener('dragover', e => {
window.document.addEventListener('drop', e => {
const target = e.composedPath()[0];
if (e.dataTransfer.files.length == 0 || target.placeholder.indexOf("Prompt") == -1) {
return;
if (!eventHasFiles(e)) return;
if (dragDropTargetIsPrompt(target)) {
e.stopPropagation();
e.preventDefault();
let prompt_target = get_tab_index('tabs') == 1 ? "img2img_prompt_image" : "txt2img_prompt_image";
const imgParent = gradioApp().getElementById(prompt_target);
const files = e.dataTransfer.files;
const fileInput = imgParent.querySelector('input[type="file"]');
if (fileInput) {
fileInput.files = files;
fileInput.dispatchEvent(new Event('change'));
}
const imgWrap = target.closest('[data-testid="image"]');
if (!imgWrap) {
return;
}
var targetImage = target.closest('[data-testid="image"]');
if (targetImage) {
e.stopPropagation();
e.preventDefault();
const files = e.dataTransfer.files;
dropReplaceImage(imgWrap, files);
dropReplaceImage(targetImage, files);
return;
}
});
window.addEventListener('paste', e => {

View File

@ -1,18 +0,0 @@
window.onload = (function() {
window.addEventListener('drop', e => {
const target = e.composedPath()[0];
if (e.dataTransfer.files.length == 0 || target.placeholder.indexOf("Prompt") == -1) return;
let prompt_target = get_tab_index('tabs') == 1 ? "img2img_prompt_image" : "txt2img_prompt_image";
e.stopPropagation();
e.preventDefault();
const imgParent = gradioApp().getElementById(prompt_target);
const files = e.dataTransfer.files;
const fileInput = imgParent.querySelector('input[type="file"]');
if (fileInput) {
fileInput.files = files;
fileInput.dispatchEvent(new Event('change'));
}
});
});

View File

@ -616,7 +616,8 @@ def create_ui():
outputs=[
txt2img_prompt,
txt_prompt_img
]
],
show_progress=False,
)
enable_hr.change(
@ -902,7 +903,8 @@ def create_ui():
outputs=[
img2img_prompt,
img2img_prompt_img
]
],
show_progress=False,
)
img2img_args = dict(