diff --git a/src/modules/activation/types/Context.ts b/src/modules/activation/types/Context.ts index da6dcb1..c294623 100644 --- a/src/modules/activation/types/Context.ts +++ b/src/modules/activation/types/Context.ts @@ -12,6 +12,7 @@ export interface Context { printHex: (value: number, length?: number) => string setBinary: (index: number, value: number, bits?: number) => void getOutputBinary: (index: number) => number + displayBinary: (value: number) => void invertBinary: (value: number) => number color: (color: string) => void innerText: (value: string) => void diff --git a/src/modules/logic-gate-info/data/descriptions.ts b/src/modules/logic-gate-info/data/descriptions.ts index 4d35e02..b593072 100644 --- a/src/modules/logic-gate-info/data/descriptions.ts +++ b/src/modules/logic-gate-info/data/descriptions.ts @@ -7,87 +7,90 @@ const carryExplanation = (half = true) => ` const output = `General purpouse output component.` const delay = ` - The delay is a property of the gate and can be modified by left clicking on the gate in the simulation view. + The delay is a property of the gate and can be modified by left clicking on the gate in the simulation view. ` export const descriptions: Record = { not: ` - The not gate is one of the most basic logic gates. - It outputs the inverse of the input - `, + The not gate is one of the most basic logic gates. + It outputs the inverse of the input + `, and: ` - The and gate outputs true only if both inputs are true. - The and gate is the logic equivalent of f(x, y) = x * y - `, + The and gate outputs true only if both inputs are true. + The and gate is the logic equivalent of f(x, y) = x * y + `, or: ` - The or gate outputs true if any of the inputs is true. - The or gate is the logic equivalent of f(x, y) = x + y - x * y - `, + The or gate outputs true if any of the inputs is true. + The or gate is the logic equivalent of f(x, y) = x + y - x * y + `, nand: ` - The nand gate only outputs true if none or one of the inputs is true. - The nand gate is the logic equivalent of f(x, y) = 1 - x * y - `, + The nand gate only outputs true if none or one of the inputs is true. + The nand gate is the logic equivalent of f(x, y) = 1 - x * y + `, nor: ` - The nor gate only outputs true if none of the inputs is true. - The nor gate is the logic equivalent of f(x, y) = 1 + x * y - (x + y) - `, + The nor gate only outputs true if none of the inputs is true. + The nor gate is the logic equivalent of f(x, y) = 1 + x * y - (x + y) + `, xor: ` - The xor gate (also known as the 'exclusive or' gate) only outputs true if one and only one of the inputs is true. - The xor gate is the logic equivalent of f(x, y) = x + y - 2 * x * y - `, + The xor gate (also known as the 'exclusive or' gate) only outputs true if one and only one of the inputs is true. + The xor gate is the logic equivalent of f(x, y) = x + y - 2 * x * y + `, xnor: ` - The xnor gate (also known as the 'not exlusive or' gate) only outputs true if none or both the inputs are true. - The xnor gate is the logic equivalent of f(x, y) = 1 - |x - y| - `, + The xnor gate (also known as the 'not exlusive or' gate) only outputs true if none or both the inputs are true. + The xnor gate is the logic equivalent of f(x, y) = 1 - |x - y| + `, 'half adder': ` - The half adder is used to add 2 numbers. It outputs a result and a carry. - ${carryExplanation()} - The half adder is the logic equivalent of f(x, y) = { x + y - 2 * x * y, x * y } - `, + The half adder is used to add 2 numbers. It outputs a result and a carry. + ${carryExplanation()} + The half adder is the logic equivalent of f(x, y) = { x + y - 2 * x * y, x * y } + `, 'full adder': ` - The full adder is the building block for almos all math related circuit. - The full adder is used to add 2 number and a carry. It outputs a result and a carry. - ${carryExplanation(false)} - The full adder is the logic equivalent of f(x, y, z) = { - x + y + z + 4 * x * y * z - 2 * (x * y + y * z + z * x), - x * y + y * z + z * x - 2 * x * y * z - } - `, + The full adder is the building block for almos all math related circuit. + The full adder is used to add 2 number and a carry. It outputs a result and a carry. + ${carryExplanation(false)} + The full adder is the logic equivalent of f(x, y, z) = { + x + y + z + 4 * x * y * z - 2 * (x * y + y * z + z * x), + x * y + y * z + z * x - 2 * x * y * z + } + `, comparator: ` - Compares the 2 inputs. The first input is only true if a > b, the second input is - only true if a === b and the 3rd input is only true if a < b. - `, + Compares the 2 inputs. The first input is only true if a > b, the second input is + only true if a === b and the 3rd input is only true if a < b. + `, 'parallel delayer': ` - Delays the inputs by a amount of time. ${delay} - `, + Delays the inputs by a amount of time. ${delay} + `, 'sequential delayer': ` - Delays the input by a certain amount of time relative to the last change. ${delay} - `, + Delays the input by a certain amount of time relative to the last change. ${delay} + `, '4 bit encoder': ` - Encodes the 4 inputs into a single output - `, + Encodes the 4 inputs into a single output + `, '4 bit decoder': ` - Splits the input into 4 outputs - `, + Splits the input into 4 outputs + `, 'bit merger': ` - Merges the bits of both inputs into 1 output - `, + Merges the bits of both inputs into 1 output + `, 'bit splitter': ` - Splits the bits from the input into 2 chunks of the same length - `, + Splits the bits from the input into 2 chunks of the same length + `, button: ` - Outputs either 0 or 1. Has no inputs. You can change its value by left clicking on it. - `, + Outputs either 0 or 1. Has no inputs. You can change its value by left clicking on it. + `, 'light bulb': ` - ${output} The color changes based on the input. - `, + ${output} The color changes based on the input. + `, 'rgb light': ` - ${output} The color is a based on the 3 inputs. The first input means red, the second green and the third blue. - `, + ${output} The color is a based on the 3 inputs. The first input means red, the second green and the third blue. + `, incrementor: ` - Outputs the input + 1 - `, + Outputs the input + 1 + `, constant: ` - Outputs a numeric constant configured (like any other property) by right-clicking the component - ` + Outputs a numeric constant configured (like any other property) by right-clicking the component + `, + display: ` + Displays the input value as binary/hexadecimal. + ` } diff --git a/src/modules/saving/constants.ts b/src/modules/saving/constants.ts index 8aaed7c..1334761 100644 --- a/src/modules/saving/constants.ts +++ b/src/modules/saving/constants.ts @@ -21,6 +21,7 @@ import bitMergerTemplate from './templates/bitMerger' import bitSplitterTemplate from './templates/bitSplitter' import incrementorTemplate from './templates/incrementor' import constantTemplate from './templates/constant' +import displayTemplate from './templates/display' export const defaultSimulationName = 'default' export const baseTemplates: DeepPartial[] = [ @@ -44,7 +45,8 @@ export const baseTemplates: DeepPartial[] = [ bitMergerTemplate, bitSplitterTemplate, incrementorTemplate, - constantTemplate + constantTemplate, + displayTemplate ] export const baseSave: RendererState = { diff --git a/src/modules/saving/templates/constant.ts b/src/modules/saving/templates/constant.ts index 94e6f55..3e806a2 100644 --- a/src/modules/saving/templates/constant.ts +++ b/src/modules/saving/templates/constant.ts @@ -19,12 +19,9 @@ const constTemplate: PartialTemplate = { const state = context.getProperty('value') const bits = context.getProperty('output bits') const length = state.toString(2).length - const text = length > 10 - ? "0x" + context.printHex(state, Math.ceil(length/4)) - : context.printBinary(state, length) + context.displayBinary(state) context.setBinary(0, state, bits === 0 ? length : bits) - context.innerText(text) ` }, pins: { diff --git a/src/modules/saving/templates/display.ts b/src/modules/saving/templates/display.ts new file mode 100644 index 0000000..03c5026 --- /dev/null +++ b/src/modules/saving/templates/display.ts @@ -0,0 +1,31 @@ +import { PartialTemplate } from '../types/PartialTemplate' +import { categories } from '../data/categories' + +/** + * The template of the display gate + */ +const displayTemplate: PartialTemplate = { + metadata: { + name: 'display' + }, + material: { + fill: '#673AB7', + stroke: { + normal: '#EDC6FB' + } + }, + code: { + activation: ` + context.displayBinary(context.getBinary(0)) + ` + }, + pins: { + outputs: { + count: 0 + } + }, + info: [], + category: categories.io +} + +export default displayTemplate diff --git a/src/modules/saving/templates/light.ts b/src/modules/saving/templates/light.ts index 8b3a89a..b99c17d 100644 --- a/src/modules/saving/templates/light.ts +++ b/src/modules/saving/templates/light.ts @@ -22,12 +22,10 @@ const lightTemplate: PartialTemplate = { }, code: { activation: ` - const { main, active } = context.colors + const { main, active } = context.colors - const bits = context.get(0) - - context.color(parseInt(context.get(0),2) ? active : main) - ` + context.color(context.getBinary(2) ? active : main) + ` }, integration: { output: true diff --git a/src/modules/simulation/classes/Gate.ts b/src/modules/simulation/classes/Gate.ts index 332bcac..9c56192 100644 --- a/src/modules/simulation/classes/Gate.ts +++ b/src/modules/simulation/classes/Gate.ts @@ -439,11 +439,20 @@ export class Gate { } } - return { + const context: Context = { printBinary: (value: number, bits: number = maxLength) => toLength(value.toString(2), bits), printHex: (value: number, bits: number = maxLength) => toLength(value.toString(16), bits), + displayBinary: (value: number) => { + const length = value.toString(2).length + const text = + length > 10 + ? '0x' + context.printHex(value, Math.ceil(length / 4)) + : context.printBinary(value, length) + + context.innerText(text) + }, get: (index: number) => { return this._pins.inputs[index].state.value }, @@ -504,6 +513,8 @@ export class Gate { ...this.template.material.colors } } + + return context } /**