Add slinky and clock (#112)

js/apple2io.ts

@@ -3,17 +3,12 @@ import { Card, Memory, MemoryPages, TapeData, byte, Restorable } from './types';
 import { debug, garbage } from './util';
 import { VideoModes } from './videomodes';
 
-type slot = 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7;
-type button = 0 | 1 | 2;
-type paddle = 0 | 1 | 2 | 3;
-type annunciator = 0 | 1 | 2 | 3;
+export type slot = 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7;
+export type button = 0 | 1 | 2;
+export type paddle = 0 | 1 | 2 | 3;
+export type annunciator = 0 | 1 | 2 | 3;
 
-interface Annunciators {
-    0: boolean;
-    1: boolean;
-    2: boolean;
-    3: boolean;
-}
+type Annunciators = Record<annunciator, boolean>;
 
 export interface Apple2IOState {
     annunciators: Annunciators;

js/components/Apple2.tsx

@@ -3,13 +3,15 @@ import cs from 'classnames';
 import {useEffect, useRef, useState } from 'preact/hooks';
 import { Apple2 as Apple2Impl } from '../apple2';
 import Apple2IO from '../apple2io';
+import CPU6502 from '../cpu6502';
 import { ControlStrip } from './ControlStrip';
 import { Inset } from './Inset';
 import { Keyboard } from './Keyboard';
 import { Mouse } from './Mouse';
 import { Screen } from './Screen';
 import { Drives } from './Drives';
-import CPU6502 from 'js/cpu6502';
+import { Slinky } from './Slinky';
+import { ThunderClock } from './ThunderClock';
 
 /**
  * Interface for the Apple2 component.
@@ -62,7 +64,9 @@ export const Apple2 = (props: Apple2Props) => {
     return (
         <div className={cs('outer', { apple2e: e})}>
             <Screen screen={screen} />
-            <Mouse cpu={cpu} screen={screen} io={io} />
+            <Mouse cpu={cpu} screen={screen} io={io} slot={4} />
+            <Slinky io={io} slot={4} />
+            <ThunderClock io={io} slot={5} />
             <Inset>
                 <Drives io={io} sectors={sectors} />
             </Inset>

js/components/Mouse.tsx

@@ -1,22 +1,35 @@
 import { RefObject } from 'preact';
-import Apple2IO from '../apple2io';
+import Apple2IO, { slot } from '../apple2io';
 import { MouseUI } from '../ui/mouse';
 import MouseCard from '../cards/mouse';
 import CPU6502 from '../cpu6502';
 import { useEffect } from 'preact/hooks';
 
+/**
+ * Mouse component properties.
+ */
 export interface MouseProps {
     cpu: CPU6502 | undefined;
     io: Apple2IO | undefined;
     screen: RefObject<HTMLCanvasElement>;
+    slot: slot;
 }
 
-export const Mouse = ({ cpu, screen, io }: MouseProps) => {
+/**
+ * Mouse card component that adds a simple mouse driver.
+ *
+ * @param cpu CPU6502 object
+ * @param screen Screen element reference
+ * @param io Apple2IO object
+ * @param slot Slot to register card in
+ * @returns Mouse component
+ */
+export const Mouse = ({ cpu, screen, io, slot }: MouseProps) => {
     useEffect(() => {
         if (cpu && io && screen.current) {
             const mouseUI = new MouseUI(screen.current);
             const mouse = new MouseCard(cpu, mouseUI);
-            io.setSlot(4, mouse);
+            io.setSlot(slot, mouse);
         }
     }, [cpu, io]);
 

js/components/Slinky.tsx

@@ -0,0 +1,30 @@
+import { useEffect } from 'preact/hooks';
+import Apple2IO, { slot } from '../apple2io';
+import RAMFactor from '../cards/ramfactor';
+
+/**
+ * Slinky component properties
+ */
+export interface SlinkyProps {
+    io: Apple2IO | undefined;
+    slot: slot;
+}
+
+/**
+ * RAMFactory (Slinky) memory card component. Adds
+ * 1MB of slinky compatible memory.
+ *
+ * @param io Apple2IO object
+ * @param slot Slot to register card in
+ * @returns Slinky component
+ */
+export const Slinky = ({ io, slot }: SlinkyProps) => {
+    useEffect(() => {
+        if (io) {
+            const slinky = new RAMFactor(1024 * 1024);
+            io.setSlot(slot, slinky);
+        }
+    }, [io]);
+
+    return null;
+};

js/components/ThunderClock.tsx

@@ -0,0 +1,28 @@
+import { useEffect } from 'preact/hooks';
+import Apple2IO, { slot } from '../apple2io';
+import ThunderClockCard from '../cards/thunderclock';
+
+/**
+ * ThunderClock component properties.
+ */
+export interface ThunderClockProps {
+    io: Apple2IO | undefined;
+    slot: slot;
+}
+
+/**
+ * ThunderClock card component.
+ *
+ * @param io Apple2IO object
+ * @param slot Slot to register card in
+ */
+export const ThunderClock = ({ io, slot }: ThunderClockProps) => {
+    useEffect(() => {
+        if (io) {
+            const clock = new ThunderClockCard();
+            io.setSlot(slot, clock);
+        }
+    }, [io]);
+
+    return null;
+};