Mirrored_Repos/InvokeAI
1
0
Fork 0
mirror of https://github.com/invoke-ai/InvokeAI synced 2024-08-30 20:32:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(ui): do not change images if the dropped image is the same image

Browse Source
This commit is contained in:
psychedelicious
2023-06-04 17:16:50 +10:00
parent 03f3ad435a
commit a664ee30a2
5 changed files with 33 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
invokeai/frontend/web/src/common/components/IAIDndImage.tsx
View File

@ -21,7 +21,7 @@ import { v4 as uuidv4 } from 'uuid';
type IAIDndImageProps = { type IAIDndImageProps = {
image: ImageDTO | null | undefined; image: ImageDTO | null | undefined;
onDrop: (image: ImageDTO) => void; onDrop: (droppedImage: ImageDTO) => void;
onReset?: () => void; onReset?: () => void;
onError?: (event: SyntheticEvent<HTMLImageElement>) => void; onError?: (event: SyntheticEvent<HTMLImageElement>) => void;
onLoad?: (event: SyntheticEvent<HTMLImageElement>) => void; onLoad?: (event: SyntheticEvent<HTMLImageElement>) => void;

17
invokeai/frontend/web/src/features/controlNet/components/ControlNetImagePreview.tsx
View File

@ -36,11 +36,16 @@ const ControlNetImagePreview = (props: Props) => {
const isMouseOverImage = useHoverDirty(containerRef); const isMouseOverImage = useHoverDirty(containerRef);
const handleControlImageChanged = useCallback( const handleDrop = useCallback(
(controlImage: ImageDTO) => { (droppedImage: ImageDTO) => {
dispatch(controlNetImageChanged({ controlNetId, controlImage })); if (controlImage?.image_name === droppedImage.image_name) {
return;
}
dispatch(
controlNetImageChanged({ controlNetId, controlImage: droppedImage })
);
}, },
[controlNetId, dispatch] [controlImage, controlNetId, dispatch]
); );
const shouldShowProcessedImageBackdrop = const shouldShowProcessedImageBackdrop =
@ -58,7 +63,7 @@ const ControlNetImagePreview = (props: Props) => {
<Box ref={containerRef} sx={{ position: 'relative', w: 'full', h: 'full' }}> <Box ref={containerRef} sx={{ position: 'relative', w: 'full', h: 'full' }}>
<IAIDndImage <IAIDndImage
image={controlImage} image={controlImage}
onDrop={handleControlImageChanged} onDrop={handleDrop}
isDropDisabled={Boolean( isDropDisabled={Boolean(
processedControlImage && processorType !== 'none' processedControlImage && processorType !== 'none'
)} )}
@ -108,7 +113,7 @@ const ControlNetImagePreview = (props: Props) => {
> >
<IAIDndImage <IAIDndImage
image={processedControlImage} image={processedControlImage}
onDrop={handleControlImageChanged} onDrop={handleDrop}
payloadImage={controlImage} payloadImage={controlImage}
/> />
</Box> </Box>

5
invokeai/frontend/web/src/features/gallery/components/CurrentImagePreview.tsx
View File

@ -67,9 +67,12 @@ const CurrentImagePreview = () => {
const handleDrop = useCallback( const handleDrop = useCallback(
(droppedImage: ImageDTO) => { (droppedImage: ImageDTO) => {
if (droppedImage.image_name === image?.image_name) {
return;
}
dispatch(imageSelected(droppedImage)); dispatch(imageSelected(droppedImage));
}, },
[dispatch] [dispatch, image?.image_name]
); );
return ( return (

14
invokeai/frontend/web/src/features/nodes/components/fields/ImageInputFieldComponent.tsx
View File

@ -19,17 +19,21 @@ const ImageInputFieldComponent = (
const dispatch = useAppDispatch(); const dispatch = useAppDispatch();
const handleChange = useCallback( const handleDrop = useCallback(
(image: ImageDTO) => { (droppedImage: ImageDTO) => {
if (field.value?.image_name === droppedImage.image_name) {
return;
}
dispatch( dispatch(
fieldValueChanged({ fieldValueChanged({
nodeId, nodeId,
fieldName: field.name, fieldName: field.name,
value: image, value: droppedImage,
}) })
); );
}, },
[dispatch, field.name, nodeId] [dispatch, field.name, field.value?.image_name, nodeId]
); );
const handleReset = useCallback(() => { const handleReset = useCallback(() => {
@ -53,7 +57,7 @@ const ImageInputFieldComponent = (
> >
<IAIDndImage <IAIDndImage
image={field.value} image={field.value}
onDrop={handleChange} onDrop={handleDrop}
onReset={handleReset} onReset={handleReset}
resetIconSize="sm" resetIconSize="sm"
/> />

13
invokeai/frontend/web/src/features/parameters/components/Parameters/ImageToImage/InitialImagePreview.tsx
View File

@ -53,11 +53,14 @@ const InitialImagePreview = () => {
} }
}, [dispatch, t, toaster, shouldFetchImages]); }, [dispatch, t, toaster, shouldFetchImages]);
const handleChange = useCallback( const handleDrop = useCallback(
(image: ImageDTO) => { (droppedImage: ImageDTO) => {
dispatch(initialImageChanged(image)); if (droppedImage.image_name === initialImage?.image_name) {
return;
}
dispatch(initialImageChanged(droppedImage));
}, },
[dispatch] [dispatch, initialImage?.image_name]
); );
const handleReset = useCallback(() => { const handleReset = useCallback(() => {
@ -76,7 +79,7 @@ const InitialImagePreview = () => {
> >
<IAIDndImage <IAIDndImage
image={initialImage} image={initialImage}
onDrop={handleChange} onDrop={handleDrop}
onReset={handleReset} onReset={handleReset}
fallback={<IAIImageFallback sx={{ bg: 'none' }} />} fallback={<IAIImageFallback sx={{ bg: 'none' }} />}
/> />