36 lines
No EOL
1.5 KiB
TypeScript
36 lines
No EOL
1.5 KiB
TypeScript
import { ViewportOffset, CONSTANTS } from '../types';
|
|
import { clamp, calculateDistance } from './math';
|
|
|
|
// Zoom-related functions
|
|
export const calculateZoomDelta = (
|
|
wheelDelta: number,
|
|
accelerationFactor: number,
|
|
baseMultiplier = 0.001
|
|
): number => clamp(wheelDelta * baseMultiplier * accelerationFactor, -0.5, 0.5);
|
|
|
|
export const calculateInitialViewport = (initialZoom: number): ViewportOffset => {
|
|
// When fully zoomed out, we want to see the entire content area
|
|
// The target distribution is sized to match the viewport at minimum zoom
|
|
// So at any higher zoom level, we need to position appropriately
|
|
const windowWidth = window.innerWidth;
|
|
const windowHeight = window.innerHeight;
|
|
|
|
// Center the viewport on the target area
|
|
const areaWidth = windowWidth / CONSTANTS.ZOOM_LEVELS.min;
|
|
const areaHeight = windowHeight / CONSTANTS.ZOOM_LEVELS.min;
|
|
|
|
return {
|
|
x: (areaWidth - windowWidth / initialZoom) / 2,
|
|
y: (areaHeight - windowHeight / initialZoom) / 2
|
|
};
|
|
};
|
|
|
|
export const clampZoom = (zoom: number): number =>
|
|
clamp(zoom, CONSTANTS.ZOOM_LEVELS.min, CONSTANTS.ZOOM_LEVELS.max);
|
|
|
|
// Touch-related functions
|
|
export const calculateTouchDistance = (touch1: React.Touch | Touch, touch2: React.Touch | Touch): number =>
|
|
calculateDistance(touch1.clientX, touch1.clientY, touch2.clientX, touch2.clientY);
|
|
|
|
export const calculateZoomFactor = (currentDistance: number, startDistance: number): number =>
|
|
startDistance > 0 ? currentDistance / startDistance : 1;
|