2021-12-29 23:00:44 +00:00
|
|
|
import type Mouse from '../cards/mouse';
|
|
|
|
import { enableMouseMode } from './joystick';
|
|
|
|
|
|
|
|
export class MouseUI {
|
|
|
|
private mouse: Mouse;
|
|
|
|
|
2022-05-12 00:21:21 +00:00
|
|
|
constructor(private canvas: HTMLCanvasElement) {
|
2021-12-29 23:00:44 +00:00
|
|
|
this.canvas.addEventListener(
|
|
|
|
'mousemove',
|
|
|
|
(event: MouseEvent & { target: HTMLCanvasElement} ) => {
|
|
|
|
const { offsetX, offsetY, target } = event;
|
|
|
|
this.mouse.setMouseXY(
|
|
|
|
offsetX,
|
|
|
|
offsetY,
|
|
|
|
target.clientWidth,
|
|
|
|
target.clientHeight
|
|
|
|
);
|
|
|
|
}
|
|
|
|
);
|
|
|
|
|
|
|
|
this.canvas.addEventListener('mousedown', () => {
|
|
|
|
this.mouse.setMouseDown(true);
|
|
|
|
});
|
|
|
|
|
|
|
|
this.canvas.addEventListener('mouseup', () => {
|
|
|
|
this.mouse.setMouseDown(false);
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
setMouse = (mouse: Mouse) => {
|
|
|
|
this.mouse = mouse;
|
|
|
|
};
|
|
|
|
|
|
|
|
mouseMode = (on: boolean) => {
|
|
|
|
enableMouseMode(on);
|
|
|
|
if (on) {
|
|
|
|
this.canvas.classList.add('mouseMode');
|
|
|
|
} else {
|
|
|
|
this.canvas.classList.remove('mouseMode');
|
|
|
|
}
|
|
|
|
};
|
|
|
|
}
|