Declutter utils

src/utils/calcPath.js

@@ -0,0 +1,112 @@
+const calcPath = (x1, x2, y1, y2, zoom = 1) => {
+  const tableWidth = 200 * zoom;
+  if (y1 <= y2) {
+    if (x1 + tableWidth <= x2) {
+      x2 -= 14;
+    } else if (x2 <= x1 + tableWidth && x1 <= x2) {
+      // x2-=14;
+      // x1-=14;
+    } else if (x2 + tableWidth >= x1 && x2 + tableWidth <= x1 + tableWidth) {
+      x1 -= 14;
+      x2 -= 14;
+    } else {
+      x2 -= 14;
+      x1 -= 14;
+    }
+  } else {
+    if (x1 + tableWidth <= x2) {
+      x2 -= 14;
+    } else if (x1 + tableWidth >= x2 && x1 + tableWidth <= x2 + tableWidth) {
+      //
+      x1 -= 14;
+      x2 -= 14;
+    } else if (x1 >= x2 && x1 <= x2 + tableWidth) {
+      // x1-=19;
+      // x2-=14;
+    } else {
+      x1 -= 14;
+      x2 -= 14;
+    }
+  }
+  x1 *= zoom;
+  x2 *= zoom;
+  y1 *= zoom;
+  y2 *= zoom;
+
+  let r = 10 * zoom;
+  const offsetX = 8 * zoom;
+  const midX = (x2 + x1 + tableWidth) / 2;
+  const endX = x2 + tableWidth < x1 ? x2 + tableWidth : x2;
+
+  if (Math.abs(y1 - y2) <= 36 * zoom) {
+    r = Math.abs(y2 - y1) / 3;
+    if (r <= 2) {
+      if (x1 + tableWidth <= x2)
+        return `M ${x1 + tableWidth - 2 * offsetX} ${y1} L ${x2} ${y2 + 0.1}`;
+      else if (x2 + tableWidth < x1)
+        return `M ${x1} ${y1} L ${x2 + tableWidth} ${y2 + 0.1}`;
+    }
+  }
+
+  if (y1 <= y2) {
+    if (x1 + tableWidth <= x2) {
+      return `M ${x1 + tableWidth - offsetX * 2} ${y1} L ${
+        midX - r
+      } ${y1} A ${r} ${r} 0 0 1 ${midX} ${y1 + r} L ${midX} ${
+        y2 - r
+      } A ${r} ${r} 0 0 0 ${midX + r} ${y2} L ${endX} ${y2}`;
+    } else if (x2 <= x1 + tableWidth && x1 <= x2) {
+      return `M ${x1 + tableWidth - 2 * offsetX} ${y1} L ${
+        x2 + tableWidth
+      } ${y1} A ${r} ${r} 0 0 1 ${x2 + tableWidth + r} ${y1 + r} L ${
+        x2 + tableWidth + r
+      } ${y2 - r} A ${r} ${r} 0 0 1 ${x2 + tableWidth} ${y2} L ${
+        x2 + tableWidth - 2 * offsetX
+      } ${y2}`;
+    } else if (x2 + tableWidth >= x1 && x2 + tableWidth <= x1 + tableWidth) {
+      return `M ${x1} ${y1} L ${x2 - r} ${y1} A ${r} ${r} 0 0 0 ${x2 - r - r} ${
+        y1 + r
+      } L ${x2 - r - r} ${y2 - r} A ${r} ${r} 0 0 0 ${
+        x2 - r
+      } ${y2} L ${x2} ${y2}`;
+    } else {
+      return `M ${x1} ${y1} L ${midX + r} ${y1} A ${r} ${r} 0 0 0 ${midX} ${
+        y1 + r
+      } L ${midX} ${y2 - r} A ${r} ${r} 0 0 1 ${
+        midX - r
+      } ${y2} L ${endX} ${y2}`;
+    }
+  } else {
+    if (x1 + tableWidth <= x2) {
+      return `M ${x1 + tableWidth - offsetX * 2} ${y1} L ${
+        midX - r
+      } ${y1} A ${r} ${r} 0 0 0 ${midX} ${y1 - r} L ${midX} ${
+        y2 + r
+      } A ${r} ${r} 0 0 1 ${midX + r} ${y2} L ${endX} ${y2}`;
+    } else if (x1 + tableWidth >= x2 && x1 + tableWidth <= x2 + tableWidth) {
+      return `M ${x1} ${y1} L ${x1 - r - r} ${y1} A ${r} ${r} 0 0 1 ${
+        x1 - r - r - r
+      } ${y1 - r} L ${x1 - r - r - r} ${y2 + r} A ${r} ${r} 0 0 1 ${
+        x1 - r - r
+      } ${y2} L ${endX} ${y2}`;
+    } else if (x1 >= x2 && x1 <= x2 + tableWidth) {
+      return `M ${x1 + tableWidth - 2 * offsetX} ${y1} L ${
+        x1 + tableWidth - 2 * offsetX + r
+      } ${y1} A ${r} ${r} 0 0 0 ${x1 + tableWidth - 2 * offsetX + r + r} ${
+        y1 - r
+      } L ${x1 + tableWidth - 2 * offsetX + r + r} ${
+        y2 + r
+      } A ${r} ${r} 0 0 0 ${x1 + tableWidth - 2 * offsetX + r} ${y2} L ${
+        x2 + tableWidth - 2 * offsetX
+      } ${y2}`;
+    } else {
+      return `M ${x1} ${y1} L ${midX + r} ${y1} A ${r} ${r} 0 0 1 ${midX} ${
+        y1 - r
+      } L ${midX} ${y2 + r} A ${r} ${r} 0 0 0 ${
+        midX - r
+      } ${y2} L ${endX} ${y2}`;
+    }
+  }
+};
+
+export { calcPath };

