UNPKG

@gravity-ui/graph

Version:

Modern graph editor component

61 lines (60 loc) 3.2 kB
import { selectBlockById } from "../../../../store/block/selectors"; import { addEventListeners, createCustomDragEvent, dispatchEvents, isAllowChangeBlockGeometry, isMetaKeyEvent, } from "../../../../utils/functions"; import { dragListener } from "../../../../utils/functions/dragListener"; import { EVENTS } from "../../../../utils/types/events"; import { ESelectionStrategy } from "../../../../utils/types/types"; export class BlockController { constructor(block) { addEventListeners(block, { click(event) { event.stopPropagation(); const { connectionsList } = block.context.graph.rootStore; const isAnyConnectionSelected = connectionsList.$selectedConnections.value.size !== 0; if (!isMetaKeyEvent(event) && isAnyConnectionSelected) { connectionsList.resetSelection(); } block.context.graph.api.selectBlocks([block.props.id], /** * On click with meta key we want to select only one block, otherwise we want to toggle selection */ !isMetaKeyEvent(event) ? true : !block.state.selected, /** * On click with meta key we want to append selection, otherwise we want to replace selection */ !isMetaKeyEvent(event) ? ESelectionStrategy.REPLACE : ESelectionStrategy.APPEND); }, mousedown(event) { const blockState = selectBlockById(block.context.graph, block.props.id); const allowChangeBlockGeometry = isAllowChangeBlockGeometry(block.getConfigFlag("canChangeBlockGeometry"), blockState.selected); if (!allowChangeBlockGeometry) return; event.stopPropagation(); const blocksListState = this.context.graph.rootStore.blocksList; const selectedBlocksStates = getSelectedBlocks(blockState, blocksListState); const selectedBlocksComponents = selectedBlocksStates.map((block) => block.getViewComponent()); dragListener(block.context.ownerDocument) .on(EVENTS.DRAG_START, (_event) => { block.context.graph.getGraphLayer().captureEvents(this); dispatchEvents(selectedBlocksComponents, createCustomDragEvent(EVENTS.DRAG_START, _event)); }) .on(EVENTS.DRAG_UPDATE, (_event) => { dispatchEvents(selectedBlocksComponents, createCustomDragEvent(EVENTS.DRAG_UPDATE, _event)); }) .on(EVENTS.DRAG_END, (_event) => { block.context.graph.getGraphLayer().releaseCapture(); dispatchEvents(selectedBlocksComponents, createCustomDragEvent(EVENTS.DRAG_END, _event)); }); }, }); } } export function getSelectedBlocks(currentBlockState, blocksState) { let selected; if (currentBlockState.selected) { selected = blocksState.$selectedBlocks.value; } else { selected = [currentBlockState]; } return selected; }