Run Edit/Stop Clear

How to Use Logic Gates Simulator

• Edit Mode (Normal - Red Button):
• Click "Edit/Stop" (red) to enter normal edit mode. Use the "Add" menu to select gates. Drag gates to position. Use "Tools > Line Tool" to connect gates. Right-click gates/lines for options (Delete, Duplicate, etc.).
• Edit Mode (Values - Orange Button):
• Click "Edit/Stop" again to toggle to orange (values mode). Click Inputs (if not connected to an incoming signal) to toggle their values (0/1). Right-click gates/lines for options (Delete, Duplicate, Set Delay/Clock Time, Rename Group, Add/Edit Speech Bubble, etc.). Click and drag the red circle on a line to add/move a bend point (only available/visible when auto-organize is off).
• Run Mode (Green Button):
• Click "Run" (green) to simulate. Click Inputs (if not connected to an incoming signal) to toggle values. Right-click is disabled. Editing is disabled.
• Line Tool:
• Select "Tools > Line Tool". Click one gate (start). A dashed blue line follows the cursor. Click a second gate (end) to connect. Connections always go from the first clicked gate to the second. Invalid connections (e.g., OUTPUT gate to another OUTPUT gate, connecting a gate to itself) are blocked. Most other connections, including to INPUT gates or from INPUT gates (even INPUT to INPUT), are allowed. Right-click or Esc cancels the current line draw.
• Select Tool:
• Select "Tools > Select Tool". Drag to select items. Use box buttons or keyboard (Del, Ctrl+D) in *any* Edit mode. Esc/click outside deselects.
• Label Tool:
• Select "Tools > Label Tool". Blue circles appear. Click a circle on a gate/group to add/edit a speech bubble. Click a circle next to a line to add/edit speech bubble text near the line. Use sidebar checkbox to toggle speech bubble visibility.
• Clock Input: A high (1) signal into a Clock pauses it at its current state. A low (0) or no signal allows it to run normally.
• MUX2 (Multiplexer): A 2-to-1 MUX. Inputs: A (top, index 0), B (middle, index 1), SEL (bottom, index 2). Output is on the right. If SEL=0, Output=A. If SEL=1, Output=B. Can be enabled/disabled for adding via sidebar checkbox.
• Saving/Loading: Use the "File" menu. Saves manual bends; auto-bends are saved as straight.
• Auto Line Organization: Use the sidebar checkbox. Toggles simple right-angle bends. Disables manual bending when checked.
• Clearing: Click "Clear".
• Dark Mode: Use the sidebar checkbox.
• Circuit Data Inspector: Use the sidebar checkbox to toggle a draggable, resizable window showing the circuit's JSON data. You can also paste valid circuit JSON (either the full `{"name": "...", "data": {...}}` object or just the inner `{"gates": ..., "connections": ...}` object) into this window and click "Apply & Add Data" to add those elements to the current canvas as new, separate items.
how to use the data inspector: by typing json into the inspector you can create circuits programatically,

JSON Circuit Data Format for Logic Simulator

These instructions outline the JSON structure used to save, load, and import circuit designs. You can use the "Display Circuit Data" feature to see the JSON for the current circuit or to paste JSON to add new elements.

I. Top-Level JSON Structure

The entire circuit is represented by a JSON object. It can be one of two forms:

• A. Full Save Format (typically used when saving with a circuit name):

  
  {
    "name": "YourCircuitName_String",
    "data": {
      // --- See "Direct Data Format" below ---
    }
  }
          

  When importing, if this structure is detected, the system will use the content of the "data" field.

• B. Direct Data Format (contains only the essential circuit elements):

  
  {
    "gates": [ /* Array of Gate Objects - See Section II */ ],
    "connections": [ /* Array of Connection Objects - See Section III */ ],
    "collapsedGroups": [ /* Array of Collapsed Group Objects - See Section IV */ ],
    "groupCounter": Number /* Integer for default group naming - See Section V */
  }
          

II. "gates": Array of Gate Objects

Each object in the "gates" array defines a single logic gate or component.

