@andespindola/brainlink 0.1.0-beta.113 → 0.1.0-beta.114

package/README.md

@@ -596,6 +596,7 @@ The graph UI shows:
 - graph controls for zoom in, zoom out, fit visible nodes and reset-to-fit-all
 - wheel zoom (including `cmd+scroll` and `ctrl+scroll`) anchored to cursor position for faster navigation in large graphs
 - continuous target-scale interpolation for wheel/button zoom to avoid abrupt LOD jumps while keeping cursor-anchored focus
+- bloom-like navigation profile: wheel zoom now biases focus toward hovered/selected/hub nodes and applies subtle camera-anchor parallax so depth remains stable while zooming and panning
 - zoom-out floor for large and massive graphs, plus reset macro floor tied to hub-neighbor distance and first-level cluster spacing, with a tighter initial camera so the first graph appears as a closer cell instead of a distant mesh
 - keyboard shortcuts: `+` zoom in, `-` zoom out, `0` reset fit
 - double-click on canvas zooms in at cursor position

package/dist/application/frontend/client-js.js

@@ -77,6 +77,11 @@ const zoomAnimationSlowLerp = 0.18
 const zoomAnimationFastLerp = 0.36
 const zoomAnimationScaleSnap = 0.00008
 const zoomAnimationPositionSnap = 0.14
+const bloomZoomFocusMaxScreenDistance = 260
+const bloomZoomFocusFarStrength = 0.66
+const bloomZoomFocusNearStrength = 0.34
+const bloomCameraParallaxNearStrength = 0.2
+const bloomCameraParallaxFarStrength = 0.06
 const physicsDragFrameIntervalMs = 16
 const physicsIdleFrameIntervalMs = 78
 const physicsLargeGraphIdleFrameIntervalMs = 108
