2024-06-14 22:28:29 +05:30
|
|
|
import {
|
|
|
|
|
ONE_PERCENT_OF_VIEWPORT_H,
|
|
|
|
|
ONE_PERCENT_OF_VIEWPORT_W,
|
|
|
|
|
VIEWPORT_W,
|
|
|
|
|
VIEWPORT_H,
|
|
|
|
|
} from "../constants/const";
|
|
|
|
|
import { Coordinates } from '../components/atoms/canvas';
|
|
|
|
|
|
|
|
|
|
export const throttle = (callback: any, limit: number) => {
|
|
|
|
|
let wait = false;
|
|
|
|
|
return (...args: any[]) => {
|
|
|
|
|
if (!wait) {
|
|
|
|
|
callback(...args);
|
|
|
|
|
wait = true;
|
|
|
|
|
setTimeout(function () {
|
|
|
|
|
wait = false;
|
|
|
|
|
}, limit);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
2024-06-14 22:28:56 +05:30
|
|
|
export const getMappedCoordinates = (
|
|
|
|
|
event: MouseEvent,
|
|
|
|
|
canvas: HTMLCanvasElement | null,
|
|
|
|
|
browserWidth: number,
|
|
|
|
|
browserHeight: number,
|
|
|
|
|
): Coordinates => {
|
|
|
|
|
const clientCoordinates = getCoordinates(event, canvas);
|
|
|
|
|
const mappedX = mapPixelFromSmallerToLarger(
|
|
|
|
|
browserWidth / 100,
|
|
|
|
|
ONE_PERCENT_OF_VIEWPORT_W,
|
|
|
|
|
clientCoordinates.x,
|
|
|
|
|
);
|
|
|
|
|
const mappedY = mapPixelFromSmallerToLarger(
|
|
|
|
|
browserHeight / 100,
|
|
|
|
|
ONE_PERCENT_OF_VIEWPORT_H,
|
|
|
|
|
clientCoordinates.y,
|
|
|
|
|
);
|
|
|
|
|
|
|
|
|
|
return {
|
|
|
|
|
x: mappedX,
|
|
|
|
|
y: mappedY
|
|
|
|
|
};
|
|
|
|
|
};
|
|
|
|
|
|