From ddc4753a03d275c522e740316adf7df9a7b7b22d Mon Sep 17 00:00:00 2001
From: kijai <40791699+kijai@users.noreply.github.com>
Date: Thu, 25 Apr 2024 17:58:04 +0300
Subject: [PATCH] Update spline_editor.js

---
 web/js/spline_editor.js | 32 ++++++++++++++++++++++++++++----
 1 file changed, 28 insertions(+), 4 deletions(-)

diff --git a/web/js/spline_editor.js b/web/js/spline_editor.js
index e327f66..c99149b 100644
--- a/web/js/spline_editor.js
+++ b/web/js/spline_editor.js
@@ -160,6 +160,30 @@ function createSplineEditor(context, reset=false) {
   const pointsStoreWidget = context.widgets.find(w => w.name === "points_store");
   const tensionWidget = context.widgets.find(w => w.name === "tension");
   const segmentedWidget = context.widgets.find(w => w.name === "segmented");
+
+  var interpolation = interpolationWidget.value
+  var tension = tensionWidget.value
+  var points_to_sample = pointsWidget.value
+  interpolationWidget.callback = () => {
+    interpolation = interpolationWidget.value
+    vis.render();
+  }
+
+  tensionWidget.callback = () => {
+    tension = tensionWidget.value
+    vis.render();
+  }
+
+  pointsWidget.callback = () => {
+    points_to_sample = pointsWidget.value
+    let coords = samplePoints(pathElements[0], points_to_sample);
+    let coordsString = JSON.stringify(coords);
+    pointsStoreWidget.value = JSON.stringify(points);
+    if (coordWidget) {
+      coordWidget.value = coordsString;
+    vis.render();
+  }
+}
   
  // Initialize or reset points array
  var w = 512
@@ -203,7 +227,7 @@ function createSplineEditor(context, reset=false) {
     })
   .event("mouseup", function() {
     if (this.pathElements !== null) {
-        let coords = samplePoints(pathElements[0], pointsWidget.value);
+        let coords = samplePoints(pathElements[0], points_to_sample);
         let coordsString = JSON.stringify(coords);
         pointsStoreWidget.value = JSON.stringify(points);
         if (coordWidget) {
@@ -222,9 +246,9 @@ function createSplineEditor(context, reset=false) {
     .data(() => points)
     .left(d => d.x)
     .top(d => d.y)
-    .interpolate(() => interpolationWidget.value)
-    .tension(() => tensionWidget.value)
-    .segmented(() => segmentedWidget.value)
+    .interpolate(() => interpolation)
+    .tension(() => tension)
+    .segmented(() => false)
     .strokeStyle(pv.Colors.category10().by(pv.index))
     .lineWidth(3)