0.2.2: Fixed input freakout bug, changed link lines to quadratics

README.md

@@ -12,6 +12,10 @@ To be decided, but at this moment this code is open source and free to use for n
 
 ## Changelog
 
+### 0.2.2
+* Fixed freaking out inputs on some input values
+* Quadratic CURVES!  Links now look MUCH nicer :)
+
 ### 0.2.1
 * Fixed input property constraints on elements
 * Added NOT gate

js/logicengine.js

@@ -287,12 +287,10 @@ class Element extends CanvasTools {
   drawInputs(ctx,x,y,borderColor = "#000",circleColorFalse = "#ff0000",circleColorTrue="#00ff00",circleColorHover = "#00ffff") {
     let old_strokeStyle = ctx.strokeStyle;
     let old_fillStyle = ctx.fillStyle;
-    if ((this.totalInputs() * ((this.inputCircleRadius*2)+4)) > (this.Height-2)) {
+    this.inputCircleRadius = 10;
-      this.inputCircleRadius = ((this.Height-(2 + this.totalInputs() * 4)) / this.totalInputs())/2;
+    if ((this.totalInputs() * Math.round((this.inputCircleRadius*2)+4)) >= (this.Height-2)) {
-    } else {
+      this.inputCircleRadius = Math.round((this.Height-Math.round(2 + this.totalInputs() * 4)) / this.totalInputs())/2;
-      this.inputCircleRadius = 10;
     }
-
     for (let a = 0; a < this.totalInputs();a++) {
       let mouseDist = length2D(x+20,y+(this.inputCircleRadius + 2)+(((a*(4+(this.inputCircleRadius*2))))-2)+(this.inputCircleRadius/2),this.MousePosition.x,this.MousePosition.y);
       ctx.beginPath();
@@ -332,11 +330,24 @@ class Element extends CanvasTools {
         this.OutputConnections.splice(a,1);
         a--;
       } else {
+        let startX = this.X + this.Width;
+        let startY = this.Y+(this.Height/2);
+        let endX = this.OutputConnections[a].Element.X;
+        let endY = this.OutputConnections[a].Element.Y+(this.OutputConnections[a].Element.inputCircleRadius + 2)+(((this.OutputConnections[a].Input*(4+(this.OutputConnections[a].Element.inputCircleRadius*2))))-2)+(this.OutputConnections[a].Element.inputCircleRadius/2);
+        let startMidX = startX + ((endX - startX)/2);
+        let startMidY = startY;
+        let midX = startMidX;
+        let midY = startY + ((endY - startY)/2);
+        let endMidX = startMidX;
+        let endMidY = endY;
+
         ctx.beginPath();
         ctx.lineWidth = settings.LinkWidth;
         ctx.setLineDash(settings.LinkDash);
-        ctx.moveTo((this.X + this.Width) - 20, this.Y + (this.Height / 2));
+        ctx.moveTo(startX, startY);
-        ctx.lineTo(this.OutputConnections[a].Element.X + 20, this.OutputConnections[a].Element.Y + 20);
+        //ctx.lineTo(endX, endY);
+        ctx.quadraticCurveTo(startMidX,startMidY,midX,midY);
+        ctx.quadraticCurveTo(endMidX,endMidY,endX,endY);
         ctx.strokeStyle = settings.ActiveConnectionColor;
         if (!this.getOutput()) ctx.strokeStyle = settings.InactiveConnectionColor;
         ctx.stroke();

js/main.js

@@ -2,7 +2,7 @@
     MatCat BrowserLogic Simulator
  */
 
-let Version = "0.2.1";
+let Version = "0.2.2";
 let spanVersion = document.getElementById("version");
 spanVersion.innerText = Version;
 // get the canvas and get the engine object going