Cleaned up code formatting and removed 'Random' node TODOs

scar17off · scar17off · commit 952881b7d651 · 2024-10-30T01:21:58.000+02:00
diff --git a/TODO.md b/TODO.md
@@ -10,9 +10,4 @@
 - [ ] Node labeling
 
 - [ ] Add new node types:
-  - [ ] Switch
-  - [ ] Random
-    - [ ] Types:
-      - [ ] Number (with properties: min: 1, max: 100)
-      - [ ] String (with properties: length: 10, charset: abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789)
-      - [ ] Boolean (with properties: probability: 50)
+  - [ ] Switch
diff --git a/src/VisualScripting.js b/src/VisualScripting.js
@@ -238,21 +238,21 @@ const VisualScripting = () => {
       // Check input ports
       for (let i = 0; i < nodeType.inputs.length; i++) {
         const portX = node.x - PORT_OFFSET - PORT_WIDTH; // Position of gray arrow
-        const portY = node.y + portStartY + i * 20 - PORT_HEIGHT/2;
-        
+        const portY = node.y + portStartY + i * 20 - PORT_HEIGHT / 2;
+
         if (x >= portX && x <= portX + PORT_WIDTH * SCALE_MULTIPLIER &&
-            y >= portY && y <= portY + PORT_HEIGHT * SCALE_MULTIPLIER) {
+          y >= portY && y <= portY + PORT_HEIGHT * SCALE_MULTIPLIER) {
           return { nodeId: node.id, isInput: true, index: i };
         }
       }
 
       // Check output ports
       for (let i = 0; i < nodeType.outputs.length; i++) {
         const portX = node.x + width + PORT_OFFSET; // Position of gray arrow
-        const portY = node.y + portStartY + i * 20 - PORT_HEIGHT/2;
-        
+        const portY = node.y + portStartY + i * 20 - PORT_HEIGHT / 2;
+
         if (x >= portX && x <= portX + PORT_WIDTH * SCALE_MULTIPLIER &&
-            y >= portY && y <= portY + PORT_HEIGHT * SCALE_MULTIPLIER) {
+          y >= portY && y <= portY + PORT_HEIGHT * SCALE_MULTIPLIER) {
           return { nodeId: node.id, isInput: false, index: i };
         }
       }
@@ -566,12 +566,12 @@ const VisualScripting = () => {
       const newConfig = { ...prevConfig };
       const parts = path.split('.');
       let current = newConfig;
-      
+
       for (let i = 0; i < parts.length - 1; i++) {
         current[parts[i]] = { ...current[parts[i]] };
         current = current[parts[i]];
       }
-      
+
       current[parts[parts.length - 1]] = value;
       return newConfig;
     });
diff --git a/src/components/GraphInspector.js b/src/components/GraphInspector.js
@@ -2,11 +2,11 @@ import React from 'react';
 import styles from './GraphInspector.module.css';
 import { getIconForNodeType } from './ContextMenu';
 
