changed bit widths to be part of node type, instead of diagram

Author: steveRoll-git

src/assets/diagram.svg

@@ -65,7 +65,7 @@ export function Diagram(props: {
   } = useSimulationContext()
   const svgRef = useRef<SVGSVGElement | null>(null)
   const [hoveredWire, setHoveredWire] = useState<
-    { nodeId: string; inputId: string; bits: number } | undefined
+    { nodeId: string; inputId: string } | undefined
   >(undefined)
 
   useEffect(() => {
@@ -94,10 +94,8 @@ export function Diagram(props: {
       current.appendChild(clone)
       clones.push(clone)
 
-      const bits = Number(e.dataset.bits ?? "32")
-
       clone.addEventListener("mouseover", () => {
-        setHoveredWire({ nodeId, inputId, bits })
+        setHoveredWire({ nodeId, inputId })
       })
       clone.addEventListener("mouseleave", () => {
         setHoveredWire(undefined)
@@ -139,18 +137,19 @@ export function Diagram(props: {
     ] as number | undefined
 
     if (hoveredWireValue != undefined) {
-      tooltipContent = int2hex(
-        hoveredWireValue,
-        Math.ceil(hoveredWire.bits / 4),
-      )
+      const bits =
+        simulation.nodes[hoveredWire.nodeId].inputBitWidths?.[
+          hoveredWire.inputId
+        ] ?? 32
+      tooltipContent = int2hex(hoveredWireValue, Math.ceil(bits / 4))
       const iid = makeIID(hoveredWire.nodeId, hoveredWire.inputId)
       if (placedNodes.has(iid)) {
         tooltipContent = (
           <div className="grid grid-cols-[auto_auto] grid-rows-2 gap-x-2 items-baseline">
             <span className="text-sm text-muted-foreground">Before: </span>
             {int2hex(
               simulation.inputValues[placedNodeId(iid)].in,
-              Math.ceil(hoveredWire.bits / 4),
+              Math.ceil(bits / 4),
             )}
             <span className="text-sm text-muted-foreground">After: </span>
             {tooltipContent}

src/components/Diagram.tsx

@@ -8,4 +8,6 @@ type Outputs = ["out"]
 export const and: NodeType<Outputs> = nodeType(
   [{ id: "in0" }, { id: "in1" }] as const,
   (_, inputs) => ({ out: inputs.in0 & inputs.in1 }),
+  undefined,
+  () => ({ out: 1 }),
 )

src/logic/nodeTypes/and.ts

@@ -1,4 +1,4 @@
-import { nodeType, type OutputObject } from "../simulation"
+import { nodeType, type NodeType, type OutputObject } from "../simulation"
 
 type Outputs = [
   "regDst",
@@ -104,11 +104,23 @@ const outputMap: Record<number, OutputObject<Outputs>> = {
  *
  * Its input is expected to be just the 6 opcode bits of an instruction.
  */
-export const control = nodeType(
+export const control: NodeType<Outputs> = nodeType(
   [
     {
       id: "in",
     },
   ] as const,
   (_, inputs) => outputMap[inputs.in],
+  undefined,
+  () => ({
+    aluOp: 2,
+    aluSrc: 1,
+    branch: 1,
+    jump: 1,
+    memRead: 1,
+    memToReg: 1,
+    memWrite: 1,
+    regDst: 1,
+    regWrite: 1,
+  }),
 )

src/logic/nodeTypes/control.ts

@@ -29,6 +29,9 @@ export function makeMux(numInputs: number): Mux {
     (_, inputs) => ({
       out: inputs[`in${inputs.control}`],
     }),
+    undefined,
+    // The bit widths of each input are assumed to be the same, so we simply return the first one's.
+    (get) => ({ out: get("in0") }),
   )
 
   cache[numInputs] = mux

src/logic/nodeTypes/mux.ts

@@ -15,5 +15,6 @@ export const neg: NodeType<Outputs> = nodeType(
     out: -inputs.in,
   }),
   undefined,
+  (get) => ({ out: get("in") }),
   "Neg",
 )

src/logic/nodeTypes/neg.ts

@@ -15,5 +15,6 @@ export const not: NodeType<Outputs> = nodeType(
     out: ~inputs.in,
   }),
   undefined,
+  (get) => ({ out: get("in") }),
   "Not",
 )

src/logic/nodeTypes/not.ts

@@ -34,6 +34,7 @@ export function makeShifter(kind: ShiftKind, bits: number): NodeType<Outputs> {
       out: shiftFuncs[kind](inputs.in, bits),
     }),
     undefined,
+    undefined,
     `${shiftLabels[kind]} ${bits}`,
   )
 }

src/logic/nodeTypes/shift.ts

@@ -26,16 +26,25 @@ function extractBits(n: number, start: number, end: number) {
  */
 export function makeSplitter(
   numOutputs: number,
-  bitRanges?: ([start: number, end: number] | undefined)[],
+  bitRanges?: [start: number, end: number][],
 ): NodeType<Outputs> {
-  return nodeType(inputs, (_, inputs) => {
-    const values: Record<OutTemplate, number> = {}
-    for (let i = 0; i < numOutputs; i++) {
-      const extractRange = bitRanges?.[i]
-      values[`out${i}`] = extractRange
-        ? extractBits(inputs.in, ...extractRange)
-        : inputs.in
-    }
-    return values
-  })
+  return nodeType(
+    inputs,
+    (_, inputs) => {
+      const values: Record<OutTemplate, number> = {}
+      for (let i = 0; i < numOutputs; i++) {
+        const extractRange = bitRanges?.[i]
+        values[`out${i}`] = extractRange
+          ? extractBits(inputs.in, ...extractRange)
+          : inputs.in
+      }
+      return values
+    },
+    undefined,
+    bitRanges &&
+      (() =>
+        Object.fromEntries(
+          bitRanges.map((r, i) => [`out${i}`, r[1] - r[0] + 1]),
+        )),
+  )
 }