diff --git a/README.md b/README.md index 0704893..e9c5677 100644 --- a/README.md +++ b/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.3.8 + +* Added labels! You can specify the text, size, and color + ### 0.3.7 * Added 4 bit display! Currently shows hex format diff --git a/js/baseclasses.js b/js/baseclasses.js index 1122b7c..652a867 100644 --- a/js/baseclasses.js +++ b/js/baseclasses.js @@ -177,6 +177,9 @@ class elementContainer { case "string": contentString += ''; break; + case "color": + contentString += ''; + break; } contentString += ""; } diff --git a/js/elements.js b/js/elements.js index c485dc4..511d739 100644 --- a/js/elements.js +++ b/js/elements.js @@ -6,12 +6,14 @@ let ElementCategory_LOGIC = new ElementCatalog_Category("Logic" ,""); let ElementCategory_FlipFlop = new ElementCatalog_Category("Flip-Flops" ,""); let ElementCategory_Timing = new ElementCatalog_Category("Timing" ,""); let ElementCategory_ICs = new ElementCatalog_Category("ICs" ,""); +let ElementCategory_Other = new ElementCatalog_Category("Other" ,""); let elementCatalog = new ElementCatalog([ElementCategory_Inputs, ElementCategory_Outputs, ElementCategory_LOGIC, ElementCategory_FlipFlop, ElementCategory_Timing, - ElementCategory_ICs]); + ElementCategory_ICs, + ElementCategory_Other]); class ElementProperty { constructor(name,type,callback,defaultValue,currentValue = false,values=false,min=0,max=12) { /* @@ -396,6 +398,57 @@ class Element extends CanvasTools { } +class LabelElement extends Element { + constructor(RestoreData = null,logicengine) { + super(RestoreData,logicengine,0); + this.removeProperty("Inputs"); + this.Name = "Label"; + this.Font = "48px Console"; + this.FontStyle = "black"; + this.Label = this.Name; + let LabelProperty = new ElementProperty("Label","string",{CBObject: this,CBFunction: "setLabel"},"Label","Label",false,1,255); + this.Properties.push(LabelProperty); + let LabelSize = new ElementProperty("Size","int",{CBObject: this,CBFunction: "setSize"},"48","48",false,6,99999); + this.Properties.push(LabelSize); + let LabelColor = new ElementProperty("Color","color",{CBObject: this,CBFunction: "setColor"},"#000000","#000000",false,0,0); + this.Properties.push(LabelColor); + + if (RestoreData) { + this.Label = RestoreData.Properties[0].CurrentValue; + this.Font = RestoreData.Properties[1].CurrentValue + "px Console"; + this.FontStyle = RestoreData.Properties[2].CurrentValue; + } + + let textWidth = this.textSize(logicengine.Ctx,this.Label,this.Font); + this.Width = textWidth.width; + this.Height = textWidth.height; + + } + setLabel(label) { + this.Label = label; + this.Properties[0].CurrentValue = label; + } + setSize(size) { + this.Font = size + "px Console"; + this.Properties[1].CurrentValue = size; + } + + setColor(color) { + this.FontStyle = color; + this.Properties[2].CurrentValue = color; + } + drawElement(x, y, ctx) { + let textWidth = this.textSize(ctx,this.Label,this.Font); + this.Width = textWidth.width; + this.Height = textWidth.height; + this.drawTextCentered(ctx,x,y,textWidth.width,textWidth.height,this.Label,this.Font,this.FontStyle); + } +} +let ElementCatalog_Label = new ElementCatalog_Element("Label","Allows you to place a label","abc",LabelElement,[]); +ElementReferenceTable.push(ElementCatalog_Label); +ElementCategory_Other.addElement(ElementCatalog_Label); + + class ICInput extends Element { setPinName(pinname) { // Dont actually need it to do anything diff --git a/js/main.js b/js/main.js index a6ffbb8..f530191 100644 --- a/js/main.js +++ b/js/main.js @@ -2,7 +2,7 @@ MatCat BrowserLogic Simulator */ -let Version = "0.3.7"; +let Version = "0.3.8"; let spanVersion = document.getElementById("version"); spanVersion.innerText = Version; // get the canvas and get the engine object going