-const GraphInspector = ({ 
-  selectedNodes, 
-  nodeTypes, 
-  updateNodeProperty, 
-  config 
+const GraphInspector = ({
+  selectedNodes,
+  nodeTypes,
+  updateNodeProperty,
+  config
 }) => {
   if (selectedNodes.length === 0) {
     return (
@@ -33,7 +33,7 @@ const GraphInspector = ({
       {/* Header */}
       <div className={`${styles.header} ${config.isDarkTheme ? styles.headerDark : styles.headerLight}`}>
         <div className={styles.headerContent}>
-          <i 
+          <i
             className={`fas ${getIconForNodeType(node.type)} ${styles.nodeIcon}`}
             style={{ color: nodeType.color }}
           />
@@ -87,7 +87,7 @@ const GraphInspector = ({
       )}
 
       <hr></hr>
-      
+
       {/* Ports */}
       <div className={styles.section}>
         {/* Input Ports */}
@@ -104,7 +104,7 @@ const GraphInspector = ({
 
         {/* Output Ports */}
         <div className={`${styles.sectionTitle} ${config.isDarkTheme ? styles.sectionTitleDark : styles.sectionTitleLight}`}
-             style={{ marginTop: '20px' }}>
+          style={{ marginTop: '20px' }}>
           Output Ports
         </div>
         {nodeType.outputs.map((output, index) => (
diff --git a/src/engine/Renderer.js b/src/engine/Renderer.js
@@ -55,9 +55,9 @@ class Renderer {
     const inputsHeight = nodeType.inputs.length * 20;
     const outputsHeight = nodeType.outputs.length * 20;
     const propertiesHeight = nodeType.properties ? nodeType.properties.reduce((height, prop) => {
-      const isVisible = prop.visible === undefined || 
-        (typeof prop.visible === 'function' ? 
-          prop.visible(node.properties) : 
+      const isVisible = prop.visible === undefined ||
+        (typeof prop.visible === 'function' ?
+          prop.visible(node.properties) :
           prop.visible);
       return height + (isVisible ? 20 : 0);
     }, 0) : 0;
@@ -117,17 +117,17 @@ class Renderer {
     edges.forEach(edge => {
       const startNode = nodes.find(n => n.id === edge.start.nodeId);
       const endNode = nodes.find(n => n.id === edge.end.nodeId);
-      
+
       if (!startNode || !endNode) return;
 
       // Quick bounds check for edge endpoints
       const startDims = this.getNodeDimensions(startNode, ctx);
       const endDims = this.getNodeDimensions(endNode, ctx);
-      
+
       // Skip if both nodes are completely outside view (with padding)
       const padding = 200; // Larger padding for edges due to curves
       if (!this.isRectInView(startNode.x, startNode.y, startDims.width, startDims.height, ctx.canvas.width, ctx.canvas.height, padding) &&
-          !this.isRectInView(endNode.x, endNode.y, endDims.width, endDims.height, ctx.canvas.width, ctx.canvas.height, padding)) {
+        !this.isRectInView(endNode.x, endNode.y, endDims.width, endDims.height, ctx.canvas.width, ctx.canvas.height, padding)) {
         return;
       }
 
@@ -173,7 +173,7 @@ class Renderer {
   drawPortIcon(ctx, x, y, isInput) {
     const offset = 5; // Distance from node border
     const arrowX = isInput ? x - offset : x + offset;
-    
+
     ctx.beginPath();
     if (isInput) {
       ctx.moveTo(arrowX - 6, y - 5);
@@ -193,7 +193,7 @@ class Renderer {
   drawLabelArrow(ctx, x, y, isControl) {
     if (isControl) {
       const lineLength = 10;
-      
+
       // Draw line
       ctx.beginPath();
       ctx.moveTo(x, y);
@@ -222,7 +222,7 @@ class Renderer {
   drawNodes(ctx, nodes, edges, selectedNodes) {
     nodes.forEach(node => {
       const { width, height } = this.getNodeDimensions(node, ctx);
-      
+
       if (!this.isRectInView(node.x, node.y, width, height, ctx.canvas.width, ctx.canvas.height)) {
         return;
       }
@@ -276,18 +276,18 @@ class Renderer {
       nodeType.inputs.forEach((input, i) => {
         const portY = node.y + currentHeight + i * 20;
         const isControl = input.type === 'control';
-        
+
         // Check if port is connected
-        const isPortConnected = edges.some(edge => 
-          edge.end.nodeId === node.id && 
-          edge.end.index === i && 
+        const isPortConnected = edges.some(edge =>
+          edge.end.nodeId === node.id &&
+          edge.end.index === i &&
           edge.end.isInput
         );
-        
+
         if (!isPortConnected) {
           this.drawPortIcon(ctx, node.x, portY, true);
         }
-        
+
         this.drawLabelArrow(ctx, node.x + 15, portY, isControl);
         ctx.fillStyle = 'white';
         ctx.fillText(input.name, node.x + 35, portY + 5);
@@ -297,17 +297,17 @@ class Renderer {
       nodeType.outputs.forEach((output, i) => {
         const portY = node.y + currentHeight + i * 20;
         const isControl = output.type === 'control';
-        
-        const isPortConnected = edges.some(edge => 
-          edge.start.nodeId === node.id && 
-          edge.start.index === i && 
+
+        const isPortConnected = edges.some(edge =>
+          edge.start.nodeId === node.id &&
+          edge.start.index === i &&
           !edge.start.isInput
         );
-        
+
         if (!isPortConnected) {
           this.drawPortIcon(ctx, node.x + width, portY, false);
         }
-        
+
         ctx.fillStyle = 'white';
         const textWidth = ctx.measureText(output.name).width;
         ctx.fillText(output.name, node.x + width - textWidth - 35, portY + 5);
@@ -323,9 +323,9 @@ class Renderer {
 
         nodeType.properties.forEach((prop, index) => {
           // Check if property should be visible
-          const isVisible = prop.visible === undefined || 
-            (typeof prop.visible === 'function' ? 
-              prop.visible(node.properties) : 
+          const isVisible = prop.visible === undefined ||
+            (typeof prop.visible === 'function' ?
+              prop.visible(node.properties) :
               prop.visible);
 
           if (isVisible) {
@@ -384,9 +384,9 @@ class Renderer {
     };
 
     return !(x + width < viewBounds.left - padding ||
-             x > viewBounds.right + padding ||
-             y + height < viewBounds.top - padding ||
-             y > viewBounds.bottom + padding);
+      x > viewBounds.right + padding ||
+      y + height < viewBounds.top - padding ||
+      y > viewBounds.bottom + padding);
   }
 }
 
diff --git a/src/nodeDefinitions.js b/src/nodeDefinitions.js
@@ -242,40 +242,40 @@ export const nodeTypes = {
     ],
     description: 'Generates random values of different types',
     properties: [
-      { 
-        name: 'type', 
-        type: 'select', 
-        options: ['number', 'string', 'boolean'], 
+      {
+        name: 'type',
+        type: 'select',
+        options: ['number', 'string', 'boolean'],
         default: 'number',
-        visible: true 
+        visible: true
       },
-      { 
-        name: 'min', 
-        type: 'number', 
+      {
+        name: 'min',
+        type: 'number',
         default: 1,
         visible: (props) => props.type === 'number'
       },
-      { 
-        name: 'max', 
-        type: 'number', 
+      {
+        name: 'max',
+        type: 'number',
         default: 100,
         visible: (props) => props.type === 'number'
       },
-      { 
-        name: 'length', 
-        type: 'number', 
+      {
+        name: 'length',
+        type: 'number',
         default: 10,
         visible: (props) => props.type === 'string'
       },
-      { 
-        name: 'charset', 
-        type: 'string', 
+      {
+        name: 'charset',
+        type: 'string',
         default: 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789',
         visible: (props) => props.type === 'string'
       },
-      { 
-        name: 'probability', 
-        type: 'number', 
+      {
+        name: 'probability',
+        type: 'number',
         default: 50,
         visible: (props) => props.type === 'boolean'
       }
