thepaperpilot/Planar-Pioneers
1
0
Fork 0
mirror of https://github.com/thepaperpilot/Planar-Pioneers.git synced 2024-11-21 08:12:38 +00:00
Code Issues Releases Activity Actions

Make node links follow dragging

Browse source
This commit is contained in:
thepaperpilot 2023-05-14 18:30:35 -05:00
parent 8867829879
commit ac71840be7
2 changed files with 26 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
src/features/boards/Board.vue
View file

@ -28,7 +28,16 @@
v-for="link in unref(links) || []"
:key="`${link.startNode.id}-${link.endNode.id}`"
>
<BoardLinkVue :link="link" />
<BoardLinkVue
:link="link"
:dragging="unref(draggingNode)"
:dragged="
link.startNode === unref(draggingNode) ||
link.endNode === unref(draggingNode)
? dragged
: undefined
"
/>
</g>
</transition-group>
<transition-group name="grow" :duration="500" appear>

19
src/features/boards/BoardLink.vue
View file

@ -11,29 +11,42 @@
</template>
<script setup lang="ts">
import type { BoardNodeLink } from "features/boards/board";
import type { BoardNode, BoardNodeLink } from "features/boards/board";
import { computed, toRefs, unref } from "vue";
const _props = defineProps<{
link: BoardNodeLink;
dragging: BoardNode | null;
dragged?: {
x: number;
y: number;
};
}>();
const props = toRefs(_props);
const startPosition = computed(() => {
const position = props.link.value.startNode.position;
const position = { ...props.link.value.startNode.position };
if (props.link.value.offsetStart) {
position.x += unref(props.link.value.offsetStart).x;
position.y += unref(props.link.value.offsetStart).y;
}
if (props.dragging?.value === props.link.value.startNode) {
position.x += props.dragged?.value?.x ?? 0;
position.y += props.dragged?.value?.y ?? 0;
}
return position;
});
const endPosition = computed(() => {
const position = props.link.value.endNode.position;
const position = { ...props.link.value.endNode.position };
if (props.link.value.offsetEnd) {
position.x += unref(props.link.value.offsetEnd).x;
position.y += unref(props.link.value.offsetEnd).y;
}
if (props.dragging?.value === props.link.value.endNode) {
position.x += props.dragged?.value?.x ?? 0;
position.y += props.dragged?.value?.y ?? 0;
}
return position;
});
</script>