cek/airboardgame
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Fix itemOnTop break moving

Browse source
This commit is contained in:
Jeremie Pardou-Piquemal 2021-05-27 22:23:02 +02:00 committed by Jérémie Pardou-Piquemal
parent 9e596717a8
commit 2c35a38651
2 changed files with 21 additions and 27 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
src/components/Board/ActionPane.jsx
View file

@ -13,7 +13,7 @@ import { insideClass, hasClass } from "../../utils";
import Gesture from "./Gesture";
const ActionPane = ({ children }) => {
const { putItemsOnTop, moveItems, placeItems } = useItems();
const { moveItems, placeItems } = useItems();
const setSelectedItems = useSetRecoilState(selectedItemsAtom);
const setBoardState = useSetRecoilState(BoardStateAtom);
@ -52,7 +52,6 @@ const ActionPane = ({ children }) => {
Object.assign(actionRef.current, {
moving: true,
onTop: false,
remainX: 0,
remainY: 0,
});
@ -68,12 +67,6 @@ const ActionPane = ({ children }) => {
const moveX = actionRef.current.remainX + deltaX / panZoomRotate.scale;
const moveY = actionRef.current.remainY + deltaY / panZoomRotate.scale;
// Put items on top of others on first move
if (!actionRef.current.onTop) {
putItemsOnTop(selectedItemRef.current.items);
actionRef.current.onTop = true;
}
moveItems(
selectedItemRef.current.items,
{
@ -88,7 +81,7 @@ const ActionPane = ({ children }) => {
);
}
},
[moveItems, putItemsOnTop, setBoardState]
[moveItems, setBoardState]
);
const onDragEnd = useRecoilCallback(

37
src/components/Board/Items/useItems.jsx
View file

@ -86,9 +86,27 @@ const useItems = () => {
[c2c, setItemMap]
);
const putItemsOnTop = React.useCallback(
(itemIdsToMove) => {
setItemList((prevItemList) => {
const filtered = prevItemList.filter(
(id) => !itemIdsToMove.includes(id)
);
const toBePutOnTop = prevItemList.filter((id) =>
itemIdsToMove.includes(id)
);
const result = [...filtered, ...toBePutOnTop];
c2c.publish("updateItemListOrder", result);
return result;
});
},
[setItemList, c2c]
);
const placeItems = React.useCallback(
(itemIds, { type: globalType, size: globalSize } = {}, sync = true) => {
const updatedItems = {};
putItemsOnTop(itemIds);
setItemMap((prevItemMap) => {
const result = { ...prevItemMap };
itemIds.forEach((id) => {
@ -176,7 +194,7 @@ const useItems = () => {
c2c.publish("batchItemsUpdate", updatedItems);
}
},
[c2c, setItemMap]
[c2c, putItemsOnTop, setItemMap]
);
const updateItemOrder = React.useCallback(
@ -189,23 +207,6 @@ const useItems = () => {
[c2c, setItemList]
);
const putItemsOnTop = React.useCallback(
(itemIdsToMove) => {
setItemList((prevItemList) => {
const filtered = prevItemList.filter(
(id) => !itemIdsToMove.includes(id)
);
const toBePutOnTop = prevItemList.filter((id) =>
itemIdsToMove.includes(id)
);
const result = [...filtered, ...toBePutOnTop];
c2c.publish("updateItemListOrder", result);
return result;
});
},
[setItemList, c2c]
);
const reverseItemsOrder = React.useCallback(
(itemIdsToReverse) => {
setItemList((prevItemList) => {