smig/excalidraw
1
0
Fork 0
mirror of https://github.com/excalidraw/excalidraw.git synced 2025-05-03 10:00:07 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix: adjust the scroll constraints to align with inverted scrollX/Y

Browse source
This commit is contained in:
Arnošt Pleskot 2024-02-08 18:40:42 +01:00
parent d5f55aba44
commit 9bc874a61e
No known key found for this signature in database
1 changed files with 46 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

50
packages/excalidraw/scene/scrollConstraints.ts
View file

@ -25,12 +25,19 @@ export const calculateConstrainedScrollCenter = (
scrollY: AppState["scrollY"];
zoom: AppState["zoom"];
} => {
const { width, height, zoom, scrollConstraints } = state;
const {
width,
height,
zoom,
scrollConstraints: inverseScrollConstraints,
} = state;
if (!scrollConstraints) {
if (!inverseScrollConstraints) {
return { scrollX, scrollY, zoom };
}
const scrollConstraints = alignScrollConstraints(inverseScrollConstraints);
const { zoomLevelX, zoomLevelY, initialZoomLevel } = calculateZoomLevel(
scrollConstraints,
width,
@ -281,6 +288,23 @@ const constrainScrollValues = ({
};
};
/**
* Inverts the scroll constraints to align with the state scrollX and scrollY values, which are inverted.
* This should be removed once the https://github.com/excalidraw/excalidraw/issues/5965 is resolved.
*
* @param originalScrollContraints - The scroll constraints with the original coordinates.
*/
// BUG: remove this function once the #5965 is resolved
const alignScrollConstraints = (
originalScrollContraints: ScrollConstraints,
) => {
return {
...originalScrollContraints,
x: originalScrollContraints.x * -1,
y: originalScrollContraints.y * -1,
};
};
/**
* Determines whether the current viewport is outside the constrained area defined in the AppState.
*
@ -292,7 +316,16 @@ const isViewportOutsideOfConstrainedArea = (state: AppState) => {
return false;
}
const { scrollX, scrollY, width, height, scrollConstraints, zoom } = state;
const {
scrollX,
scrollY,
width,
height,
scrollConstraints: inverseScrollConstraints,
zoom,
} = state;
const scrollConstraints = alignScrollConstraints(inverseScrollConstraints);
// Adjust scroll and dimensions according to the zoom level
const adjustedScrollX = scrollX * zoom.value;
@ -332,7 +365,16 @@ export const constrainScrollState = (
if (!state.scrollConstraints) {
return state;
}
const { scrollX, scrollY, width, height, scrollConstraints, zoom } = state;
const {
scrollX,
scrollY,
width,
height,
scrollConstraints: inverseScrollConstraints,
zoom,
} = state;
const scrollConstraints = alignScrollConstraints(inverseScrollConstraints);
const canUseMemoizedValues =
memoizedValues && // there are memoized values