From 64460429def137eaf5ce1f69666d0c343bfc5408 Mon Sep 17 00:00:00 2001
From: Ross Andrews <ross.andrews@gmail.com>
Date: Sun, 28 Apr 2024 00:00:45 -0500
Subject: [PATCH] Extract out CPU as a prop

---
 vweb/src/emulator_display.jsx | 28 ++++++++++------------------
 1 file changed, 10 insertions(+), 18 deletions(-)

diff --git a/vweb/src/emulator_display.jsx b/vweb/src/emulator_display.jsx
index 84c69a2..6c91170 100644
--- a/vweb/src/emulator_display.jsx
+++ b/vweb/src/emulator_display.jsx
@@ -1,34 +1,26 @@
-import React, { useCallback, useEffect, useRef } from 'react'
-import { WasmCPU, Display } from '../pkg/vweb.js'
+import React, { useCallback, useEffect, useRef, useMemo } from 'react'
+import { Display } from '../pkg'
 
-export default function({}) {
+export default function({ cpu }) {
     const canvas = useRef(null)
-    const cpu = useRef(new WasmCPU())
     const ctx = useRef(null)
-    const display = useRef(null)
+    const display = useMemo(() => new Display(), [])
     const request = useRef(null)
 
-    const blah = useRef(0)
-
     const drawFrame = useCallback(() => {
-        // for(let n = 0; n < 160 * 120; n++) {
-        //     cpu.current.poke(0x10000 + n, n % 256 /* Math.random() * 256 */)
-        // }
-        display.current.draw(cpu.current, ctx.current)
+        display.draw(cpu, ctx.current)
         request.current = requestAnimationFrame(drawFrame)
-    }, [])
+    }, [display, cpu])
 
     useEffect(() => {
-        cpu.current.poke(16 + 0, 3)
-        cpu.current.poke24(16 + 10, 160) // Set the virtual h / w
-        cpu.current.poke24(16 + 13, 120)
         ctx.current = canvas.current.getContext('2d')
-        display.current = new Display()
         request.current = requestAnimationFrame(drawFrame)
         return () => cancelAnimationFrame(request.current)
-    }, [canvas.current])
+    }, [canvas.current, drawFrame])
 
     return (
-        <canvas ref={canvas} width={640} height={480}></canvas>
+        <div className='display'>
+            <canvas ref={canvas} width={640} height={480}></canvas>
+        </div>
     )
 }
\ No newline at end of file