vodorod/parcer
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

chore: lint

Browse Source
This commit is contained in:
karishmas6
2024-06-15 21:09:22 +05:30
parent 3a72389f36
commit a6e3beb589
1 changed files with 13 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
src/components/atoms/canvas.tsx
View File

@@ -1,22 +1,16 @@
import React, {useCallback, useEffect, useRef} from 'react'; import React, { useCallback, useEffect, useRef } from 'react';
import { useSocketStore } from '../../context/socket'; import { useSocketStore } from '../../context/socket';
import { getMappedCoordinates } from "../../helpers/inputHelpers"; import { getMappedCoordinates } from "../../helpers/inputHelpers";
import { useGlobalInfoStore } from "../../context/globalInfo"; import { useGlobalInfoStore } from "../../context/globalInfo";
interface CreateRefCallback { interface CreateRefCallback {
(ref: React.RefObject<HTMLCanvasElement>): void; (ref: React.RefObject<HTMLCanvasElement>): void;
} }
interface CanvasProps { interface CanvasProps {
width: number; width: number;
height: number; height: number;
onCreateRef: CreateRefCallback; onCreateRef: CreateRefCallback;
} }
/** /**
@@ -40,7 +34,7 @@ const Canvas = ({ width, height, onCreateRef }: CanvasProps) => {
}; };
const lastMousePosition = useRef<Coordinates>({ x: 0, y: 0 }); const lastMousePosition = useRef<Coordinates>({ x: 0, y: 0 });
//const lastWheelPosition = useRef<ScrollDeltas>({ deltaX: 0, deltaY: 0 }); //const lastWheelPosition = useRef<ScrollDeltas>({ deltaX: 0, deltaY: 0 });
const onMouseEvent = useCallback((event: MouseEvent) => { const onMouseEvent = useCallback((event: MouseEvent) => {
if (socket) { if (socket) {
@@ -57,12 +51,12 @@ const Canvas = ({ width, height, onCreateRef }: CanvasProps) => {
case 'mousemove': case 'mousemove':
const coordinates = getMappedCoordinates(event, canvasRef.current, width, height); const coordinates = getMappedCoordinates(event, canvasRef.current, width, height);
if (lastMousePosition.current.x !== coordinates.x || if (lastMousePosition.current.x !== coordinates.x ||
lastMousePosition.current.y !== coordinates.y) { lastMousePosition.current.y !== coordinates.y) {
lastMousePosition.current = { lastMousePosition.current = {
x: coordinates.x, x: coordinates.x,
y: coordinates.y, y: coordinates.y,
}; };
socket.emit('input:mousemove', { socket.emit('input:mousemove', {
x: coordinates.x, x: coordinates.x,
y: coordinates.y, y: coordinates.y,
}); });
@@ -122,21 +116,21 @@ const Canvas = ({ width, height, onCreateRef }: CanvasProps) => {
} }
}; };
}else { } else {
console.log('Canvas not initialized'); console.log('Canvas not initialized');
} }
}, [onMouseEvent]); }, [onMouseEvent]);
return ( return (
// <canvas tabIndex={0} ref={canvasRef} height={height} width={width} /> // <canvas tabIndex={0} ref={canvasRef} height={height} width={width} />
<canvas <canvas
tabIndex={0} tabIndex={0}
ref={canvasRef} ref={canvasRef}
height={720} height={720}
width={1280} width={1280}
style={{ width: '1280px', height: '720px' }} // Ensure dimensions are explicitly set style={{ width: '1280px', height: '720px' }} // Ensure dimensions are explicitly set
/> />
); );
}; };