From b1a8a5f2628b8ef00834f5c200ac0fe230c5535f Mon Sep 17 00:00:00 2001
From: Gerald <code@gera2ld.space>
Date: Wed, 25 Dec 2024 00:30:43 +0800
Subject: [PATCH] feat: support centering the active node

close #57
---
 src/app.ts | 25 +++++++++++++++++++------
 1 file changed, 19 insertions(+), 6 deletions(-)

diff --git a/src/app.ts b/src/app.ts
index 54cfebc..a0a41af 100644
--- a/src/app.ts
+++ b/src/app.ts
@@ -15,17 +15,28 @@ let root: INode | undefined;
 let style: HTMLStyleElement;
 let active:
   | {
-    node: INode;
-    el: Element;
-  }
+      node: INode;
+      el: Element;
+    }
   | undefined;
+const activeNodeOptions: {
+  placement?: 'center' | 'visible';
+} = {};
 
 const handlers = {
-  async setData(data: { root?: INode; jsonOptions?: IMarkmapJSONOptions }) {
+  async setData(data: {
+    root?: INode;
+    jsonOptions?: IMarkmapJSONOptions & {
+      activeNode?: {
+        placement?: 'center' | 'visible';
+      };
+    };
+  }) {
     await mm.setData((root = data.root), {
       ...defaultOptions,
       ...deriveOptions(data.jsonOptions),
     });
+    activeNodeOptions.placement = data.jsonOptions?.activeNode?.placement;
     if (firstTime) {
       mm.fit();
       firstTime = false;
@@ -170,8 +181,10 @@ function findActiveNode({
   return best && { node: best, needRerender };
 }
 
-function highlightNode(node: INode) {
-  mm.ensureView(node, {
+async function highlightNode(node: INode) {
+  await mm[
+    activeNodeOptions.placement === 'center' ? 'centerNode' : 'ensureVisible'
+  ](node, {
     bottom: 80,
   });
   const g = mm.findElement(node)?.g;