0.4.2 Added hex keypad

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.4.2
+
+* Added Hex keypad with 4 bit output, also has 3 function keys
+
 ### 0.4.1
 
 * Fixed a signal propogation bug with IC's

js/elements.js

@@ -301,7 +301,6 @@ class Element extends CanvasTools {
     for (let a = 0; a < this.OutputConnections.length; a++) {
       if (this.OutputConnections[a].Element == element && this.OutputConnections[a].Input == input) {
         // Already existing link, we will remove it instead
-        console.log("Removing link");
         this.LogicEngine.RecursionCount = 0;
         element.setInput(input,false);
         this.OutputConnections.splice(a,1);
@@ -407,9 +406,7 @@ class Element extends CanvasTools {
 
   setConnections() {
     for (let a = 0; a < this.OutputConnections.length;a++) {
-      //console.log(this.Designator + " sending " + this.getOutput() + " to " + this.OutputConnections[a].Element.Designator + " I" + this.OutputConnections[a].Input);
       this.LogicEngine.RecursionCount++;
-      //console.log("Recursion: " + this.LogicEngine.RecursionCount);
       if (this.LogicEngine.RecursionCount > 1000) {
         if (!this.LogicEngine.RecursionError) {
           console.log("RECURSION ERROR");
@@ -551,7 +548,6 @@ class ICInput extends Element {
 
     if (value === false) this.Input = false;
     if (value !== false) this.Input = true;
-    console.log(this.Designator + " setInput " + this.Input + " = " + value);
     this.Inputs[0] = this.Input;
 
     if (!this.Task.Enabled) {
@@ -632,9 +628,7 @@ class ICOutput extends Element {
 
   setInput(notused = 0,value) {
     if (notused > 0) return;
-    console.log(this.Designator + " setInput " + notused + " = " + value);
     value = this._Container.isHigh(this,0);
-    console.log("Actual " + value);
     if (value === false) this.Input = false;
     if (value !== false) this.Input = true;
     this.Inputs[0] = this.Input;
@@ -649,11 +643,8 @@ class ICOutput extends Element {
     this.Output = this.Input;
     this.Task.Enabled = false;
     this.Task.LastCall = 0;
-    //console.log(this);
     for (let a = 0; a < this.OutputConnections.length; a++) {
       this.LogicEngine.RecursionCount = 0;
-      console.log(this.Designator + " clockTick: Set " + this.OutputConnections[a].Element.Designator + " I[" + this.OutputConnections[a].Input + "] = " + this.getOutput());
-      console.log(this._Container);
       this.OutputConnections[a].Element.setInput(this.OutputConnections[a].Input, this.getOutput());
     }
   }
@@ -775,12 +766,8 @@ class ICElement extends Element {
   setInput(Input, Value) {
     if (this.InputConnections.length >= Input) {
       // No need to worry about recursion as this goes to an input element which is buffered
-      //console.log(this.Designator + " setInput " + Input + " = " + Value);
       Value = this._Container.isHigh(this,Input);
       this.Inputs[Input] = (Value === false) ? false : true;
-      //console.log("Actual: " + this.Inputs[Input]);
-      //console.log("Calling " + this.InputConnections[Input].toElement.Designator);
-      //console.log("Setting " + this.InputConnections[Input].toElement.Designator);
       this.InputConnections[Input].toElement.setInput(0,Value);
     }
     return false;
@@ -816,7 +803,6 @@ class ICElement extends Element {
       ctx.arc(x+10,firstY + (a*24),this.inputCircleRadius,0,2*Math.PI);
       ctx.strokeStyle = borderColor;
       ctx.fillStyle = circleColorFalse;
-      //console.log(this.Designator + ": I[" + a + "]: " + this.Inputs[a]);
       if (this.Inputs[a]) ctx.fillStyle = circleColorTrue;
       if ((mouseDist <= (this.inputCircleRadius)) && this.LogicEngine.ActiveLink) ctx.fillStyle = circleColorHover;
       ctx.fill();
@@ -876,7 +862,7 @@ class ClockElement extends Element {
   }
 
   setInput(Input, Value) {
-    console.log(this.Designator + " got told to set " + Input + " to value " + Value);
+
     super.setInput(Input, Value);
 
     if (!this.Inputs[0]) {
@@ -1230,7 +1216,7 @@ class output4bitDisplay extends Element {
     this.Width = 100;
     this.Height = 100;
     this.Inputs = [0,0,0,0];
-    this.InputLabels = ["3","2","1","0"];
+    this.InputLabels = ["I0","I1","I2","I3"];
     this.Type = 0;
     this.removeProperty("Inputs");
     let typeProperty = new ElementProperty("Type","list",{CBObject: this,CBFunction: "setType"},0,0,[{Value: "0", String: "Hex"},{Value: "1", String: "Decimal"},{Value: "2", String: "BCD"}],0,0);
@@ -1238,7 +1224,6 @@ class output4bitDisplay extends Element {
 
     if (RestoreData) {
       if (RestoreData.Properties.length > 0) {
-        console.log(RestoreData);
         this.Properties[0].CurrentValue = RestoreData.Properties[0].CurrentValue;
         this.Properties[0].Values = RestoreData.Properties[0].Values;
         this.setType(this.Properties[0].CurrentValue);
@@ -1265,7 +1250,7 @@ class output4bitDisplay extends Element {
   setInput(Input, Value) {
     Value = this._Container.isHigh(this,Input);
     this.Inputs[Input] = (Value !== false) ? 1 : 0;
-    let outchar = (this.Inputs[0] << 3) + (this.Inputs[1] << 2) + (this.Inputs[2] << 1) + (this.Inputs[3]);
+    let outchar = (this.Inputs[3] << 3) + (this.Inputs[2] << 2) + (this.Inputs[1] << 1) + (this.Inputs[0]);
 
     this.OutputChar = (outchar);
     switch (outchar) {
@@ -1336,6 +1321,8 @@ class inputElement extends Element {
   }
 }
 
+
+
 class InputSwitch extends inputElement {
   constructor(_Container, RestoreData = null, logicengine) {
     super(_Container, RestoreData,logicengine);
@@ -1419,6 +1406,94 @@ let ElementCatalog_BUTTON = new ElementCatalog_Element("Button","The button only
 ElementReferenceTable.push(ElementCatalog_BUTTON);
 ElementCategory_Inputs.addElement(ElementCatalog_BUTTON);
 
+class InputKeypad extends inputElement {
+  constructor(_Container, RestoreData = null, logicengine) {
+    super(_Container, RestoreData, logicengine);
+    this.Name = "Keypad";
+    this.Height = 210;
+    this.Width = 200;
+    this.Outputs = new Array(7);
+    this.OutputLabels = new Array("O0","O1","O2","O3","F1","F2","F3");
+    this.ButtonRows = 5;
+    this.ButtonColumns = 4;
+    this.Buttons = new Array(
+      {x: 0, y: 0,Value: 7,  Text: "7"}, {x: 1, y: 0,Value: 8,  Text: "8"}, {x: 2, y: 0,Value: 9, Text: "9"}, {x: 3, y: 0,Value: 16,  Text: "F1"},
+           {x: 0, y: 1,Value: 4,  Text: "4"}, {x: 1, y: 1,Value: 5,  Text: "5"}, {x: 2, y: 1,Value: 6,  Text: "6"}, {x: 3, y: 1,Value: 32,  Text: "F2"},
+           {x: 0, y: 2,Value: 1,  Text: "1"}, {x: 1, y: 2,Value: 2,  Text: "2"}, {x: 2, y: 2,Value: 3,  Text: "3"}, {x: 3, y: 2,Value: 64,  Text: "F3"},
+           {x: 0, y: 3,Value: 10, Text: "A"}, {x: 1, y: 3,Value: 0,  Text: "0"}, {x: 2, y: 3,Value: 11, Text: "B"}, {x: 3, y: 3,Value: 128, Text: "Clr"},
+           {x: 0, y: 1,Value: 12, Text: "C"}, {x: 1, y: 1,Value: 13, Text: "D"}, {x: 2, y: 1,Value: 14, Text: "E"}, {x: 3, y: 1,Value: 15,  Text: "F"}
+    );
+
+    if (RestoreData) {
+      if (RestoreData.OutputValues) {
+        this.Outputs = RestoreData.OutputValues;
+      }
+    }
+  }
+
+  toJSON(key) {
+    let superjson =  super.toJSON(key);
+    superjson.OutputValues = this.Outputs;
+    return superjson;
+  }
+
+  MouseClick(mousePos) {
+    mousePos = this.LogicEngine.getCanvasMousePos(mousePos);
+    super.MouseClick(mousePos);
+    let buttonWidth = 34;
+    let buttonHeight = 34;
+    let x = this.X;
+    let y = this.Y;
+
+    for (let pY = 0; pY < this.ButtonRows; pY++) {
+      for (let pX = 0; pX < this.ButtonColumns; pX++) {
+
+        if ((mousePos.x >= (x + (5*(pX+1))+(buttonWidth*pX))) && (mousePos.x <= ((x + (5*(pX+1))+(buttonWidth*pX)) + buttonWidth)) && (mousePos.y >= (y + (5*(pY+1))+(buttonHeight*pY))) && (mousePos.y <= ((y + (5*(pY+1))+(buttonHeight*pY))+buttonHeight))) {
+          let button = this.Buttons[(pY*this.ButtonColumns) + pX];
+          if (button.Value & 0b0000001) this.Outputs[0] = true; else this.Outputs[0] = false;
+          if (button.Value & 0b0000010) this.Outputs[1] = true; else this.Outputs[1] = false;
+          if (button.Value & 0b0000100) this.Outputs[2] = true; else this.Outputs[2] = false;
+          if (button.Value & 0b0001000) this.Outputs[3] = true; else this.Outputs[3] = false;
+          if (button.Value & 0b0010000) this.Outputs[4] = true;
+          if (button.Value & 0b0100000) this.Outputs[5] = true;
+          if (button.Value & 0b1000000) this.Outputs[6] = true;
+          if (button.Value & 0b10000000) for (let a = 0; a < this.Outputs.length; a++) {this.Outputs[a] = false;}
+          for (let a = 0; a < this.OutputConnections.length; a++) {
+            this.LogicEngine.RecursionCount = 0;
+            this.OutputConnections[a].Element.setInput(this.OutputConnections[a].Input, this.getOutput(this.OutputConnections[a].Output));
+          }
+        }
+      }
+    }
+  }
+
+  getOutput(Output = 0) {
+    return (this.Outputs[Output]) ? true : false;
+  }
+
+  drawElement(x, y, ctx) {
+    let buttonWidth = 34;
+    let buttonHeight = 34;
+
+    this.drawBorderBox(ctx, x,y,this.Width-20,this.Height,1,"#000","#f7e979",this.LogicEngine.Settings.ShadowColor);
+
+    for (let pY = 0; pY < this.ButtonRows; pY++) {
+      for (let pX = 0; pX < this.ButtonColumns; pX++) {
+        this.drawBorderBox(ctx, x + (5*(pX+1))+(buttonWidth*pX), y + (5*(pY+1))+(buttonHeight*pY), buttonWidth, buttonHeight, 1, "#ccc", "#777");
+        this.drawTextCentered(ctx,x + (5*(pX+1))+(buttonWidth*pX), y + (5*(pY+1))+(buttonHeight*pY), buttonWidth, buttonHeight, this.Buttons[(pY*this.ButtonColumns) + pX].Text,"16px Console",  "#fff");
+
+      }
+    }
+
+    this.drawTextCentered(ctx,x,y+(this.Height-14),this.Width-(this.outputCircleRadius*2),12,this.Designator,"12px Console","#000");
+    this.drawOutputs(ctx,x,y);
+  }
+}
+let ElementCatalog_Keypad = new ElementCatalog_Element("Keypad","A hex entry keypad with 4 bit output","[][]",InputKeypad,[]);
+ElementReferenceTable.push(ElementCatalog_Keypad);
+ElementCategory_Inputs.addElement(ElementCatalog_Keypad);
+
+
 class FlipFlopJK extends Element {
   constructor(_Container, RestoreData = null, logicengine) {
     super(_Container, RestoreData,logicengine,3);

js/main.js

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