A. Common Properties for all Gate Objects:

• "type": (String) The type of the gate (e.g., "INPUT", "AND"). See "Available Gate Types" below for a full list.
• "x": (Number) The X-coordinate (top-left) of the gate on the canvas.
• "y": (Number) The Y-coordinate (top-left) of the gate on the canvas.
• "id": (Number or String) A unique identifier for this gate. Must be unique across all gates and collapsed group IDs. Example: 1700000000001
• "label": (String or null) A user-defined text label for the gate. If null, a default may be used or no label shown.
• "value": (Number: 0 or 1, or null) The current logical output value.
  • For INPUT gates, this is their manually set value if not connected to an incoming signal.
  • For CLOCK gates, typically initialized to 0.
  • For most other gates, initialize to null as it's determined by simulation.
• "speechBubbles": (Object, optional) Defines speech bubbles attached to the gate.
  • Keys are "top", "bottom", "left", "right".
  • Each key's value is an object: { "text": "Bubble text", "bounds": null }
  • Example: "speechBubbles": { "right": { "text": "Info here", "bounds": null } }

B. Gate-Specific Properties:

1. For "type": "DELAY" or "type": "CLOCK":
   • "delay": (Number) Delay time in seconds (e.g., 0.5, 1.0).
   • "lastUpdate": (null on import) Internal simulator use.
   • "lastInput": (null on import, for "DELAY" only) Internal simulator use.

C. Available Gate Types ("type" string value):

• "INPUT"
• "OUTPUT"
• "AND"
• "OR"
• "NAND"
• "XOR"
• "XNOR"
• "INVERTER" (or "NOT" can be used as an alias)
• "DELAY"
• "CLOCK"
• "MUX2" (2-to-1 Multiplexer. Inputs: 0=A, 1=B, 2=SEL)

D. Example Gate Objects:

{
  "type": "AND",
  "x": 200,
  "y": 150,
  "id": 1001,
  "label": "ProcessSignal",
  "value": null,
  "speechBubbles": {}
}

{
  "type": "INPUT",
  "x": 50,
  "y": 150,
  "id": 1002,
  "label": "Data_In_X",
  "value": 1,
  "speechBubbles": { "top": {"text": "Set this to 0 or 1"}}
}

{
  "type": "CLOCK",
  "x": 50,
  "y": 250,
  "id": 1003,
  "label": "SysClock",
  "value": 0,
  "delay": 1.0,
  "speechBubbles": {}
}

III. "connections": Array of Connection Objects

Each object defines a wire between the output of one gate and an input of another.

A. Properties:

• "id": (Number or String) A unique identifier for this connection.
• "start": (Number or String) The "id" of the gate where the connection originates (source).
• "end": (Number or String) The "id" of the gate where the connection terminates (destination).
• "inputIndex": (Number) Specifies which input prong on the "end" gate this wire connects to.
  • Single-input gates (NOT, DELAY, OUTPUT, driven INPUT): 0
  • Standard 2-input gates (AND, OR, XOR, etc.): 0 (top), 1 (bottom)
  • MUX2: 0 (Data A), 1 (Data B), 2 (Select)
• "intermediatePoints": (Array of Point Objects, optional) For manually bent lines.
  • Each Point Object: { "x": Number, "y": Number }
  • Example: "intermediatePoints": [ { "x": 100, "y": 150 }, { "x": 150, "y": 150 } ]
• "labels": (Array of Label Objects, optional) For text on line segments.
  • Each Label Object:
    • "segmentIndex": (Number) 0 for first segment, 1 after first bend, etc.
    • "positionIndex": (Number: 0 or 1) Side of the line segment.
    • "text": (String) The label text.
    • "bounds": (null on import)
  • Example: "labels": [ { "segmentIndex": 0, "positionIndex": 0, "text": "Bus A" } ]

B. Example Connection Object:

{
  "id": 2001,
  "start": 1002, // ID of an INPUT gate
  "end": 1001,   // ID of an AND gate
  "inputIndex": 0,
  "intermediatePoints": [],
  "labels": []
}

