removed borders

Author: jonnyz32

media/explain/borderAndIconDraw.js

@@ -9,12 +9,6 @@ export function deleteAllBorders() {
   document.querySelectorAll(".border").forEach((el) => el.remove());
 }
 
-function makeAllBordersTransparent() {
-  document
-    .querySelectorAll(".border")
-    .forEach((el) => (el.style.borderColor = "transparent"));
-}
-
 // @ts-ignore
 const iconMap = window.iconMap;
 
@@ -35,67 +29,9 @@ function drawNodeIcon(fontSize, color, label) {
   return icon;
 }
 
-function isOverlappingWithTopRightCorner(bordersTopRightPosition, topLeft) {
-  const marginOfError = 8;
-  return bordersTopRightPosition.some(([x, y]) => {
-    if (y === topLeft.y) {
-      return x + marginOfError >= topLeft.x;
-    }
-  });
-}
-
-function isEnoughAreaForBorders(
-  cy,
-  paddingX,
-  paddingY,
-  iconSize,
-  iconGap,
-  windowPadding
-) {
-  const windowWidth = window.innerWidth;
-  const windowHeight = window.innerHeight;
-
-  let areaNeededForAllNodes = 0;
-  let maxHeightNeededForBorder = 0;
-  let maxWidthNeededForBorder = 0;
-
-  cy.nodes().forEach((node) => {
-    const nodeW = node.renderedWidth();
-    const nodeH = node.renderedHeight();
-    const dimensions = getBorderWidthAndHeight(
-      paddingX,
-      nodeW,
-      paddingY,
-      nodeH,
-      iconSize,
-      iconGap
-    );
-    areaNeededForAllNodes += dimensions.width * dimensions.height;
-    maxHeightNeededForBorder = Math.max(
-      maxHeightNeededForBorder,
-      dimensions.height
-    );
-    maxWidthNeededForBorder = Math.max(
-      maxWidthNeededForBorder,
-      dimensions.width
-    );
-  });
-
-  const usableWidth = windowWidth - 2 * windowPadding;
-  const usableHeight = windowHeight - 2 * windowPadding;
-
-  const maxCols = Math.floor(usableWidth / maxWidthNeededForBorder);
-  const maxRows = Math.floor(usableHeight / maxHeightNeededForBorder);
-
-  const maxNodesThatCanFit = maxCols * maxRows;
-
-  return cy.nodes().length <= maxNodesThatCanFit;
-}
-
 export function drawBorderAndIconForEachExplainNode(
   cy,
-  windowPadding,
-  isVisible
+  windowPadding
 ) {
   const paddingX = 30;
   const paddingY = 10;
@@ -110,15 +46,6 @@ export function drawBorderAndIconForEachExplainNode(
     minIconSize = Math.min(minIconSize, iconSize);
   });
 
-  let shouldDrawBorders = isEnoughAreaForBorders(
-    cy,
-    paddingX,
-    paddingY,
-    minIconSize,
-    iconGap,
-    windowPadding
-  );
-  const bordersTopRightPosition = [];
 
   cy.nodes().forEach((node) => {
     const nodeW = node.renderedWidth();
@@ -156,22 +83,9 @@ export function drawBorderAndIconForEachExplainNode(
       justifyContent: "center",
       paddingTop: `${paddingY}px`,
       borderRadius: `${borderRadius}px`,
+      borderColor: "transparent"
     });
 
-    const overlappingWithTopRightCorner = isOverlappingWithTopRightCorner(
-      bordersTopRightPosition,
-      topLeft
-    );
-    if (overlappingWithTopRightCorner) {
-      shouldDrawBorders = false;
-      makeAllBordersTransparent();
-    }
-    bordersTopRightPosition.push([topLeft.x + dimensions.width, topLeft.y]);
-
-    if (!shouldDrawBorders || !isVisible) {
-      border.style.borderColor = "transparent";
-    }
-
     border.appendChild(drawNodeIcon(minIconSize, iconColor, node.data().label));
     document.body.appendChild(border);
   });

media/explain/explain.js

@@ -153,22 +153,12 @@ if (isWindowTooSmall(GRAPH_PADDING)) {
       });
     });
 
-    function isVisibleBorders() {
-      console.log(window.location.href);
-      const border = document.querySelector(".border");
-      if (border !== null) {
-        return border.style.borderColor !== "transparent";
-      }
-      return false;
-    }
-
     function redrawBorders() {
-      const showBorder = isVisibleBorders();
       deleteAllBorders();
-      drawBorderAndIconForEachExplainNode(cy, GRAPH_PADDING, showBorder);
+      drawBorderAndIconForEachExplainNode(cy, GRAPH_PADDING);
     }
 
     cy.on("pan zoom resize", redrawBorders);
-    drawBorderAndIconForEachExplainNode(cy, GRAPH_PADDING, true);
+    drawBorderAndIconForEachExplainNode(cy, GRAPH_PADDING);
   }
 }