diff --git a/frontend/src/lib/components/Camera.svelte b/frontend/src/lib/components/Camera.svelte
index 9d91475..78c4444 100644
--- a/frontend/src/lib/components/Camera.svelte
+++ b/frontend/src/lib/components/Camera.svelte
@@ -30,8 +30,11 @@
controls.target0.copy(target0);
controls.position0.copy(position0);
controls.zoom0 = zoom0;
- controls.reset();
+ } else {
+ controls.zoom0 = 30;
}
+
+ controls.reset();
};
const saveControls = () => {
diff --git a/frontend/src/lib/components/Edge.svelte b/frontend/src/lib/components/Edge.svelte
index 2f7811a..3d36d30 100644
--- a/frontend/src/lib/components/Edge.svelte
+++ b/frontend/src/lib/components/Edge.svelte
@@ -31,10 +31,10 @@
last_from_x = new_x;
last_from_y = new_y;
}
- curve.v0.set(from.position.x + 5, from.position.y + 0.67);
- curve.v1.set(from.position.x + 7, from.position.y + 0.67);
- curve.v2.set(to.position.x - 2, to.position.y + 2.55);
- curve.v3.set(to.position.x, to.position.y + 2.55);
+ curve.v0.set(from.position.x + 5, from.position.y + 0.65);
+ curve.v1.set(from.position.x + 7, from.position.y + 0.65);
+ curve.v2.set(to.position.x - 2, to.position.y + 2.5);
+ curve.v3.set(to.position.x, to.position.y + 2.5);
points = curve.getPoints(samples).map((p) => new Vector3(p.x, 0, p.y));
}
@@ -46,22 +46,22 @@
-
+
-
+
diff --git a/frontend/src/lib/components/Graph.svelte b/frontend/src/lib/components/Graph.svelte
index 467e1a4..28460f8 100644
--- a/frontend/src/lib/components/Graph.svelte
+++ b/frontend/src/lib/components/Graph.svelte
@@ -47,12 +47,9 @@
(event.clientY - mouseDownY) / cameraPosition[2];
if (event.ctrlKey) {
- const targets = [1, 2, 4, 8];
- const index = Math.floor(
- ((cameraPosition[2] - 4) / (150 - 4)) * targets.length * 0.999,
- );
- newX = snapToGrid(newX, 5 / targets[index]);
- newY = snapToGrid(newY, 5 / targets[index]);
+ const snapLevel = getSnapLevel();
+ newX = snapToGrid(newX, 5 / snapLevel);
+ newY = snapToGrid(newY, 5 / snapLevel);
}
node.position.x = newX;
node.position.y = newY;
@@ -74,8 +71,31 @@
node.tmp.downY = node.position.y;
}
+ function getSnapLevel() {
+ const z = cameraPosition[2];
+ if (z > 66) {
+ return 8;
+ } else if (z > 55) {
+ return 4;
+ } else if (z > 11) {
+ return 2;
+ } else {
+ }
+ return 1;
+ }
+
function handleMouseUp() {
mouseDown = false;
+
+ const node = graph.getNode(activeNodeId);
+
+ if (!node) return;
+ const snapLevel = getSnapLevel();
+ node.position.x = snapToGrid(node.position.x, 5 / snapLevel);
+ node.position.y = snapToGrid(node.position.y, 5 / snapLevel);
+
+ graph.nodes = [...graph.nodes];
+ edges = [...edges];
}
diff --git a/frontend/src/lib/components/NodeHeader.svelte b/frontend/src/lib/components/NodeHeader.svelte
index 7e48722..9b3e686 100644
--- a/frontend/src/lib/components/NodeHeader.svelte
+++ b/frontend/src/lib/components/NodeHeader.svelte
@@ -42,7 +42,7 @@
height="100"
preserveAspectRatio="none"
style={`
- --path: path("${createPath({ depth: 5, height: 27 })}");
+ --path: path("${createPath({ depth: 5, height: 27, y: 48.2 })}");
--hover-path: path("${createPath({ depth: 8, height: 24 })}");
`}
>
diff --git a/frontend/src/lib/components/NodeParameter.svelte b/frontend/src/lib/components/NodeParameter.svelte
index a072d4f..4dcfc0e 100644
--- a/frontend/src/lib/components/NodeParameter.svelte
+++ b/frontend/src/lib/components/NodeParameter.svelte
@@ -55,7 +55,7 @@
height="100"
preserveAspectRatio="none"
style={`
- --path: path("${createPath({ depth: 5, height: 15 })}");
+ --path: path("${createPath({ depth: 5, height: 15, y: 48.2 })}");
--hover-path: path("${createPath({ depth: 8, height: 24 })}");
`}
>