fix: bug with dragging items

This commit is contained in:
Mark Mankarious
2023-08-20 12:25:59 +01:00
parent 302d4b8695
commit 1d0351cc2d
2 changed files with 36 additions and 20 deletions

View File

@@ -1,10 +1,10 @@
import { produce } from 'immer';
import { ModeActions } from 'src/types';
import { getItemAtTile, hasMovedTile } from 'src/utils';
import { getItemAtTile } from 'src/utils';
export const Cursor: ModeActions = {
mousemove: ({ uiState }) => {
if (uiState.mode.type !== 'CURSOR' || !hasMovedTile(uiState.mouse)) return;
if (uiState.mode.type !== 'CURSOR') return;
if (uiState.mode.mousedownItem) {
uiState.actions.setMode({

View File

@@ -1,12 +1,40 @@
import { ModeActions } from 'src/types';
import { ModeActions, Coords, SceneItemReference, SceneStore } from 'src/types';
import { getItemById, CoordsUtils, hasMovedTile } from 'src/utils';
export const DragItems: ModeActions = {
entry: ({ uiState, rendererRef }) => {
const renderer = rendererRef;
if (uiState.mode.type !== 'DRAG_ITEMS') return;
const dragItems = (
items: SceneItemReference[],
delta: Coords,
scene: SceneStore
) => {
items.forEach((item) => {
if (item.type === 'NODE') {
const node = getItemById(scene.nodes, item.id).item;
scene.actions.updateNode(item.id, {
position: CoordsUtils.add(node.position, delta)
});
} else if (item.type === 'RECTANGLE') {
const rectangle = getItemById(scene.rectangles, item.id).item;
const newFrom = CoordsUtils.add(rectangle.from, delta);
const newTo = CoordsUtils.add(rectangle.to, delta);
scene.actions.updateRectangle(item.id, { from: newFrom, to: newTo });
}
});
};
export const DragItems: ModeActions = {
entry: ({ uiState, scene, rendererRef }) => {
if (uiState.mode.type !== 'DRAG_ITEMS' || !uiState.mouse.mousedown) return;
const renderer = rendererRef;
renderer.style.userSelect = 'none';
const delta = CoordsUtils.subtract(
uiState.mouse.position.tile,
uiState.mouse.mousedown.tile
);
dragItems(uiState.mode.items, delta, scene);
},
exit: ({ rendererRef }) => {
const renderer = rendererRef;
@@ -23,19 +51,7 @@ export const DragItems: ModeActions = {
const delta = uiState.mouse.delta.tile;
uiState.mode.items.forEach((item) => {
if (item.type === 'NODE') {
scene.actions.updateNode(item.id, {
position: uiState.mouse.position.tile
});
} else if (item.type === 'RECTANGLE') {
const { item: rectangle } = getItemById(scene.rectangles, item.id);
const newFrom = CoordsUtils.add(rectangle.from, delta);
const newTo = CoordsUtils.add(rectangle.to, delta);
scene.actions.updateRectangle(item.id, { from: newFrom, to: newTo });
}
});
dragItems(uiState.mode.items, delta, scene);
uiState.actions.setContextMenu(null);
},