Fixed all errors

lovettbarron · Jul 5, 2024 · 5c987a8 · 5c987a8
1 parent a30f606
commit 5c987a8
Show file tree

Hide file tree

Showing 3 changed files with 25 additions and 41 deletions.
diff --git a/src/embed.ts b/src/embed.ts
@@ -8,17 +8,6 @@ import type { GenericNode } from "@trbn/jsoncanvas"
 // import { applyDefaults, Options } from "./options";
 import { getCanvasFromEmbed } from "./plugin"
 
-const imagesLoaded = [] as Array<any>
-
-export function checkImagesLoaded(callback: Function) {
-  const allLoaded = imagesLoaded.every((el) => el.complete)
-  console.group("Images loading", imagesLoaded, allLoaded)
-  if (imagesLoaded.length < 1) return callback()
-  //   return callback();
-  if (allLoaded) callback()
-  else checkImagesLoaded(callback)
-}
-
 // This renders out the images
 export async function drawEmbedded(
   svg: Element,
@@ -28,8 +17,8 @@ export async function drawEmbedded(
   if (node.type === "file" && svg) {
     if (node.file.match(/\.(jpg|jpeg|png|gif)$/i)) {
       const image = s("image", {
-        x: 5 + node.x + <number>svg.properties!.renWidth / 2,
-        y: 5 + node.y + <number>svg.properties!.renHeight / 2,
+        x: 5 + node.x + <number>svg.properties.renWidth / 2,
+        y: 5 + node.y + <number>svg.properties.renHeight / 2,
         width: node.width - 10,
         height: node.height - 10,
         "xlink:href": node.file,
@@ -55,8 +44,8 @@ export async function drawMarkdownEmbed(
 
       // Ref: https://stackoverflow.com/questions/45518545/svg-foreignobject-not-showing-on-any-browser-why
       const embed = s("foreignObject", {
-        x: 5 + node.x + <number>svg.properties!.renWidth / 2,
-        y: 5 + node.y + <number>svg.properties!.renHeight / 2,
+        x: 5 + node.x + <number>svg.properties.renWidth / 2,
+        y: 5 + node.y + <number>svg.properties.renHeight / 2,
         width: node.width - 10,
         height: node.height - 10,
       })

diff --git a/src/jsoncanvas.ts b/src/jsoncanvas.ts
@@ -5,20 +5,20 @@ import type { Edge, GenericNode, JSONCanvas } from "@trbn/jsoncanvas"
 
 import { type Options, applyDefaults } from "./options"
 
-import { checkImagesLoaded, drawEmbedded, drawMarkdownEmbed } from "./embed"
+import { drawEmbedded, drawMarkdownEmbed } from "./embed"
 
 function calculateMinimumCanvasSize(canvas: JSONCanvas) {
-  let minX = Number.POSITIVE_INFINITY,
-    minY = Number.POSITIVE_INFINITY,
-    maxX = Number.NEGATIVE_INFINITY,
-    maxY = Number.NEGATIVE_INFINITY
+  let minX = Number.POSITIVE_INFINITY
+  let minY = Number.POSITIVE_INFINITY
+  let maxX = Number.NEGATIVE_INFINITY
+  let maxY = Number.NEGATIVE_INFINITY
 
-  canvas.getNodes().forEach((node) => {
+  for (const node in canvas.getNodes()) {
     minX = Math.min(minX, node.x)
     minY = Math.min(minY, node.y)
     maxX = Math.max(maxX, node.x + node.width)
     maxY = Math.max(maxY, node.y + node.height)
-  })
+  }
 
   const canvasWidth = maxX - minX
   const canvasHeight = maxY - minY
@@ -47,19 +47,19 @@ export function render(
   if (svg === null) return null
 
   // Draw nodes
-  jsc.getNodes().forEach((node) => {
+  for (const node in jsc.getNodes()) {
     drawNode(svg, node, options)
-  })
+  }
 
   // Draw Edges
-  jsc.getEdges().forEach((edge) => {
+  for (const edge in jsc.getEdges()) {
     const fromNode = jsc.getNodes().find((node) => node.id === edge.fromNode)
     const toNode = jsc.getNodes().find((node) => node.id === edge.toNode)
     if (toNode !== undefined && fromNode !== undefined)
       drawEdge(svg, toNode, fromNode, edge, options)
-  })
+  }
 
-  return checkImagesLoaded(() => renderToBuffer(svg))
+  return renderToBuffer(svg)
 }
 
 function renderToBuffer(svg: Element, config?: Partial<Options>): Element {
@@ -197,7 +197,7 @@ function drawEdge(
   config?: Partial<Options>,
 ) {
   const options = applyDefaults(config)
-  if (svg === null || svg == undefined) return
+  if (svg === null || svg === undefined) return
 
   const cWidth = <number>svg.properties.renWidth || (1 as number)
   const cHeight = <number>svg.properties.renHeight || (1 as number)

diff --git a/src/plugin.ts b/src/plugin.ts
@@ -1,5 +1,5 @@
-import fs from "fs"
-import path from "path"
+import fs from "node:fs"
+import path from "node:path"
 import JSONCanvas from "@trbn/jsoncanvas"
 import type { Element, Root } from "hast"
 import { h } from "hastscript"
@@ -53,28 +53,21 @@ export const rehypeJsonCanvas: Plugin<[], Root> = () => {
 
       const jsonCanvasFromString = JSONCanvas.fromString(canvasMarkdown)
 
-      let canvas
+      let canvas = null
 
       if (validate(jsonCanvasFromString)) {
         canvas = render(jsonCanvasFromString, {})
       } else {
         canvas = h("div", "<div>Not a properly formatted JsonCanvas</div>")
       }
 
-      console.log(canvas)
-
-      // const canvasHast = fromHtmlIsomorphic(
-      //   `<img alt='' src='${canvas}' style='width:100%' />`,
-      //   {
-      //     fragment: true,
-      //   }
-      // );
+      if (!canvas) return
       node.properties = {
         ...node.properties,
       }
       node.tagName = "div"
       node.children = []
-      node.children.push(canvas!) //canvasHast.children as ElementContent[];
+      node.children.push(canvas)
     }
   }
 }
@@ -90,7 +83,9 @@ export async function getCanvasFromEmbed(
   if (webcheck.startsWith("https://") || typeof window !== "undefined") {
     await fetch(markdownPath)
       .then((res) => res.text())
-      .then((text) => (canvasMarkdown = text))
+      .then((text) => {
+        canvasMarkdown = text
+      })
   } else {
     // To accomodate ssr
     const ssrPath = options.assetPath