libpetri 2.4.0 → 2.6.0

package/dist/viewer/index.js

@@ -30,13 +30,14 @@ function discoverClusters(svg) {
     if (!raw.startsWith("cluster_")) continue;
     const prefix = raw.slice("cluster_".length);
     if (out.has(prefix)) continue;
+    const rect = clusterRect(g);
     let nodeCount = 0;
     for (const node of allNodes) {
       if (node.getAttribute("data-instance")) continue;
       const nodeTitle = directChild(node, "title");
       if (!nodeTitle) continue;
       const id = (nodeTitle.textContent ?? "").trim();
-      if (nodeBelongsToPrefix(id, prefix)) {
+      if (nodeBelongsToCluster(id, node, prefix, rect)) {
         node.setAttribute("data-instance", prefix);
         nodeCount++;
       }
@@ -50,9 +51,77 @@ function discoverClusters(svg) {
   }
   return out;
 }
+function nodeBelongsToCluster(nodeId, node, prefix, rect) {
+  if (nodeBelongsToPrefix(nodeId, prefix)) return true;
+  if (rect) {
+    const c = nodeCenter(node);
+    if (c && c.x >= rect.minX && c.x <= rect.maxX && c.y >= rect.minY && c.y <= rect.maxY) {
+      return true;
+    }
+  }
+  return false;
+}
 function nodeBelongsToPrefix(nodeId, prefix) {
   return nodeId === prefix || nodeId.startsWith(`${prefix}/`) || nodeId.startsWith(`p_${prefix}_`) || nodeId.startsWith(`t_${prefix}_`) || nodeId.startsWith(`j_${prefix}_`);
 }
+function clusterRect(group) {
+  const border = directChild(group, "polygon") ?? directChild(group, "path");
+  if (!border) return null;
+  const raw = border.getAttribute("points") ?? border.getAttribute("d") ?? "";
+  return boundsOf(raw);
+}
+function nodeCenter(node) {
+  const ellipse = directChild(node, "ellipse");
+  if (ellipse) {
+    const x = parseFloat(ellipse.getAttribute("cx") ?? "");
+    const y = parseFloat(ellipse.getAttribute("cy") ?? "");
+    if (!Number.isNaN(x) && !Number.isNaN(y)) return { x, y };
+  }
+  const shape = directChild(node, "polygon") ?? directChild(node, "path");
+  if (shape) {
+    const bounds = boundsOf(
+      shape.getAttribute("points") ?? shape.getAttribute("d") ?? ""
+    );
+    if (bounds) {
+      return {
+        x: (bounds.minX + bounds.maxX) / 2,
+        y: (bounds.minY + bounds.maxY) / 2
+      };
+    }
+  }
+  return null;
+}
+function boundsOf(coords) {
+  const nums = coords.match(/-?\d+(?:\.\d+)?/g);
+  if (!nums || nums.length < 2) return null;
+  let minX = Infinity;
+  let minY = Infinity;
+  let maxX = -Infinity;
+  let maxY = -Infinity;
+  for (let i = 0; i + 1 < nums.length; i += 2) {
+    const x = parseFloat(nums[i]);
+    const y = parseFloat(nums[i + 1]);
+    if (x < minX) minX = x;
+    if (x > maxX) maxX = x;
+    if (y < minY) minY = y;
+    if (y > maxY) maxY = y;
+  }
+  if (minX === Infinity) return null;
+  return { minX, minY, maxX, maxY };
+}
+function nodeClusterMap(svg) {
+  const map = /* @__PURE__ */ new Map();
+  svg.querySelectorAll("g.node[data-instance]").forEach((node) => {
+    const di = node.getAttribute("data-instance");
+    const title = directChild(node, "title");
+    const id = (title?.textContent ?? "").trim();
+    if (di && id) map.set(id, di);
+  });
+  return map;
+}
+function endpointInCluster(id, prefix, clusterMap) {
+  return nodeBelongsToPrefix(id, prefix) || clusterMap.get(id) === prefix;
+}
 function colorForPrefix(prefix) {
   let h = 2166136261;
   for (let i = 0; i < prefix.length; i++) {
@@ -84,6 +153,7 @@ function setClusterCollapsed(cluster, collapsed) {
       node.classList.add("petri-collapsed-inside");
       hidden.push(node);
     });
+    const clusterMap = nodeClusterMap(root);
     root.querySelectorAll("g.edge").forEach((edge) => {
       const titleEl = directChild(edge, "title");
       if (!titleEl) return;
@@ -92,7 +162,7 @@ function setClusterCollapsed(cluster, collapsed) {
       if (arrow < 0) return;
       const from = t.slice(0, arrow);
       const to = t.slice(arrow + 2);
-      if (nodeBelongsToPrefix(from, cluster.prefix) && nodeBelongsToPrefix(to, cluster.prefix)) {
+      if (endpointInCluster(from, cluster.prefix, clusterMap) && endpointInCluster(to, cluster.prefix, clusterMap)) {
         edge.classList.add("petri-collapsed-inside");
         hidden.push(edge);
       }
@@ -135,6 +205,7 @@ function applyFilter(svg, prefix) {
   }
   svg.setAttribute("data-active-filter", prefix);
   svg.classList.add("has-active-filter");
+  const clusterMap = nodeClusterMap(svg);
   svg.querySelectorAll("g.node").forEach((node) => {
     const di = node.getAttribute("data-instance");
     const match = !!di && (di === prefix || di.indexOf(prefix + "_") === 0 || di.indexOf(prefix + "/") === 0);
@@ -152,7 +223,7 @@ function applyFilter(svg, prefix) {
     }
     const from = titleText.slice(0, arrow);
     const to = titleText.slice(arrow + 2);
-    const matches = (name) => name.indexOf(prefix + "/") >= 0 || name.indexOf(prefix + "_") >= 0 || name === prefix;
+    const matches = (name) => name.indexOf(prefix + "/") >= 0 || name.indexOf(prefix + "_") >= 0 || name === prefix || clusterMap.get(name) === prefix;
     if (matches(from) || matches(to)) edge.classList.remove("petri-dimmed");
     else edge.classList.add("petri-dimmed");
   });
@@ -160,9 +231,10 @@ function applyFilter(svg, prefix) {
 function isInsideCollapsedCluster(svg, clusters, collapsedPrefixes, graphId) {
   if (collapsedPrefixes.size === 0) return false;
   if (!svg) return false;
+  const clusterMap = nodeClusterMap(svg);
   for (const prefix of collapsedPrefixes) {
     if (!clusters.has(prefix)) continue;
-    if (nodeBelongsToPrefix(graphId, prefix)) return true;
+    if (endpointInCluster(graphId, prefix, clusterMap)) return true;
   }
   return false;
 }