IV. "collapsedGroups": Array of Collapsed Group Objects

Defines groups of gates that are visually represented as a single block when collapsed.

A. Properties:

• "type": (String) Always "COLLAPSED_GROUP".
• "id": (Number or String) Unique ID for the group block itself.
• "x": (Number) X-coordinate of the collapsed block.
• "y": (Number) Y-coordinate of the collapsed block.
• "label": (String) Name of the group (e.g., "4-Bit Adder").
• "collapsed": (Boolean) true if the group is currently collapsed, false if expanded.
• "value": (Number: 0 or 1, or null) Representative output value (often tied to one of its internal outputs).
• "speechBubbles": (Object, optional) As for gates.
• "gates": (Array of Gate Objects) A copy of the gate objects internal to this group. Their IDs should be unique within the context of this group's definition.
• "connections": (Array of Connection Objects) A copy of connections internal to this group. The "start" and "end" IDs refer to IDs within this group's "gates" array.

B. Note on External Connections to Groups:

Connections from an external gate to a collapsed group, or from a collapsed group to an external gate, are defined in the main top-level "connections" array. In such cases, the "start" or "end" ID will be the "id" of the "COLLAPSED_GROUP" object itself. The "inputIndex" or output point on the group block is implicitly handled by the simulator based on how internal gates are exposed.

C. Example Collapsed Group Object (Illustrative):

{
  "gates": [],
  "connections": [],
  "collapsedGroups": [
    {
      "type": "COLLAPSED_GROUP",
      "id": 1747617672333.755,
      "gates": [
        {
          "type": "INPUT",
          "x": 121.25,
          "y": 122.75,
          "id": 1747617624140.2986,
          "label": "A",
          "value": null,
          "delay": null,
          "lastUpdate": null,
          "lastInput": null,
          "speechBubbles": {}
        },
        {
          "type": "INPUT",
          "x": 140.25,
          "y": 260.75,
          "id": 1747617624492.5066,
          "label": "B",
          "value": null,
          "delay": null,
          "lastUpdate": null,
          "lastInput": null,
          "speechBubbles": {}
        },
        {
          "type": "AND",
          "x": 302.25,
          "y": 200.75,
          "id": 1747617626501.075,
          "label": null,
          "value": null,
          "delay": null,
          "lastUpdate": null,
          "lastInput": null,
          "speechBubbles": {}
        },
        {
          "type": "OUTPUT",
          "x": 448.25,
          "y": 201.75,
          "id": 1747617629877.2498,
          "label": null,
          "value": null,
          "delay": null,
          "lastUpdate": null,
          "lastInput": null,
          "speechBubbles": {}
        }
      ],
      "x": 121.25,
      "y": 122.75,
      "label": "Group 1",
      "collapsed": true,
      "connections": [
        {
          "id": 1747617648412.558,
          "start": 1747617624140.2986,
          "end": 1747617626501.075,
          "inputIndex": 0,
          "intermediatePoints": [],
          "labels": []
        },
        {
          "id": 1747617662428.952,
          "start": 1747617624492.5066,
          "end": 1747617626501.075,
          "inputIndex": 1,
          "intermediatePoints": [],
          "labels": []
        },
        {
          "id": 1747617664012.8406,
          "start": 1747617626501.075,
          "end": 1747617629877.2498,
          "inputIndex": 0,
          "intermediatePoints": [],
          "labels": []
        }
      ],
      "value": null,
      "speechBubbles": {}
    }
  ],
  "groupCounter": 2
}

V. "groupCounter": Number

An integer used by the application to generate unique default names for new groups (e.g., "Group 1", "Group 2", ...). When importing, this value can update the simulator's internal counter if the imported value is higher.

Example: "groupCounter": 5

Here is the list of identifiers for the gates:

• "INPUT"
• "OUTPUT"
• "AND"
• "OR"
• "NAND"
• "XOR"
• "XNOR"
• "INVERTER" (or "NOT")
• "DELAY"
• "CLOCK"
• "MUX2"
• "COLLAPSED_GROUP"