Clean up old code

Author: jonnyz32

src/views/cytoscape/media/borderDraw.js renamed to src/views/cytoscape/media/borderAndIconDraw.js

@@ -1,8 +1,3 @@
-/* .codicon {
-  font-size: 30px !important;
-  color: #007acc;
-  margin-bottom: 8px;
-} */
 
 .diagram-container {
     position: absolute;

src/views/cytoscape/media/cytoscape-node-html-label.min.js

@@ -1,22 +1,17 @@
-// Initialize Cytoscape
-// main.js
+// @ts-nocheck
 import { getTooltipPosition } from "./graphUtils.js";
 import {
   deleteAllBorders,
   drawBorderAndIconForEachExplainNode,
-} from "./borderDraw.js";
-// // @ts-ignore
-// const iconMap = window.iconMap;
-// @ts-ignore
+} from "./borderAndIconDraw.js";
+
 const tooltips = window.tooltips;
-// @ts-ignore
 const vscode = window.acquireVsCodeApi();
-// @ts-ignore
+
+// Initialize Cytoscape
 const cy = cytoscape({
   container: document.getElementById("diagramContainer"),
-  // @ts-ignore
   elements: window.data,
-
   style: [
     {
       selector: "node",
@@ -43,95 +38,22 @@ const cy = cytoscape({
     },
   ],
 
-  // Layout options
   layout: {
     name: "grid",
     padding: 50, // Padding around the graph
     spacingFactor: 0.9, // Spacing between nodes
   },
 });
 
-// Add click event to show alert for nodes
+// When clicked, we display the details for the node in the bottom tree view
 cy.on("tap", "node", function (evt) {
   const id = evt.target.id();
-  // @ts-ignore
   vscode.postMessage({
     command: "selected",
     nodeId: id,
   });
 });
 
-// const getCodiconClass = (label) => {
-//   const className = iconMap[label];
-//   return className !== undefined ? `codicon-${className}` : "";
-// };
-
-// cy.nodeHtmlLabel([
-//   {
-//     query: ".l1",
-//     valign: "top",
-//     halign: "center",
-//     valignBox: "top",
-//     halignBox: "center",
-//     tpl: function (data) {
-//       const className = getCodiconClass(data.label);
-//       return `<div><div class="icon"><i class="codicon ${className}"></i></div>`;
-//     },
-//   },
-// ]);
-
-// cy.nodes().on("mouseover", (event) => {
-//   const node = event.target;
-//   const id = node.id();
-//   const tooltip = tooltips[id];
-//   const hoverDiv = document.createElement("pre");
-//   hoverDiv.innerText = tooltip;
-//   hoverDiv.className = "hover-box";
-//   document.body.appendChild(hoverDiv);
-
-//   function updatePosition() {
-//     const { x, y } = node.renderedPosition(); // center of node
-//     const containerRect = cy.container().getBoundingClientRect(); // Cytoscape canvas
-//     const boxRect = hoverDiv.getBoundingClientRect(); // Tooltip box
-//     const boxWidth = boxRect.width;
-//     const boxHeight = boxRect.height;
-
-//     const nodeTopY = y - node.renderedOuterHeight() / 2;
-//     const offset = 20;
-
-//     let top = nodeTopY + containerRect.top - boxHeight - offset;
-//     let left = x + containerRect.left - boxWidth / 2;
-
-//     // Constrain to visible area
-//     const viewportWidth = window.innerWidth;
-//     const viewportHeight = window.innerHeight;
-
-//     // Keep inside horizontal bounds
-//     if (left < 4) left = 4;
-//     if (left + boxWidth > viewportWidth - 4) {
-//       left = viewportWidth - boxWidth - 4;
-//     }
-
-//     // If tooltip would be cut off vertically, show it *below* the node instead
-//     if (top < 4) {
-//       top = y + containerRect.top + node.renderedOuterHeight() / 2;
-//     }
-
-//     hoverDiv.style.left = `${left}px`;
-//     hoverDiv.style.top = `${top}px`;
-//   }
-
-//   updatePosition(); // initial position
-//   cy.on("pan zoom resize", updatePosition);
-//   node.on("position", updatePosition);
-
-//   node.once("mouseout", () => {
-//     hoverDiv.remove();
-//     cy.off("pan zoom resize", updatePosition);
-//     node.off("position", updatePosition);
-//   });
-// });
-
 // === Tooltip Hover Handler ===
 cy.nodes().on("mouseover", (event) => {
   const node = event.target;

src/views/cytoscape/media/explain.css

@@ -42,7 +42,6 @@ export function getBorderWidthAndHeight(
 }
 
 // === Tooltip Position Utility ===
-
 export function getTooltipPosition(node, container, tooltipBox) {
   const { x, y } = node.renderedPosition();
   const containerRect = container.getBoundingClientRect();