@@ -1270,19 +1275,20 @@ const projectEcosystemPoint = (x, y, depth, anchor) => {
 
 const applyEcosystemDepthProjection = (clusters, edges, anchor) => {
   const levelIndexMap = ecosystemLevelIndexBySize()
+  const effectiveAnchor = applyBloomCameraParallax(anchor)
   const projectedClusters = []
   const clusterById = new Map()
 
   for (let index = 0; index < clusters.length; index += 1) {
     const cluster = clusters[index]
     const baseDepth = ecosystemDepthForCluster(cluster, levelIndexMap)
-    const radialDistance = Math.hypot(cluster.x - anchor.x, cluster.y - anchor.y)
+    const radialDistance = Math.hypot(cluster.x - effectiveAnchor.x, cluster.y - effectiveAnchor.y)
     const radialOffset = cluster.isHub ? 0 : Math.min(320, radialDistance * ecosystemDepthRadialGain)
     const orbitalOffset = cluster.isHub
       ? 0
-      : Math.sin(Math.atan2(cluster.y - anchor.y, cluster.x - anchor.x) * 2.2) * ecosystemDepthOrbitalMaxOffset
+      : Math.sin(Math.atan2(cluster.y - effectiveAnchor.y, cluster.x - effectiveAnchor.x) * 2.2) * ecosystemDepthOrbitalMaxOffset
     const depth = Math.max(0, baseDepth + radialOffset + orbitalOffset)
-    const projected = projectEcosystemPoint(cluster.x, cluster.y, depth, anchor)
+    const projected = projectEcosystemPoint(cluster.x, cluster.y, depth, effectiveAnchor)
     const baseOpacity = Number.isFinite(cluster.lodOpacity) ? cluster.lodOpacity : 1
     const depthScale = ecosystemDepthMinScale + (1 - ecosystemDepthMinScale) * projected.factor
     const depthOpacity = Math.max(
@@ -1614,6 +1620,91 @@ const cursorWorldPoint = () => {
   return screenToWorldPoint(screenX, screenY)
 }
 
+const bloomZoomFocusStrength = (scale) => {
+  if (scale <= 0.08) return bloomZoomFocusFarStrength
+  if (scale <= 0.2) return 0.58
+  if (scale <= 0.45) return 0.5
+  if (scale <= 0.9) return 0.42
+  return bloomZoomFocusNearStrength
+}
+
+const bloomCameraParallaxStrength = (scale) => {
+  if (scale <= 0.08) return bloomCameraParallaxNearStrength
+  if (scale <= 0.2) return 0.16
+  if (scale <= 0.45) return 0.12
+  return bloomCameraParallaxFarStrength
+}
+
+const screenPointForWorld = (worldX, worldY) => ({
+  x: worldX * state.transform.scale + state.transform.x,
+  y: worldY * state.transform.scale + state.transform.y
+})
+
+const bloomZoomFocusCandidate = (screenX, screenY) => {
+  const candidates = [state.hovered, state.selected, state.primaryHub].filter(Boolean)
+  if (candidates.length === 0) {
+    return null
+  }
+
+  let bestNode = null
+  let bestDistance = Number.POSITIVE_INFINITY
+  for (let index = 0; index < candidates.length; index += 1) {
+    const node = candidates[index]
+    const point = screenPointForWorld(nodeRenderX(node), nodeRenderY(node))
+    const distance = Math.hypot(point.x - screenX, point.y - screenY)
+    if (distance < bestDistance) {
+      bestDistance = distance
+      bestNode = node
+    }
+  }
+
+  if (!bestNode) {
+    return null
+  }
+
+  const scale = state.transform.scale
+  const allowDistance = scale <= 0.16 ? bloomZoomFocusMaxScreenDistance * 1.7 : bloomZoomFocusMaxScreenDistance
+  if (bestDistance > allowDistance) {
+    return null
+  }
+
+  return {
+    x: nodeRenderX(bestNode),
+    y: nodeRenderY(bestNode)
+  }
+}
+
+const resolveZoomAnchorWorldPoint = (screenX, screenY, source) => {
+  const cursorPoint = screenToWorldPoint(screenX, screenY)
+  if (source !== 'wheel') {
+    return cursorPoint
+  }
+
+  const focusCandidate = bloomZoomFocusCandidate(screenX, screenY)
+  if (!focusCandidate) {
+    return cursorPoint
+  }
+
+  const strength = bloomZoomFocusStrength(state.transform.scale)
+  return {
+    x: cursorPoint.x + (focusCandidate.x - cursorPoint.x) * strength,
+    y: cursorPoint.y + (focusCandidate.y - cursorPoint.y) * strength
+  }
+}
+
+const applyBloomCameraParallax = (anchor) => {
+  const cursorPoint = cursorWorldPoint()
+  if (!cursorPoint) {
+    return anchor
+  }
+
+  const strength = bloomCameraParallaxStrength(state.transform.scale)
+  return {
+    x: anchor.x + (cursorPoint.x - anchor.x) * strength,
+    y: anchor.y + (cursorPoint.y - anchor.y) * strength
+  }
+}
+
 const visibilityScaleBucket = (scale) => {
   const safeScale = Math.max(zoomRange.min, scale)
   return Math.round(safeScale * 180_000)
@@ -3208,7 +3299,7 @@ const refreshRenderNodeDepthProjection = () => {
     return
   }
 
-  const anchor = nodeProjectionAnchor()
+  const anchor = applyBloomCameraParallax(nodeProjectionAnchor())
   let maxDistance = 1
   for (let index = 0; index < state.renderNodes.length; index += 1) {
     const node = state.renderNodes[index]
@@ -3862,7 +3953,7 @@ const zoomAtPoint = (screenX, screenY, factor, source = 'generic') => {
     state.zoomTransition.screenX === screenX &&
     state.zoomTransition.screenY === screenY
       ? { x: state.zoomTransition.worldX, y: state.zoomTransition.worldY }
-      : screenToWorldPoint(screenX, screenY)
+      : resolveZoomAnchorWorldPoint(screenX, screenY, source)
   const worldX = worldPointAtCursor.x
   const worldY = worldPointAtCursor.y
   state.lastZoomFocus = {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@andespindola/brainlink",
-  "version": "0.1.0-beta.113",
+  "version": "0.1.0-beta.114",
   "description": "Local-first knowledge memory for agents with Markdown, backlinks, indexing and context retrieval.",
   "type": "module",
   "license": "MIT",