Update token duplicate and removing to include attached tokens

This commit is contained in:
Mitchell McCaffrey 2021-08-12 10:23:02 +10:00
parent 6c27a6cbd3
commit 14fbb41e9d
5 changed files with 40 additions and 21 deletions

View File

@ -145,7 +145,11 @@ function Token({
} }
} }
setDragging(true); setDragging(true);
onTokenDragStart(event, tokenState.id); onTokenDragStart(
event,
tokenState.id,
attachedTokensRef.current.map((token) => token.id())
);
} }
function handleDragMove(event: Konva.KonvaEventObject<DragEvent>) { function handleDragMove(event: Konva.KonvaEventObject<DragEvent>) {
@ -211,11 +215,16 @@ function Token({
}); });
setDragging(false); setDragging(false);
onTokenDragEnd(
event,
tokenState.id,
attachedTokensRef.current.map((token) => token.id())
);
attachmentCharactersRef.current = []; attachmentCharactersRef.current = [];
attachedTokensRef.current = []; attachedTokensRef.current = [];
setAttachmentOverCharacter(false); setAttachmentOverCharacter(false);
onTokenDragEnd(event, tokenState.id);
} }
function handleClick() { function handleClick() {

View File

@ -1,23 +1,29 @@
import DragOverlay from "../map/DragOverlay"; import DragOverlay from "../map/DragOverlay";
import { TokenStateRemoveHandler } from "../../types/Events"; import { TokenStateRemoveHandler } from "../../types/Events";
import { TokenState } from "../../types/TokenState"; import { TokenDraggingOptions } from "../../types/Token";
type TokenDragOverlayProps = { type TokenDragOverlayProps = {
onTokenStateRemove: TokenStateRemoveHandler; onTokenStateRemove: TokenStateRemoveHandler;
tokenState: TokenState; draggingOptions: TokenDraggingOptions;
dragging: boolean;
}; };
function TokenDragOverlay({ function TokenDragOverlay({
onTokenStateRemove, onTokenStateRemove,
tokenState, draggingOptions,
dragging,
}: TokenDragOverlayProps) { }: TokenDragOverlayProps) {
function handleTokenRemove() { function handleTokenRemove() {
onTokenStateRemove([tokenState.id]); onTokenStateRemove([
draggingOptions.tokenStateId,
...draggingOptions.attachedTokenStateIds,
]);
} }
return <DragOverlay dragging={dragging} onRemove={handleTokenRemove} />; return (
<DragOverlay
dragging={draggingOptions.dragging}
onRemove={handleTokenRemove}
/>
);
} }
export default TokenDragOverlay; export default TokenDragOverlay;

View File

@ -60,17 +60,23 @@ function useMapTokens(
function handleTokenDragStart( function handleTokenDragStart(
_: KonvaEventObject<DragEvent>, _: KonvaEventObject<DragEvent>,
tokenStateId: string tokenStateId: string,
attachedTokenStateIds: string[]
) { ) {
if (duplicateToken) { if (duplicateToken) {
const state = mapState?.tokens[tokenStateId]; let newStates: TokenState[] = [];
if (state) { for (let id of [tokenStateId, ...attachedTokenStateIds]) {
onTokensStateCreate([{ ...state, id: uuid() }]); const state = mapState?.tokens[id];
if (state) {
newStates.push({ ...state, id: uuid() });
}
} }
onTokensStateCreate(newStates);
} }
setTokenDraggingOptions({ setTokenDraggingOptions({
dragging: true, dragging: true,
tokenStateId, tokenStateId,
attachedTokenStateIds,
}); });
} }
@ -173,14 +179,10 @@ function useMapTokens(
/> />
); );
const tokenDraggingState = const tokenDragOverlay = tokenDraggingOptions && (
tokenDraggingOptions && mapState?.tokens[tokenDraggingOptions.tokenStateId];
const tokenDragOverlay = tokenDraggingOptions && tokenDraggingState && (
<TokenDragOverlay <TokenDragOverlay
onTokenStateRemove={handleTokenStateRemove} onTokenStateRemove={handleTokenStateRemove}
tokenState={tokenDraggingState} draggingOptions={tokenDraggingOptions}
dragging={!!(tokenDraggingOptions && tokenDraggingOptions.dragging)}
/> />
); );

View File

@ -34,7 +34,8 @@ export type TokenMenuCloseChangeEventHandler = () => void;
export type TokenSettingsChangeEventHandler = (change: Partial<Token>) => void; export type TokenSettingsChangeEventHandler = (change: Partial<Token>) => void;
export type TokenDragEventHandler = ( export type TokenDragEventHandler = (
event: Konva.KonvaEventObject<DragEvent>, event: Konva.KonvaEventObject<DragEvent>,
tokenStateId: string tokenStateId: string,
attachedTokenStateIds: string[]
) => void; ) => void;
export type NoteCreateEventHander = (notes: Note[]) => void; export type NoteCreateEventHander = (notes: Note[]) => void;

View File

@ -39,4 +39,5 @@ export type TokenMenuOptions = {
export type TokenDraggingOptions = { export type TokenDraggingOptions = {
dragging: boolean; dragging: boolean;
tokenStateId: string; tokenStateId: string;
attachedTokenStateIds: string[];
}; };