This commit is contained in:
parent
69df1da095
commit
2db38a20b4
@ -80,7 +80,8 @@ export default function Editor(props: EditorProps) {
|
|||||||
const [sizeLimit, setSizeLimit] = useState<number>(1080)
|
const [sizeLimit, setSizeLimit] = useState<number>(1080)
|
||||||
const windowSize = useWindowSize()
|
const windowSize = useWindowSize()
|
||||||
const viewportRef = useRef<ReactZoomPanPinchRef | undefined | null>()
|
const viewportRef = useRef<ReactZoomPanPinchRef | undefined | null>()
|
||||||
const [centered, setCentered] = useState(false)
|
// Indicates that the image has been loaded and is centered on first load
|
||||||
|
const [initialCentered, setInitialCentered] = useState(false)
|
||||||
|
|
||||||
const [isDraging, setIsDraging] = useState(false)
|
const [isDraging, setIsDraging] = useState(false)
|
||||||
const [isMultiStrokeKeyPressed, setIsMultiStrokeKeyPressed] = useState(false)
|
const [isMultiStrokeKeyPressed, setIsMultiStrokeKeyPressed] = useState(false)
|
||||||
@ -241,8 +242,12 @@ export default function Editor(props: EditorProps) {
|
|||||||
context.canvas.width = original.naturalWidth
|
context.canvas.width = original.naturalWidth
|
||||||
context.canvas.height = original.naturalHeight
|
context.canvas.height = original.naturalHeight
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (!initialCentered) {
|
||||||
viewportRef.current?.centerView(s, 1)
|
viewportRef.current?.centerView(s, 1)
|
||||||
setCentered(true)
|
setInitialCentered(true)
|
||||||
|
}
|
||||||
|
|
||||||
draw()
|
draw()
|
||||||
}, [
|
}, [
|
||||||
context?.canvas,
|
context?.canvas,
|
||||||
@ -251,6 +256,7 @@ export default function Editor(props: EditorProps) {
|
|||||||
original,
|
original,
|
||||||
isOriginalLoaded,
|
isOriginalLoaded,
|
||||||
windowSize,
|
windowSize,
|
||||||
|
initialCentered,
|
||||||
])
|
])
|
||||||
|
|
||||||
// Zoom reset
|
// Zoom reset
|
||||||
@ -564,7 +570,7 @@ export default function Editor(props: EditorProps) {
|
|||||||
<TransformComponent
|
<TransformComponent
|
||||||
contentClass={isInpaintingLoading ? 'editor-canvas-loading' : ''}
|
contentClass={isInpaintingLoading ? 'editor-canvas-loading' : ''}
|
||||||
contentStyle={{
|
contentStyle={{
|
||||||
visibility: centered ? 'visible' : 'hidden',
|
visibility: initialCentered ? 'visible' : 'hidden',
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<div className="editor-canvas-container">
|
<div className="editor-canvas-container">
|
||||||
|
Loading…
Reference in New Issue
Block a user