tweak offsets

This commit is contained in:
dwelle 2025-04-20 12:20:14 +02:00
parent db492b4bf5
commit 01f27e66bb

View file

@ -61,26 +61,35 @@ export const getScrollBars = (
const extendedSceneWidth = sceneMaxX - sceneMinX; const extendedSceneWidth = sceneMaxX - sceneMinX;
const extendedSceneHeight = sceneMaxY - sceneMinY; const extendedSceneHeight = sceneMaxY - sceneMinY;
const scrollWidthOffset =
Math.max(SCROLLBAR_MARGIN * 2, safeArea.left + safeArea.right) +
SCROLLBAR_WIDTH * 2;
const scrollbarWidth = const scrollbarWidth =
viewportWidth * (viewportWidthWithZoom / extendedSceneWidth) - viewportWidth * (viewportWidthWithZoom / extendedSceneWidth) -
Math.max(SCROLLBAR_MARGIN * 2, safeArea.left + safeArea.right); scrollWidthOffset;
const scrollbarHeightOffset =
Math.max(SCROLLBAR_MARGIN * 2, safeArea.top + safeArea.bottom) +
SCROLLBAR_WIDTH * 2;
const scrollbarHeight = const scrollbarHeight =
viewportHeight * (viewportHeightWithZoom / extendedSceneHeight) - viewportHeight * (viewportHeightWithZoom / extendedSceneHeight) -
Math.max(SCROLLBAR_MARGIN * 2, safeArea.top + safeArea.bottom); scrollbarHeightOffset;
// NOTE the delta multiplier calculation isn't quite correct when viewport // NOTE the delta multiplier calculation isn't quite correct when viewport
// is extended outside the scene (elements) bbox as there's some small // is extended outside the scene (elements) bbox as there's some small
// accumulation error. I'll let this be an exercise for others to fix. ^^ // accumulation error. I'll let this be an exercise for others to fix. ^^
const horizontalDeltaMultiplier = const horizontalDeltaMultiplier =
extendedSceneWidth > sceneWidth extendedSceneWidth > sceneWidth
? (extendedSceneWidth * appState.zoom.value) / scrollbarWidth ? (extendedSceneWidth * appState.zoom.value) /
: viewportWidth / scrollbarWidth; (scrollbarWidth + scrollWidthOffset)
: viewportWidth / (scrollbarWidth + scrollWidthOffset);
const verticalDeltaMultiplier = const verticalDeltaMultiplier =
extendedSceneHeight > sceneHeight extendedSceneHeight > sceneHeight
? (extendedSceneHeight * appState.zoom.value) / scrollbarHeight ? (extendedSceneHeight * appState.zoom.value) /
: viewportHeight / scrollbarHeight; (scrollbarHeight + scrollbarHeightOffset)
: viewportHeight / (scrollbarHeight + scrollbarHeightOffset);
return { return {
horizontal: horizontal:
viewportMinX === sceneMinX && viewportMaxX === sceneMaxX viewportMinX === sceneMinX && viewportMaxX === sceneMaxX
@ -88,6 +97,7 @@ export const getScrollBars = (
: { : {
x: x:
Math.max(safeArea.left, SCROLLBAR_MARGIN) + Math.max(safeArea.left, SCROLLBAR_MARGIN) +
SCROLLBAR_WIDTH +
((viewportMinX - sceneMinX) / extendedSceneWidth) * viewportWidth, ((viewportMinX - sceneMinX) / extendedSceneWidth) * viewportWidth,
y: y:
viewportHeight - viewportHeight -
@ -109,6 +119,7 @@ export const getScrollBars = (
Math.max(safeArea.right, SCROLLBAR_MARGIN), Math.max(safeArea.right, SCROLLBAR_MARGIN),
y: y:
Math.max(safeArea.top, SCROLLBAR_MARGIN) + Math.max(safeArea.top, SCROLLBAR_MARGIN) +
SCROLLBAR_WIDTH +
((viewportMinY - sceneMinY) / extendedSceneHeight) * ((viewportMinY - sceneMinY) / extendedSceneHeight) *
viewportHeight, viewportHeight,
width: SCROLLBAR_WIDTH, width: SCROLLBAR_WIDTH,