fix: single-click opens editor on rFunds flow nodes
Previously only double-click opened the editor/modal. Now single click (without dragging) opens the side editor panel. Double-click still opens rich modals for outcome/source nodes. Added drag threshold (5px) so clicks don't accidentally start dragging. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
parent
b6ddd4a833
commit
20ef1e9ec4
|
|
@ -699,6 +699,9 @@ class FolkFundsApp extends HTMLElement {
|
|||
});
|
||||
|
||||
// Global pointer move/up (for both panning and node drag)
|
||||
let nodeDragStarted = false;
|
||||
const DRAG_THRESHOLD = 5;
|
||||
|
||||
this._boundPointerMove = (e: PointerEvent) => {
|
||||
if (this.wiringActive && this.wiringDragging) {
|
||||
this.wiringPointerX = e.clientX;
|
||||
|
|
@ -713,8 +716,16 @@ class FolkFundsApp extends HTMLElement {
|
|||
return;
|
||||
}
|
||||
if (this.draggingNodeId) {
|
||||
const dx = (e.clientX - this.dragStartX) / this.canvasZoom;
|
||||
const dy = (e.clientY - this.dragStartY) / this.canvasZoom;
|
||||
const rawDx = e.clientX - this.dragStartX;
|
||||
const rawDy = e.clientY - this.dragStartY;
|
||||
// Only start visual drag after exceeding threshold
|
||||
if (!nodeDragStarted) {
|
||||
if (Math.abs(rawDx) < DRAG_THRESHOLD && Math.abs(rawDy) < DRAG_THRESHOLD) return;
|
||||
nodeDragStarted = true;
|
||||
svg.classList.add("dragging");
|
||||
}
|
||||
const dx = rawDx / this.canvasZoom;
|
||||
const dy = rawDy / this.canvasZoom;
|
||||
const node = this.nodes.find((n) => n.id === this.draggingNodeId);
|
||||
if (node) {
|
||||
node.position.x = this.dragNodeStartX + dx;
|
||||
|
|
@ -744,8 +755,16 @@ class FolkFundsApp extends HTMLElement {
|
|||
svg.classList.remove("panning");
|
||||
}
|
||||
if (this.draggingNodeId) {
|
||||
const clickedNodeId = this.draggingNodeId;
|
||||
const wasDragged = nodeDragStarted;
|
||||
this.draggingNodeId = null;
|
||||
nodeDragStarted = false;
|
||||
svg.classList.remove("dragging");
|
||||
|
||||
// If it was a click (no drag), open the editor
|
||||
if (!wasDragged) {
|
||||
this.openEditor(clickedNodeId);
|
||||
}
|
||||
}
|
||||
};
|
||||
svg.addEventListener("pointermove", this._boundPointerMove);
|
||||
|
|
@ -803,13 +822,13 @@ class FolkFundsApp extends HTMLElement {
|
|||
this.selectedNodeId = nodeId;
|
||||
this.updateSelectionHighlight();
|
||||
|
||||
// Start drag
|
||||
// Prepare drag (but don't start until threshold exceeded)
|
||||
nodeDragStarted = false;
|
||||
this.draggingNodeId = nodeId;
|
||||
this.dragStartX = e.clientX;
|
||||
this.dragStartY = e.clientY;
|
||||
this.dragNodeStartX = node.position.x;
|
||||
this.dragNodeStartY = node.position.y;
|
||||
svg.classList.add("dragging");
|
||||
svg.setPointerCapture(e.pointerId);
|
||||
});
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue