diff --git a/packages/renderer-vue/src/editor/Editor.vue b/packages/renderer-vue/src/editor/Editor.vue
index eabf60ce..c3fe888a 100644
--- a/packages/renderer-vue/src/editor/Editor.vue
+++ b/packages/renderer-vue/src/editor/Editor.vue
@@ -42,9 +42,22 @@
-
-
-
+
+
+
@@ -67,7 +80,7 @@ import { AbstractNode } from "@baklavajs/core";
import { IBaklavaViewModel } from "../viewModel";
import { usePanZoom } from "./panZoom";
import { useTemporaryConnection } from "./temporaryConnection";
-import { providePlugin } from "../utility";
+import { providePlugin, useDragMove } from "../utility";
import Background from "./Background.vue";
import Node from "../node/Node.vue";
@@ -89,6 +102,7 @@ const el = ref(null);
provide("editorEl", el);
const nodes = computed(() => props.viewModel.displayedGraph.nodes);
+const dragMoves = computed(() => props.viewModel.displayedGraph.nodes.map((n) => useDragMove(toRef(n, "position"))));
const connections = computed(() => props.viewModel.displayedGraph.connections);
const selectedNodes = computed(() => props.viewModel.displayedGraph.selectedNodes);
@@ -147,4 +161,28 @@ const selectNode = (node: AbstractNode) => {
const unselectAllNodes = () => {
props.viewModel.displayedGraph.selectedNodes = [];
};
+
+const startDrag = (ev: PointerEvent) => {
+ for (const selectedNode of props.viewModel.displayedGraph.selectedNodes) {
+ const idx = nodes.value.indexOf(selectedNode);
+ const dragMove = dragMoves.value[idx];
+ dragMove.onPointerDown(ev);
+
+ document.addEventListener("pointermove", dragMove.onPointerMove);
+ }
+
+ document.addEventListener("pointerup", stopDrag);
+};
+
+const stopDrag = () => {
+ for (const selectedNode of props.viewModel.displayedGraph.selectedNodes) {
+ const idx = nodes.value.indexOf(selectedNode);
+ const dragMove = dragMoves.value[idx];
+ dragMove.onPointerUp();
+
+ document.removeEventListener("pointermove", dragMove.onPointerMove);
+ }
+
+ document.removeEventListener("pointerup", stopDrag);
+};
diff --git a/packages/renderer-vue/src/node/Node.vue b/packages/renderer-vue/src/node/Node.vue
index 9786b9e0..6e88ebcb 100644
--- a/packages/renderer-vue/src/node/Node.vue
+++ b/packages/renderer-vue/src/node/Node.vue
@@ -64,9 +64,9 @@