diff --git a/src/simulator/src/circuitElement.js b/src/simulator/src/circuitElement.js index cd368c4d..b4a92237 100644 --- a/src/simulator/src/circuitElement.js +++ b/src/simulator/src/circuitElement.js @@ -154,7 +154,7 @@ export default class CircuitElement { /** * To generate JSON-safe data that can be loaded * @memberof CircuitElement - * @return {JSON} - the data to be saved + * @return {object} - the data to be saved */ saveObject() { var data = { @@ -176,7 +176,7 @@ export default class CircuitElement { /** * Always overriden * @memberof CircuitElement - * @return {JSON} - the data to be saved + * @return {object} - the data to be saved */ // eslint-disable-next-line class-methods-use-this customSave() { @@ -852,7 +852,8 @@ export default class CircuitElement { resolve() {} /** - * Helper Function to process verilog + * Helper Function to process Verilog + * @return {string} */ processVerilog() { // Output count used to sanitize output @@ -956,8 +957,8 @@ export default class CircuitElement { } /** - * Helper Function to generate verilog - * @return {JSON} + * Helper Function to generate Verilog. + * @return {string} */ generateVerilog() { // Example: and and_1(_out, _out, _Q[0]); diff --git a/src/simulator/src/modules/OrGate.js b/src/simulator/src/modules/OrGate.js deleted file mode 100644 index 16835aa2..00000000 --- a/src/simulator/src/modules/OrGate.js +++ /dev/null @@ -1,172 +0,0 @@ -import CircuitElement from '../circuitElement' -import Node, { findNode } from '../node' -import simulationArea from '../simulationArea' -import { correctWidth, bezierCurveTo, moveTo } from '../canvasApi' -import { changeInputSize } from '../modules' -import { gateGenerateVerilog } from '../utils' - -/** - * @class - * OrGate - * @extends CircuitElement - * @param {number} x - x coordinate of element. - * @param {number} y - y coordinate of element. - * @param {Scope=} scope - Cirucit on which element is drawn - * @param {string=} dir - direction of element - * @param {number=} inputs - number of input nodes - * @param {number=} bitWidth - bit width per node. - * @category modules - */ -import { colors } from '../themer/themer' - -export default class OrGate extends CircuitElement { - constructor( - x, - y, - scope = globalScope, - dir = 'RIGHT', - inputs = 2, - bitWidth = 1 - ) { - // Calling base class constructor - super(x, y, scope, dir, bitWidth) - this.rectangleObject = false - this.setDimensions(15, 20) - // Inherit base class prototype - this.inp = [] - this.inputSize = inputs - if (inputs % 2 === 1) { - for (let i = Math.floor(inputs / 2) - 1; i >= 0; i--) { - const a = new Node(-10, -10 * (i + 1), 0, this) - this.inp.push(a) - } - let a = new Node(-10, 0, 0, this) - this.inp.push(a) - for (let i = 0; i < Math.floor(inputs / 2); i++) { - a = new Node(-10, 10 * (i + 1), 0, this) - this.inp.push(a) - } - } else { - for (let i = inputs / 2 - 1; i >= 0; i--) { - const a = new Node(-10, -10 * (i + 1), 0, this) - this.inp.push(a) - } - for (let i = 0; i < inputs / 2; i++) { - const a = new Node(-10, 10 * (i + 1), 0, this) - this.inp.push(a) - } - } - this.output1 = new Node(20, 0, 1, this) - } - - /** - * @memberof OrGate - * fn to create save Json Data of object - * @return {JSON} - */ - customSave() { - const data = { - constructorParamaters: [ - this.direction, - this.inputSize, - this.bitWidth, - ], - - nodes: { - inp: this.inp.map(findNode), - output1: findNode(this.output1), - }, - } - return data - } - - /** - * @memberof OrGate - * resolve output values based on inputData - */ - resolve() { - let result = this.inp[0].value || 0 - if (this.isResolvable() === false) { - return - } - for (let i = 1; i < this.inputSize; i++) - result |= this.inp[i].value || 0 - this.output1.value = result >>> 0 - simulationArea.simulationQueue.add(this.output1) - } - - /** - * @memberof OrGate - * function to draw element - */ - customDraw() { - var ctx = simulationArea.context - ctx.strokeStyle = colors['stroke'] - ctx.lineWidth = correctWidth(3) - - const xx = this.x - const yy = this.y - ctx.beginPath() - ctx.fillStyle = colors['fill'] - - moveTo(ctx, -10, -20, xx, yy, this.direction, true) - bezierCurveTo(0, -20, +15, -10, 20, 0, xx, yy, this.direction) - bezierCurveTo( - 0 + 15, - 0 + 10, - 0, - 0 + 20, - -10, - +20, - xx, - yy, - this.direction - ) - bezierCurveTo(0, 0, 0, 0, -10, -20, xx, yy, this.direction) - ctx.closePath() - if ( - (this.hover && !simulationArea.shiftDown) || - simulationArea.lastSelected === this || - simulationArea.multipleObjectSelections.contains(this) - ) - ctx.fillStyle = colors['hover_select'] - ctx.fill() - ctx.stroke() - } - - generateVerilog() { - return gateGenerateVerilog.call(this, '|') - } -} - -/** - * @memberof OrGate - * Help Tip - * @type {string} - * @category modules - */ -OrGate.prototype.tooltipText = - 'Or Gate Tooltip : Implements logical disjunction' - -/** - * @memberof OrGate - * function to change input nodes of the element - * @category modules - */ -OrGate.prototype.changeInputSize = changeInputSize - -/** - * @memberof SevenSegDisplay - * @type {boolean} - * @category modules - */ -OrGate.prototype.alwaysResolve = true - -/** - * @memberof SevenSegDisplay - * @type {string} - * @category modules - */ -OrGate.prototype.verilogType = 'or' -OrGate.prototype.helplink = 'https://docs.circuitverse.org/#/chapter4/4gates?id=or-gate' -OrGate.prototype.objectType = 'OrGate' diff --git a/src/simulator/src/modules/OrGate.ts b/src/simulator/src/modules/OrGate.ts new file mode 100644 index 00000000..b7a4c64c --- /dev/null +++ b/src/simulator/src/modules/OrGate.ts @@ -0,0 +1,131 @@ +import CircuitElement from '../circuitElement'; +import Node, { findNode } from '../node'; +import simulationArea from '../simulationArea'; +import { correctWidth, bezierCurveTo, moveTo } from '../canvasApi'; +import { changeInputSize } from '../modules'; +import { gateGenerateVerilog } from '../utils'; + +import { colors } from '../themer/themer'; + +export default class OrGate extends CircuitElement { + private inp: Node[]; + private inputSize: number; + private output1: Node; + + constructor( + x: number, + y: number, + scope: any = globalScope, + dir: string = 'RIGHT', + inputs: number = 2, + bitWidth: number = 1 + ) { + super(x, y, scope, dir, bitWidth); + this.rectangleObject = false; + this.setDimensions(15, 20); + this.inp = []; + this.inputSize = inputs; + if (inputs % 2 === 1) { + for (let i = Math.floor(inputs / 2) - 1; i >= 0; i--) { + const a = new Node(-10, -10 * (i + 1), 0, this); + this.inp.push(a); + } + let a = new Node(-10, 0, 0, this); + this.inp.push(a); + for (let i = 0; i < Math.floor(inputs / 2); i++) { + a = new Node(-10, 10 * (i + 1), 0, this); + this.inp.push(a); + } + } else { + for (let i = inputs / 2 - 1; i >= 0; i--) { + const a = new Node(-10, -10 * (i + 1), 0, this); + this.inp.push(a); + } + for (let i = 0; i < inputs / 2; i++) { + const a = new Node(-10, 10 * (i + 1), 0, this); + this.inp.push(a); + } + } + this.output1 = new Node(20, 0, 1, this); + } + + // Resolve output values based on inp + resolve() { + let result = this.inp[0].value || 0; + if (this.isResolvable() === false) { + return; + } + for (let i = 1; i < this.inputSize; i++) { + result |= this.inp[i].value || 0; + } + this.output1.value = result >>> 0; + simulationArea.simulationQueue.add(this.output1); + } + + customDraw() { + var ctx = simulationArea.context; + ctx.strokeStyle = colors['stroke']; + ctx.lineWidth = correctWidth(3); + + const xx = this.x; + const yy = this.y; + ctx.beginPath(); + ctx.fillStyle = colors['fill']; + + moveTo(ctx, -10, -20, xx, yy, this.direction, true); + bezierCurveTo(0, -20, +15, -10, 20, 0, xx, yy, this.direction); + bezierCurveTo( + 0 + 15, + 0 + 10, + 0, + 0 + 20, + -10, + +20, + xx, + yy, + this.direction + ); + bezierCurveTo(0, 0, 0, 0, -10, -20, xx, yy, this.direction); + ctx.closePath(); + if ( + (this.hover && !simulationArea.shiftDown) || + simulationArea.lastSelected === this || + simulationArea.multipleObjectSelections.contains(this) + ) { + ctx.fillStyle = colors['hover_select']; + } + ctx.fill(); + ctx.stroke(); + } + + customSave(): object { + const data = { + constructorParamaters: [ + this.direction, + this.inputSize, + this.bitWidth, + ], + nodes: { + inp: this.inp.map(findNode), + output1: findNode(this.output1), + }, + }; + return data; + } + + generateVerilog(): string { + return gateGenerateVerilog.call(this, '|'); + } +} + +OrGate.prototype.tooltipText = + 'Or Gate Tooltip : Implements logical disjunction'; + +OrGate.prototype.changeInputSize = changeInputSize; + +OrGate.prototype.alwaysResolve = true; + +OrGate.prototype.verilogType = 'or'; +OrGate.prototype.helplink = + 'https://docs.circuitverse.org/#/chapter4/4gates?id=or-gate'; +OrGate.prototype.objectType = 'OrGate'; \ No newline at end of file diff --git a/src/simulator/src/themer/themer.js b/src/simulator/src/themer/themer.js index 1f5bcc31..c514f4ff 100644 --- a/src/simulator/src/themer/themer.js +++ b/src/simulator/src/themer/themer.js @@ -5,7 +5,7 @@ import { SimulatorStore } from '#/store/SimulatorStore/SimulatorStore' /** * Extracts canvas theme colors from CSS-Variables and returns a JSON Object - * @returns {object} + * @returns {Object.} */ const getCanvasColors = () => { let colors = {}