mirror of
https://github.com/invoke-ai/InvokeAI
synced 2024-08-30 20:32:17 +00:00
Misc fixes
This commit is contained in:
parent
4204740cb2
commit
2c250a515e
@ -23,14 +23,13 @@ import {
|
||||
MdHd,
|
||||
MdImage,
|
||||
MdInfo,
|
||||
MdSettings,
|
||||
} from 'react-icons/md';
|
||||
import InvokePopover from './InvokePopover';
|
||||
import UpscaleOptions from '../options/AdvancedOptions/Upscale/UpscaleOptions';
|
||||
import FaceRestoreOptions from '../options/AdvancedOptions/FaceRestore/FaceRestoreOptions';
|
||||
import { useHotkeys } from 'react-hotkeys-hook';
|
||||
import { useToast } from '@chakra-ui/react';
|
||||
import { FaPaintBrush, FaSeedling } from 'react-icons/fa';
|
||||
import { FaCopy, FaPaintBrush, FaSeedling } from 'react-icons/fa';
|
||||
import { setImageToInpaint } from '../tabs/Inpainting/inpaintingSlice';
|
||||
import { hoverableImageSelector } from './gallerySliceSelectors';
|
||||
|
||||
@ -279,7 +278,7 @@ const CurrentImageButtons = ({ image }: CurrentImageButtonsProps) => {
|
||||
/>
|
||||
|
||||
<IAIIconButton
|
||||
icon={<MdSettings />}
|
||||
icon={<FaCopy />}
|
||||
tooltip="Use All"
|
||||
aria-label="Use All"
|
||||
isDisabled={
|
||||
|
@ -30,6 +30,7 @@ import IAIPopover from '../../common/components/IAIPopover';
|
||||
import IAISlider from '../../common/components/IAISlider';
|
||||
import { BiReset } from 'react-icons/bi';
|
||||
import IAICheckbox from '../../common/components/IAICheckbox';
|
||||
import { setNeedsCache } from '../tabs/Inpainting/inpaintingSlice';
|
||||
|
||||
export default function ImageGallery() {
|
||||
const dispatch = useAppDispatch();
|
||||
@ -111,6 +112,7 @@ export default function ImageGallery() {
|
||||
const timeoutIdRef = useRef<number | null>(null);
|
||||
|
||||
const handleSetShouldPinGallery = () => {
|
||||
dispatch(setNeedsCache(true))
|
||||
dispatch(setShouldPinGallery(!shouldPinGallery));
|
||||
setGallerySize({
|
||||
...gallerySize,
|
||||
@ -119,14 +121,17 @@ export default function ImageGallery() {
|
||||
};
|
||||
|
||||
const handleToggleGallery = () => {
|
||||
dispatch(setNeedsCache(true))
|
||||
shouldShowGallery ? handleCloseGallery() : handleOpenGallery();
|
||||
};
|
||||
|
||||
const handleOpenGallery = () => {
|
||||
dispatch(setNeedsCache(true))
|
||||
dispatch(setShouldShowGallery(true));
|
||||
};
|
||||
|
||||
const handleCloseGallery = () => {
|
||||
dispatch(setNeedsCache(true))
|
||||
dispatch(
|
||||
setGalleryScrollPosition(
|
||||
galleryContainerRef.current ? galleryContainerRef.current.scrollTop : 0
|
||||
|
@ -5,7 +5,7 @@ import { setStageScale } from './inpaintingSlice';
|
||||
|
||||
const InpaintingCanvasPlaceholder = () => {
|
||||
const dispatch = useAppDispatch();
|
||||
const { needsRepaint, imageToInpaint } = useAppSelector(
|
||||
const { needsCache, imageToInpaint } = useAppSelector(
|
||||
(state: RootState) => state.inpainting
|
||||
);
|
||||
const ref = useRef<HTMLDivElement>(null);
|
||||
@ -22,7 +22,7 @@ const InpaintingCanvasPlaceholder = () => {
|
||||
);
|
||||
|
||||
dispatch(setStageScale(scale));
|
||||
}, [dispatch, imageToInpaint, needsRepaint]);
|
||||
}, [dispatch, imageToInpaint, needsCache]);
|
||||
|
||||
return (
|
||||
<div ref={ref} className="inpainting-canvas-area">
|
||||
|
@ -24,10 +24,9 @@ import {
|
||||
undo,
|
||||
setShouldShowMask,
|
||||
setShouldInvertMask,
|
||||
setNeedsRepaint,
|
||||
setNeedsCache,
|
||||
toggleShouldLockBoundingBox,
|
||||
clearImageToInpaint,
|
||||
setShouldShowBoundingBox,
|
||||
} from './inpaintingSlice';
|
||||
|
||||
import { MdInvertColors, MdInvertColorsOff } from 'react-icons/md';
|
||||
@ -284,7 +283,7 @@ const InpaintingControls = () => {
|
||||
|
||||
const handleDualDisplay = () => {
|
||||
dispatch(setShowDualDisplay(!showDualDisplay));
|
||||
dispatch(setNeedsRepaint(true));
|
||||
dispatch(setNeedsCache(true));
|
||||
};
|
||||
|
||||
const handleClearImage = () => {
|
||||
|
@ -9,15 +9,15 @@ import { OptionsState } from '../../options/optionsSlice';
|
||||
import InpaintingCanvas from './InpaintingCanvas';
|
||||
import InpaintingCanvasPlaceholder from './InpaintingCanvasPlaceholder';
|
||||
import InpaintingControls from './InpaintingControls';
|
||||
import { InpaintingState, setNeedsRepaint } from './inpaintingSlice';
|
||||
import { InpaintingState, setNeedsCache } from './inpaintingSlice';
|
||||
|
||||
const inpaintingDisplaySelector = createSelector(
|
||||
[(state: RootState) => state.inpainting, (state: RootState) => state.options],
|
||||
(inpainting: InpaintingState, options: OptionsState) => {
|
||||
const { needsRepaint, imageToInpaint } = inpainting;
|
||||
const { needsCache, imageToInpaint } = inpainting;
|
||||
const { showDualDisplay } = options;
|
||||
return {
|
||||
needsRepaint,
|
||||
needsCache,
|
||||
showDualDisplay,
|
||||
imageToInpaint,
|
||||
};
|
||||
@ -31,13 +31,13 @@ const inpaintingDisplaySelector = createSelector(
|
||||
|
||||
const InpaintingDisplay = () => {
|
||||
const dispatch = useAppDispatch();
|
||||
const { showDualDisplay, needsRepaint, imageToInpaint } = useAppSelector(
|
||||
const { showDualDisplay, needsCache, imageToInpaint } = useAppSelector(
|
||||
inpaintingDisplaySelector
|
||||
);
|
||||
|
||||
useLayoutEffect(() => {
|
||||
const resizeCallback = _.debounce(
|
||||
() => dispatch(setNeedsRepaint(true)),
|
||||
() => dispatch(setNeedsCache(true)),
|
||||
250
|
||||
);
|
||||
window.addEventListener('resize', resizeCallback);
|
||||
@ -48,7 +48,7 @@ const InpaintingDisplay = () => {
|
||||
<div className="inpainting-main-area">
|
||||
<InpaintingControls />
|
||||
<div className="inpainting-canvas-area">
|
||||
{needsRepaint ? <InpaintingCanvasPlaceholder /> : <InpaintingCanvas />}
|
||||
{needsCache ? <InpaintingCanvasPlaceholder /> : <InpaintingCanvas />}
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
|
@ -48,7 +48,7 @@ export interface InpaintingState {
|
||||
shouldShowBrush: boolean;
|
||||
shouldShowBrushPreview: boolean;
|
||||
imageToInpaint?: InvokeAI.Image;
|
||||
needsRepaint: boolean;
|
||||
needsCache: boolean;
|
||||
stageScale: number;
|
||||
isDrawing: boolean;
|
||||
shouldUseInpaintReplace: boolean;
|
||||
@ -75,7 +75,7 @@ const initialInpaintingState: InpaintingState = {
|
||||
shouldShowCheckboardTransparency: false,
|
||||
shouldShowBrush: true,
|
||||
shouldShowBrushPreview: false,
|
||||
needsRepaint: false,
|
||||
needsCache: false,
|
||||
isDrawing: false,
|
||||
stageScale: 1,
|
||||
shouldUseInpaintReplace: false,
|
||||
@ -201,7 +201,7 @@ export const inpaintingSlice = createSlice({
|
||||
};
|
||||
|
||||
state.imageToInpaint = action.payload;
|
||||
state.needsRepaint = true;
|
||||
state.needsCache = true;
|
||||
},
|
||||
setCanvasDimensions: (state, action: PayloadAction<Dimensions>) => {
|
||||
state.canvasDimensions = action.payload;
|
||||
@ -291,12 +291,12 @@ export const inpaintingSlice = createSlice({
|
||||
setBoundingBoxPreviewFill: (state, action: PayloadAction<RgbaColor>) => {
|
||||
state.boundingBoxPreviewFill = action.payload;
|
||||
},
|
||||
setNeedsRepaint: (state, action: PayloadAction<boolean>) => {
|
||||
state.needsRepaint = action.payload;
|
||||
setNeedsCache: (state, action: PayloadAction<boolean>) => {
|
||||
state.needsCache = action.payload;
|
||||
},
|
||||
setStageScale: (state, action: PayloadAction<number>) => {
|
||||
state.stageScale = action.payload;
|
||||
state.needsRepaint = false;
|
||||
state.needsCache = false;
|
||||
},
|
||||
setShouldShowBoundingBoxFill: (state, action: PayloadAction<boolean>) => {
|
||||
state.shouldShowBoundingBoxFill = action.payload;
|
||||
@ -346,7 +346,7 @@ export const {
|
||||
setBoundingBoxDimensions,
|
||||
setBoundingBoxCoordinate,
|
||||
setBoundingBoxPreviewFill,
|
||||
setNeedsRepaint,
|
||||
setNeedsCache,
|
||||
setStageScale,
|
||||
toggleTool,
|
||||
setShouldShowBoundingBoxFill,
|
||||
|
Loading…
Reference in New Issue
Block a user