refactor: rename internal data field to __vf

Signed-off-by: Braks <78412429+bcakmakoglu@users.noreply.github.com>
This commit is contained in:
Braks
2021-11-21 12:54:04 +01:00
parent 71ba905348
commit 0e9f8c5fc2
12 changed files with 62 additions and 62 deletions
@@ -19,14 +19,14 @@ const store = useStore()
const sourceHandle =
store.connectionHandleId && store.connectionHandleType
? props.sourceNode.__rf?.handleBounds[store.connectionHandleType].find(
? props.sourceNode.__vf?.handleBounds[store.connectionHandleType].find(
(d: HandleElement) => d.id === store.connectionHandleId,
)
: store.connectionHandleType && props.sourceNode.__rf?.handleBounds[store.connectionHandleType ?? 'source'][0]
const sourceHandleX = sourceHandle ? sourceHandle.x + sourceHandle.width / 2 : (props.sourceNode.__rf?.width as number) / 2
const sourceHandleY = sourceHandle ? sourceHandle.y + sourceHandle.height / 2 : props.sourceNode.__rf?.height
const sourceX = props.sourceNode.__rf?.position?.x + sourceHandleX
const sourceY = props.sourceNode.__rf?.position?.y + sourceHandleY
: store.connectionHandleType && props.sourceNode.__vf?.handleBounds[store.connectionHandleType ?? 'source'][0]
const sourceHandleX = sourceHandle ? sourceHandle.x + sourceHandle.width / 2 : (props.sourceNode.__vf?.width as number) / 2
const sourceHandleY = sourceHandle ? sourceHandle.y + sourceHandle.height / 2 : props.sourceNode.__vf?.height
const sourceX = props.sourceNode.__vf?.position?.x + sourceHandleX
const sourceY = props.sourceNode.__vf?.position?.y + sourceHandleY
const isRightOrLeft = sourceHandle.position === Position.Left || sourceHandle.position === Position.Right
const targetPosition = isRightOrLeft ? Position.Left : Position.Top
+3 -3
View File
@@ -102,12 +102,12 @@ const nodes = computed(() => {
// when connection type is loose we can define all handles as sources
const targetNodeHandles = computed(() =>
store.connectionMode === ConnectionMode.Strict
? nodes.value.targetNode?.__rf?.handleBounds.target
: nodes.value.targetNode?.__rf?.handleBounds.target ?? nodes.value.targetNode?.__rf?.handleBounds.source,
? nodes.value.targetNode?.__vf?.handleBounds.target
: nodes.value.targetNode?.__vf?.handleBounds.target ?? nodes.value.targetNode?.__vf?.handleBounds.source,
)
const sourceHandle = computed(() => {
if (nodes.value.sourceNode) return getHandle(nodes.value.sourceNode.__rf?.handleBounds.source, props.edge.sourceHandle ?? null)
if (nodes.value.sourceNode) return getHandle(nodes.value.sourceNode.__vf?.handleBounds.source, props.edge.sourceHandle ?? null)
else return null
})
const targetHandle = computed(() => getHandle(targetNodeHandles.value, props.edge.targetHandle ?? null))
+12 -12
View File
@@ -41,13 +41,13 @@ const scale = computed(() => store.transform[2])
const selected = computed(() => selectable.value && store.selectedElements?.some(({ id }) => id === props.node.id))
const onMouseEnterHandler = () =>
props.node.__rf?.isDragging && ((event: MouseEvent) => store.hooks.nodeMouseEnter.trigger({ event, node: props.node }))
props.node.__vf?.isDragging && ((event: MouseEvent) => store.hooks.nodeMouseEnter.trigger({ event, node: props.node }))
const onMouseMoveHandler = () =>
props.node.__rf?.isDragging && ((event: MouseEvent) => store.hooks.nodeMouseMove.trigger({ event, node: props.node }))
props.node.__vf?.isDragging && ((event: MouseEvent) => store.hooks.nodeMouseMove.trigger({ event, node: props.node }))
const onMouseLeaveHandler = () =>
props.node.__rf?.isDragging && ((event: MouseEvent) => store.hooks.nodeMouseLeave.trigger({ event, node: props.node }))
props.node.__vf?.isDragging && ((event: MouseEvent) => store.hooks.nodeMouseLeave.trigger({ event, node: props.node }))
const onContextMenuHandler = () => (event: MouseEvent) => store.hooks.nodeContextMenu.trigger({ event, node: props.node })
@@ -97,7 +97,7 @@ const onDragStop: DraggableEventListener = ({ event }) => {
const n = props.node
// onDragStop also gets called when user just clicks on a node.
// Because of that we set dragging to true inside the onDrag handler and handle the click here
if (!props.node.__rf?.isDragging) {
if (!props.node.__vf?.isDragging) {
if (selectable.value && !props.selectNodesOnDrag && !selected.value) {
store.addSelectedElements([n])
}
@@ -165,9 +165,9 @@ onMounted(() => {
]"
:style="{
zIndex: selected ? 10 : 3,
transform: `translate(${props.node.__rf?.position?.x}px,${props.node.__rf?.position?.y}px)`,
transform: `translate(${props.node.__vf?.position?.x}px,${props.node.__vf?.position?.y}px)`,
pointerEvents: selectable || draggable ? 'all' : 'none',
opacity: props.node.__rf?.width !== null && props.node.__rf?.height !== null ? 1 : 0,
opacity: props.node.__vf?.width !== null && props.node.__vf?.height !== null ? 1 : 0,
...props.node.style,
}"
:data-id="props.node.id"
@@ -182,13 +182,13 @@ onMounted(() => {
id: props.node.id,
data: props.node.data,
type: props.node.type,
xPos: props.node.__rf?.position?.x,
yPos: props.node.__rf?.position?.y,
xPos: props.node.__vf?.position?.x,
yPos: props.node.__vf?.position?.y,
selected,
connectable,
sourcePosition: props.node.sourcePosition,
targetPosition: props.node.targetPosition,
dragging: props.node.__rf?.isDragging,
dragging: props.node.__vf?.isDragging,
}"
>
<component
@@ -197,13 +197,13 @@ onMounted(() => {
id: props.node.id,
data: props.node.data,
type: props.node.type,
xPos: props.node.__rf?.position?.x,
yPos: props.node.__rf?.position?.y,
xPos: props.node.__vf?.position?.x,
yPos: props.node.__vf?.position?.y,
selected,
connectable,
sourcePosition: props.node.sourcePosition,
targetPosition: props.node.targetPosition,
dragging: props.node.__rf?.isDragging,
dragging: props.node.__vf?.isDragging,
}"
/>
</slot>
@@ -12,7 +12,7 @@ const selectedNodes = store.selectedElements
return {
...matchingNode,
position: matchingNode?.__rf?.position,
position: matchingNode?.__vf?.position,
} as Node
})
: []