@basic-genomics/hivtrace-viz 1.5.1 → 1.5.2

package/dist/embed/index.html

@@ -1646,6 +1646,10 @@
       if (window._treeData) {
         window._treeData = null;
       }
+      // 清除所有树相关的全局状态
+      window._treeSelectTreeCluster = null;
+      window._treeCurrentClusterIndex = undefined;
+      window._treeExportId = null;
       tree_viz = null;
     }
 
@@ -1742,6 +1746,7 @@
       // 选择簇
       function selectTreeCluster(index) {
         currentClusterIndex = index;
+        window._treeCurrentClusterIndex = currentClusterIndex; // 暴露到全局作用域
         var label = document.getElementById('tree_cluster_selector_label');
 
         if (index < 0) {
@@ -1755,6 +1760,11 @@
         updateTreeNavButtons();
       }
 
+      // 暴露函数到全局作用域供事件处理器使用
+      window._treeSelectTreeCluster = selectTreeCluster;
+      window._treeCurrentClusterIndex = currentClusterIndex;
+      window._treeExportId = options && options.exportId ? options.exportId : null;
+
       // 默认高亮簇
       if (options && options.treeDefaultClusterId != null) {
         var defaultIndex = clusters.findIndex(function (c) {
@@ -1766,71 +1776,124 @@
       }
 
       updateTreeNavButtons();
+    }
 
+    // 进化树工具栏事件初始化（在页面加载时调用一次，使用 null 检查确保安全）
+    function initTreeToolbarEvents() {
       // 适应窗口按钮
-      document.getElementById('tree_fit_btn').addEventListener('click', function () {
-        tree_viz.fitView();
-      });
+      var treeFitBtn = document.getElementById('tree_fit_btn');
+      if (treeFitBtn) {
+        treeFitBtn.addEventListener('click', function () {
+          if (tree_viz && tree_viz.cy) {
+            tree_viz.fitView();
+          }
+        });
+      }
 
       // 标签按钮
-      document.getElementById('tree_labels_btn').addEventListener('click', function () {
-        var showing = tree_viz.toggleLabels();
-        document.getElementById('tree_labels_text').textContent = showing ? '隐藏标签' : '显示标签';
-      });
+      var treeLabelsBtn = document.getElementById('tree_labels_btn');
+      if (treeLabelsBtn) {
+        treeLabelsBtn.addEventListener('click', function () {
+          if (tree_viz && tree_viz.cy) {
+            var showing = tree_viz.toggleLabels();
+            var labelsText = document.getElementById('tree_labels_text');
+            if (labelsText) {
+              labelsText.textContent = showing ? '隐藏标签' : '显示标签';
+            }
+          }
+        });
+      }
 
       // 聚焦根按钮
-      document.getElementById('tree_show_root_btn').addEventListener('click', function () {
-        tree_viz.focusOnRoot();
-      });
+      var treeShowRootBtn = document.getElementById('tree_show_root_btn');
+      if (treeShowRootBtn) {
+        treeShowRootBtn.addEventListener('click', function () {
+          if (tree_viz && tree_viz.cy) {
+            tree_viz.focusOnRoot();
+          }
+        });
+      }
 
       // 上一个簇
-      document.getElementById('tree_cluster_prev_btn').addEventListener('click', function () {
-        if (currentClusterIndex >= 0) {
-          selectTreeCluster(currentClusterIndex - 1);
-        }
-      });
+      var treePrevBtn = document.getElementById('tree_cluster_prev_btn');
+      if (treePrevBtn) {
+        treePrevBtn.addEventListener('click', function () {
+          if (tree_viz && window._treeCurrentClusterIndex >= 0 && window._treeSelectTreeCluster) {
+            window._treeSelectTreeCluster(window._treeCurrentClusterIndex - 1);
+          }
+        });
+      }
 
       // 下一个簇
-      document.getElementById('tree_cluster_next_btn').addEventListener('click', function () {
-        if (currentClusterIndex < clusters.length - 1) {
-          selectTreeCluster(currentClusterIndex + 1);
-        }
-      });
+      var treeNextBtn = document.getElementById('tree_cluster_next_btn');
+      if (treeNextBtn) {
+        treeNextBtn.addEventListener('click', function () {
+          if (tree_viz && window._treeSelectTreeCluster) {
+            var clusters = tree_viz.getAvailableClusters();
+            if (typeof window._treeCurrentClusterIndex !== 'undefined' &&
+              window._treeCurrentClusterIndex < clusters.length - 1) {
+              window._treeSelectTreeCluster(window._treeCurrentClusterIndex + 1);
+            }
+          }
+        });
+      }
 
       // 簇选择器下拉菜单点击
-      document.getElementById('tree_cluster_selector_menu').addEventListener('click', function (e) {
-        e.preventDefault();
-        var link = e.target.closest('a[data-value]');
-        if (!link) return;
-
-        var value = link.getAttribute('data-value');
-        if (value === '') {
-          selectTreeCluster(-1);
-        } else {
-          var index = parseInt(link.getAttribute('data-index'), 10);
-          if (!isNaN(index)) {
-            selectTreeCluster(index);
+      var treeClusterMenu = document.getElementById('tree_cluster_selector_menu');
+      if (treeClusterMenu) {
+        treeClusterMenu.addEventListener('click', function (e) {
+          e.preventDefault();
+          var link = e.target.closest('a[data-value]');
+          if (!link) return;
+
+          if (!window._treeSelectTreeCluster) return;
+
+          var value = link.getAttribute('data-value');
+          if (value === '') {
+            window._treeSelectTreeCluster(-1);
+          } else {
+            var index = parseInt(link.getAttribute('data-index'), 10);
+            if (!isNaN(index)) {
+              window._treeSelectTreeCluster(index);
+            }
           }
-        }
-      });
+        });
+      }
 
       // 导出 PNG
-      document.getElementById('tree_export_png').addEventListener('click', function (e) {
-        e.preventDefault();
-        tree_viz.exportPNG(options && options.exportId ? options.exportId + '_tree' : 'tree');
-      });
+      var treeExportPng = document.getElementById('tree_export_png');
+      if (treeExportPng) {
+        treeExportPng.addEventListener('click', function (e) {
+          e.preventDefault();
+          if (tree_viz && tree_viz.cy) {
+            var exportId = window._treeExportId || 'tree';
+            tree_viz.exportPNG(exportId + '_tree');
+          }
+        });
+      }
 
       // 导出 JSON
-      document.getElementById('tree_export_json').addEventListener('click', function (e) {
-        e.preventDefault();
-        tree_viz.exportJSON(treeData, options && options.exportId ? options.exportId + '_tree' : 'tree');
-      });
+      var treeExportJson = document.getElementById('tree_export_json');
+      if (treeExportJson) {
+        treeExportJson.addEventListener('click', function (e) {
+          e.preventDefault();
+          if (tree_viz && window._treeData) {
+            var exportId = window._treeExportId || 'tree';
+            tree_viz.exportJSON(window._treeData, exportId + '_tree');
+          }
+        });
+      }
 
       // 播放动画按钮
-      document.getElementById('tree_animate_btn').addEventListener('click', function (e) {
-        e.preventDefault();
-        tree_viz.animateFromRoot({ delay: 100 });
-      });
+      var treeAnimateBtn = document.getElementById('tree_animate_btn');
+      if (treeAnimateBtn) {
+        treeAnimateBtn.addEventListener('click', function (e) {
+          e.preventDefault();
+          if (tree_viz && tree_viz.cy) {
+            tree_viz.animateFromRoot({ delay: 100 });
+          }
+        });
+      }
     }
 
     function HandleAppError(err_string) {
@@ -2634,6 +2697,9 @@
       // 初始化全屏功能
       FullscreenManager.init();
 
+      // 初始化进化树工具栏事件（只注册一次，使用 null 检查确保安全）
+      initTreeToolbarEvents();
+
       // 通知父窗口准备就绪
       window.parent.postMessage({ type: 'HIVTRACE_INIT_READY' }, '*');
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@basic-genomics/hivtrace-viz",
-  "version": "1.5.1",
+  "version": "1.5.2",
   "description": "HIV-TRACE molecular transmission network visualization with React integration",
   "engines": {
     "node": ">=18"