Replace existing images when pasting from clipboard or dropping a new one (fixes #573)
This commit is contained in:
parent
23a0ec04c0
commit
88e315a8d5
49
script.js
49
script.js
|
@ -326,12 +326,51 @@ function submit(){
|
|||
return res
|
||||
}
|
||||
|
||||
window.addEventListener('paste', e => {
|
||||
const files = e.clipboardData.files;
|
||||
if (!files || files.length !== 1) {
|
||||
function isValidImageList( files ) {
|
||||
return files && files?.length === 1 && ['image/png', 'image/gif', 'image/jpeg'].includes(files[0].type);
|
||||
}
|
||||
|
||||
function dropReplaceImage( imgWrap, files ) {
|
||||
if ( ! isValidImageList( files ) ) {
|
||||
return;
|
||||
}
|
||||
if (!['image/png', 'image/gif', 'image/jpeg'].includes(files[0].type)) {
|
||||
|
||||
imgWrap.querySelector('.modify-upload button + button')?.click();
|
||||
window.requestAnimationFrame( () => {
|
||||
const fileInput = imgWrap.querySelector('input[type="file"]');
|
||||
if ( fileInput ) {
|
||||
fileInput.files = files;
|
||||
fileInput.dispatchEvent(new Event('change'));
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
window.document.addEventListener('dragover', e => {
|
||||
const target = e.composedPath()[0];
|
||||
const imgWrap = target.closest('[data-testid="image"]');
|
||||
if ( !imgWrap ) {
|
||||
return;
|
||||
}
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
e.dataTransfer.dropEffect = 'copy';
|
||||
});
|
||||
|
||||
window.document.addEventListener('drop', e => {
|
||||
const target = e.composedPath()[0];
|
||||
const imgWrap = target.closest('[data-testid="image"]');
|
||||
if ( !imgWrap ) {
|
||||
return;
|
||||
}
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
const files = e.dataTransfer.files;
|
||||
dropReplaceImage( imgWrap, files );
|
||||
});
|
||||
|
||||
window.addEventListener('paste', e => {
|
||||
const files = e.clipboardData.files;
|
||||
if ( ! isValidImageList( files ) ) {
|
||||
return;
|
||||
}
|
||||
[...gradioApp().querySelectorAll('input[type=file][accept="image/x-png,image/gif,image/jpeg"]')]
|
||||
|
@ -340,6 +379,8 @@ window.addEventListener('paste', e => {
|
|||
input.files = files;
|
||||
input.dispatchEvent(new Event('change'))
|
||||
});
|
||||
[...gradioApp().querySelectorAll('[data-testid="image"]')]
|
||||
.forEach(imgWrap => dropReplaceImage( imgWrap, files ));
|
||||
});
|
||||
|
||||
function ask_for_style_name(_, prompt_text, negative_prompt_text) {
|
||||
|
|
Loading…
Reference in New Issue