From 8ba671a5eb05e4d9136ff0c218b9267864a0da76 Mon Sep 17 00:00:00 2001
From: filtered <176114999+webfiltered@users.noreply.github.com>
Date: Tue, 11 Mar 2025 20:41:28 +1100
Subject: [PATCH] Fix animate to bounding rect interpolation (#743)

- Resolves #738
---
 src/LGraphCanvas.ts | 17 ++++++++++++++---
 1 file changed, 14 insertions(+), 3 deletions(-)

diff --git a/src/LGraphCanvas.ts b/src/LGraphCanvas.ts
index d9c7ff1bd..3517ebcde 100644
--- a/src/LGraphCanvas.ts
+++ b/src/LGraphCanvas.ts
@@ -7286,6 +7286,8 @@ export class LGraphCanvas implements ConnectionColorContext {
     const startTimestamp = performance.now()
     const startX = this.ds.offset[0]
     const startY = this.ds.offset[1]
+    const startX2 = startX - (this.canvas.width / this.ds.scale)
+    const startY2 = startY - (this.canvas.height / this.ds.scale)
     const startScale = this.ds.scale
     const cw = this.canvas.width / window.devicePixelRatio
     const ch = this.canvas.height / window.devicePixelRatio
@@ -7301,17 +7303,26 @@ export class LGraphCanvas implements ConnectionColorContext {
     }
     const targetX = -bounds[0] - bounds[2] * 0.5 + (cw * 0.5) / targetScale
     const targetY = -bounds[1] - bounds[3] * 0.5 + (ch * 0.5) / targetScale
+    const targetX2 = targetX - (Math.max(bounds[2], 300) / zoom)
+    const targetY2 = targetY - (Math.max(bounds[3], 300) / zoom)
 
     const animate = (timestamp: number) => {
       const elapsed = timestamp - startTimestamp
       const progress = Math.min(elapsed / duration, 1)
       const easedProgress = easeFunction(progress)
 
-      this.ds.offset[0] = startX + (targetX - startX) * easedProgress
-      this.ds.offset[1] = startY + (targetY - startY) * easedProgress
+      const currentX = startX + (targetX - startX) * easedProgress
+      const currentY = startY + (targetY - startY) * easedProgress
+      this.ds.offset[0] = currentX
+      this.ds.offset[1] = currentY
 
       if (zoom > 0) {
-        this.ds.scale = startScale + (targetScale - startScale) * easedProgress
+        const currentX2 = startX2 + ((targetX2 - startX2) * easedProgress)
+        const currentY2 = startY2 + ((targetY2 - startY2) * easedProgress)
+        const currentWidth = Math.abs(currentX2 - currentX)
+        const currentHeight = Math.abs(currentY2 - currentY)
+
+        this.ds.scale = Math.min(this.canvas.width / currentWidth, this.canvas.height / currentHeight)
       }
 
       this.setDirty(true, true)