src/utils/fullscreen.js

@@ -0,0 +1,26 @@
+function enterFullscreen() {
+  const element = document.documentElement;
+  if (element.requestFullscreen) {
+    element.requestFullscreen();
+  } else if (element.mozRequestFullScreen) {
+    element.mozRequestFullScreen();
+  } else if (element.webkitRequestFullscreen) {
+    element.webkitRequestFullscreen();
+  } else if (element.msRequestFullscreen) {
+    element.msRequestFullscreen();
+  }
+}
+
+function exitFullscreen() {
+  if (document.exitFullscreen) {
+    document.exitFullscreen();
+  } else if (document.mozCancelFullScreen) {
+    document.mozCancelFullScreen();
+  } else if (document.webkitExitFullscreen) {
+    document.webkitExitFullscreen();
+  } else if (document.msExitFullscreen) {
+    document.msExitFullscreen();
+  }
+}
+
+export { enterFullscreen, exitFullscreen };

src/utils/toSQL.js

@@ -1,53 +1,5 @@
-import { Validator } from "jsonschema";
-import { ddbSchema, jsonSchema } from "../data/schemas";
 import { sqlDataTypes } from "../data/data";
 
-function enterFullscreen() {
-  const element = document.documentElement;
-  if (element.requestFullscreen) {
-    element.requestFullscreen();
-  } else if (element.mozRequestFullScreen) {
-    element.mozRequestFullScreen();
-  } else if (element.webkitRequestFullscreen) {
-    element.webkitRequestFullscreen();
-  } else if (element.msRequestFullscreen) {
-    element.msRequestFullscreen();
-  }
-}
-
-function exitFullscreen() {
-  if (document.exitFullscreen) {
-    document.exitFullscreen();
-  } else if (document.mozCancelFullScreen) {
-    document.mozCancelFullScreen();
-  } else if (document.webkitExitFullscreen) {
-    document.webkitExitFullscreen();
-  } else if (document.msExitFullscreen) {
-    document.msExitFullscreen();
-  }
-}
-
-function jsonDiagramIsValid(obj) {
-  return new Validator().validate(obj, jsonSchema).valid;
-}
-
-function ddbDiagramIsValid(obj) {
-  return new Validator().validate(obj, ddbSchema).valid;
-}
-
-function dataURItoBlob(dataUrl) {
-  const byteString = atob(dataUrl.split(",")[1]);
-  const mimeString = dataUrl.split(",")[0].split(":")[1].split(";")[0];
-  const arrayBuffer = new ArrayBuffer(byteString.length);
-  const intArray = new Uint8Array(arrayBuffer);
-
-  for (let i = 0; i < byteString.length; i++) {
-    intArray[i] = byteString.charCodeAt(i);
-  }
-
-  return new Blob([intArray], { type: mimeString });
-}
-
 function getJsonType(f) {
   if (!sqlDataTypes.includes(f.type)) {
     return '{ "type" : "object", additionalProperties : true }';
@@ -597,10 +549,6 @@ function jsonToSQLServer(obj) {
     .join("\n")}`;
 }
 
-function arrayIsEqual(arr1, arr2) {
-  return JSON.stringify(arr1) === JSON.stringify(arr2);
-}
-
 function isSized(type) {
   return ["CHAR", "VARCHAR", "BINARY", "VARBINARY", "TEXT"].includes(type);
 }
@@ -882,135 +830,15 @@ function validateDiagram(diagram) {
   return issues;
 }
 
-const calcPath = (x1, x2, y1, y2, startFieldId, endFieldId, zoom = 1) => {
-  const tableWidth = 200 * zoom;
-  if (y1 <= y2) {
-    if (x1 + tableWidth <= x2) {
-      x2 -= 14;
-    } else if (x2 <= x1 + tableWidth && x1 <= x2) {
-      // x2-=14;
-      // x1-=14;
-    } else if (x2 + tableWidth >= x1 && x2 + tableWidth <= x1 + tableWidth) {
-      x1 -= 14;
-      x2 -= 14;
-    } else {
-      x2 -= 14;
-      x1 -= 14;
-    }
-  } else {
-    if (x1 + tableWidth <= x2) {
-      x2 -= 14;
-    } else if (x1 + tableWidth >= x2 && x1 + tableWidth <= x2 + tableWidth) {
-      //
-      x1 -= 14;
-      x2 -= 14;
-    } else if (x1 >= x2 && x1 <= x2 + tableWidth) {
-      // x1-=19;
-      // x2-=14;
-    } else {
-      x1 -= 14;
-      x2 -= 14;
-    }
-  }
-  x1 *= zoom;
-  x2 *= zoom;
-  y1 *= zoom;
-  y2 *= zoom;
-
-  let r = 10 * zoom;
-  const offsetX = 8 * zoom;
-  const midX = (x2 + x1 + tableWidth) / 2;
-  const endX = x2 + tableWidth < x1 ? x2 + tableWidth : x2;
-  // const startTableY = y1 - startFieldId * 36 - 50 - 18;
-  // const endTableY = y2 - endFieldId * 36 - 50;
-
-  if (Math.abs(y1 - y2) <= 36 * zoom) {
-    r = Math.abs(y2 - y1) / 3;
-    if (r <= 2) {
-      if (x1 + tableWidth <= x2)
-        return `M ${x1 + tableWidth - 2 * offsetX} ${y1} L ${x2} ${y2 + 0.1}`;
-      else if (x2 + tableWidth < x1)
-        return `M ${x1} ${y1} L ${x2 + tableWidth} ${y2 + 0.1}`;
-    }
-  }
-
-  if (y1 <= y2) {
-    if (x1 + tableWidth <= x2) {
-      return `M ${x1 + tableWidth - offsetX * 2} ${y1} L ${
-        midX - r
-      } ${y1} A ${r} ${r} 0 0 1 ${midX} ${y1 + r} L ${midX} ${
-        y2 - r
-      } A ${r} ${r} 0 0 0 ${midX + r} ${y2} L ${endX} ${y2}`;
-    } else if (x2 <= x1 + tableWidth && x1 <= x2) {
-      return `M ${x1 + tableWidth - 2 * offsetX} ${y1} L ${
-        x2 + tableWidth
-      } ${y1} A ${r} ${r} 0 0 1 ${x2 + tableWidth + r} ${y1 + r} L ${
-        x2 + tableWidth + r
-      } ${y2 - r} A ${r} ${r} 0 0 1 ${x2 + tableWidth} ${y2} L ${
-        x2 + tableWidth - 2 * offsetX
-      } ${y2}`;
-    } else if (x2 + tableWidth >= x1 && x2 + tableWidth <= x1 + tableWidth) {
-      return `M ${x1} ${y1} L ${x2 - r} ${y1} A ${r} ${r} 0 0 0 ${x2 - r - r} ${
-        y1 + r
-      } L ${x2 - r - r} ${y2 - r} A ${r} ${r} 0 0 0 ${
-        x2 - r
-      } ${y2} L ${x2} ${y2}`;
-    } else {
-      return `M ${x1} ${y1} L ${midX + r} ${y1} A ${r} ${r} 0 0 0 ${midX} ${
-        y1 + r
-      } L ${midX} ${y2 - r} A ${r} ${r} 0 0 1 ${
-        midX - r
-      } ${y2} L ${endX} ${y2}`;
-    }
-  } else {
-    if (x1 + tableWidth <= x2) {
-      return `M ${x1 + tableWidth - offsetX * 2} ${y1} L ${
-        midX - r
-      } ${y1} A ${r} ${r} 0 0 0 ${midX} ${y1 - r} L ${midX} ${
-        y2 + r
-      } A ${r} ${r} 0 0 1 ${midX + r} ${y2} L ${endX} ${y2}`;
-    } else if (x1 + tableWidth >= x2 && x1 + tableWidth <= x2 + tableWidth) {
-      return `M ${x1} ${y1} L ${x1 - r - r} ${y1} A ${r} ${r} 0 0 1 ${
-        x1 - r - r - r
-      } ${y1 - r} L ${x1 - r - r - r} ${y2 + r} A ${r} ${r} 0 0 1 ${
-        x1 - r - r
-      } ${y2} L ${endX} ${y2}`;
-    } else if (x1 >= x2 && x1 <= x2 + tableWidth) {
-      return `M ${x1 + tableWidth - 2 * offsetX} ${y1} L ${
-        x1 + tableWidth - 2 * offsetX + r
-      } ${y1} A ${r} ${r} 0 0 0 ${x1 + tableWidth - 2 * offsetX + r + r} ${
-        y1 - r
-      } L ${x1 + tableWidth - 2 * offsetX + r + r} ${
-        y2 + r
-      } A ${r} ${r} 0 0 0 ${x1 + tableWidth - 2 * offsetX + r} ${y2} L ${
-        x2 + tableWidth - 2 * offsetX
-      } ${y2}`;
-    } else {
-      return `M ${x1} ${y1} L ${midX + r} ${y1} A ${r} ${r} 0 0 1 ${midX} ${
-        y1 - r
-      } L ${midX} ${y2 + r} A ${r} ${r} 0 0 0 ${
-        midX - r
-      } ${y2} L ${endX} ${y2}`;
-    }
-  }
-};
-
 export {
-  enterFullscreen,
-  exitFullscreen,
-  jsonDiagramIsValid,
-  ddbDiagramIsValid,
-  dataURItoBlob,
   jsonToMySQL,
   jsonToPostgreSQL,
   validateDiagram,
-  arrayIsEqual,
   isSized,
   getSize,
   hasPrecision,
   validateDateStr,
   hasCheck,
-  calcPath,
   jsonToSQLite,
   jsonToMariaDB,
   jsonToSQLServer,

src/utils/utils.js

@@ -0,0 +1,18 @@
+function dataURItoBlob(dataUrl) {
+  const byteString = atob(dataUrl.split(",")[1]);
+  const mimeString = dataUrl.split(",")[0].split(":")[1].split(";")[0];
+  const arrayBuffer = new ArrayBuffer(byteString.length);
+  const intArray = new Uint8Array(arrayBuffer);
+
+  for (let i = 0; i < byteString.length; i++) {
+    intArray[i] = byteString.charCodeAt(i);
+  }
+
+  return new Blob([intArray], { type: mimeString });
+}
+
+function arrayIsEqual(arr1, arr2) {
+  return JSON.stringify(arr1) === JSON.stringify(arr2);
+}
+
+export { dataURItoBlob, arrayIsEqual };

src/utils/validateSchema.js

@@ -0,0 +1,12 @@
+import { Validator } from "jsonschema";
+import { ddbSchema, jsonSchema } from "../data/schemas";
+
+function jsonDiagramIsValid(obj) {
+  return new Validator().validate(obj, jsonSchema).valid;
+}
+
+function ddbDiagramIsValid(obj) {
+  return new Validator().validate(obj, ddbSchema).valid;
+}
+
+export { jsonDiagramIsValid, ddbDiagramIsValid };