Cleanup

docs/qemu.md

@@ -15,6 +15,14 @@ qemu-system-i386 -netdev user,id=mynet0 -device ne2k_isa,netdev=mynet0 -hda win9
 ```
 
 Running
+
+With `ne2k_isa`
 ```sh
 qemu-system-i386 -netdev user,id=mynet0 -device ne2k_isa,netdev=mynet0 -drive file=win95.img,format=raw,index=0,media=disk -soundhw sb16 -m 128 -cpu pentium -device cirrus-vga,vgamem_mb=16 -soundhw pcspk -cdrom Win95_OSR25.iso 
 ```
+
+With `ne2k_pci`
+```sh
+qemu-system-i386 -net nic,model=ne2k_pci -net user -drive file=win95_ne2k_pci.img,format=raw,index=0,media=disk -soundhw sb16 -m 128 -cpu pentium -device cirrus-vga,vgamem_mb=16 -soundhw pcspk -cdrom Win95_OSR25.iso --enable-kvm
+```
+

src/main/ipc.ts

@@ -5,7 +5,7 @@ import { IPC_COMMANDS } from "../constants";
 
 export function setupIpcListeners() {
   ipcMain.handle(IPC_COMMANDS.GET_STATE_PATH, () => {
-    return path.join(app.getPath("userData"), "state-v2.bin");
+    return path.join(app.getPath("userData"), "state-v3.bin");
   });
 
   ipcMain.handle(IPC_COMMANDS.APP_QUIT, () => {

src/renderer/card-settings.tsx

@@ -6,7 +6,9 @@ import { getStatePath } from "./utils/get-state-path";
 interface CardSettingsProps {
   bootFromScratch: () => void;
   setFloppy: (file: File) => void;
+  setCdrom: (cdrom: File) => void;
   floppy?: File;
+  cdrom?: File;
 }
 
 interface CardSettingsState {
@@ -21,6 +23,7 @@ export class CardSettings extends React.Component<
     super(props);
 
     this.onChangeFloppy = this.onChangeFloppy.bind(this);
+    this.onChangeCdrom = this.onChangeCdrom.bind(this);
     this.onResetState = this.onResetState.bind(this);
 
     this.state = {
@@ -39,6 +42,8 @@ export class CardSettings extends React.Component<
             </h2>
           </div>
           <div className="card-body">
+            {this.renderCdrom()}
+            <hr />
             {this.renderFloppy()}
             <hr />
             {this.renderState()}
@@ -48,6 +53,45 @@ export class CardSettings extends React.Component<
     );
   }
 
+  public renderCdrom() {
+    // CD is currently not working, so.. let's return nothing.
+    return null;
+
+    const { cdrom } = this.props;
+
+    return (
+      <fieldset>
+        <legend>
+          <img src="../../static/cdrom.png" />
+          CD-ROM
+        </legend>
+        <input
+          id="cdrom-input"
+          type="file"
+          onChange={this.onChangeCdrom}
+          style={{ display: "none" }}
+        />
+        <p>
+          windows95 comes with a virtual CD drive. It can mount images in the "iso" format.
+        </p>
+        <p id="floppy-path">
+          {cdrom
+            ? `Inserted CD: ${cdrom.path}`
+            : `No CD mounted`}
+        </p>
+        <button
+          className="btn"
+          onClick={() =>
+            (document.querySelector("#cdrom-input") as any).click()
+          }
+        >
+          <img src="../../static/select-cdrom.png" />
+          <span>Mount CD</span>
+        </button>
+      </fieldset>
+    );
+  }
+
   public renderFloppy() {
     const { floppy } = this.props;
 
@@ -148,6 +192,24 @@ export class CardSettings extends React.Component<
     }
   }
 
+  /**
+   * Handle a change in the cdrom input
+   *
+   * @param event
+   */
+    private onChangeCdrom(event: React.ChangeEvent<HTMLInputElement>) {
+    const CdromFile =
+      event.target.files && event.target.files.length > 0
+        ? event.target.files[0]
+        : null;
+
+    if (CdromFile) {
+      this.props.setCdrom(CdromFile);
+    } else {
+      console.log(`Cdrom: Input changed but no file selected`);
+    }
+  }
+
   /**
    * Handle the state reset
    */

src/renderer/emulator.tsx

@@ -17,6 +17,7 @@ export interface EmulatorState {
   emulator?: any;
   scale: number;
   floppyFile?: File;
+  cdromFile?: File;
   isBootingFresh: boolean;
   isCursorCaptured: boolean;
   isInfoDisplayed: boolean;
@@ -179,7 +180,7 @@ export class Emulator extends React.Component<{}, EmulatorState> {
    * 🤡
    */
   public renderUI() {
-    const { isRunning, currentUiCard, floppyFile } = this.state;
+    const { isRunning, currentUiCard, floppyFile, cdromFile } = this.state;
 
     if (isRunning) {
       return null;
@@ -191,8 +192,10 @@ export class Emulator extends React.Component<{}, EmulatorState> {
       card = (
         <CardSettings
           setFloppy={(floppyFile) => this.setState({ floppyFile })}
+          setCdrom={(cdromFile) => this.setState({ cdromFile })}
           bootFromScratch={this.bootFromScratch}
           floppy={floppyFile}
+          cdrom={cdromFile}
         />
       );
     } else if (currentUiCard === "drive") {
@@ -272,7 +275,12 @@ export class Emulator extends React.Component<{}, EmulatorState> {
   private async startEmulator() {
     document.body.classList.remove("paused");
 
-    console.log(__dirname)
+    const cdrom: any = {};
+    if (this.state.cdromFile?.path) {
+      cdrom.url = this.state.cdromFile.path;
+      cdrom.async = true;
+      cdrom.size = await getDiskImageSize(this.state.cdromFile.path);
+    }
 
     const options = {
       wasm_path: path.join(__dirname, "build/v86.wasm"),
@@ -288,11 +296,12 @@ export class Emulator extends React.Component<{}, EmulatorState> {
       hda: {
         url: CONSTANTS.IMAGE_PATH,
         async: true,
-        size: await getDiskImageSize(),
+        size: await getDiskImageSize(CONSTANTS.IMAGE_PATH),
       },
       fda: {
         buffer: this.state.floppyFile,
       },
+      cdrom: cdrom,
       boot_order: 0x132,
       // network_relay_url: "ws://localhost:8080/"
     };

src/utils/disk-image-size.ts

@@ -7,9 +7,9 @@ import { CONSTANTS } from "../constants";
  *
  * @returns {number}
  */
-export async function getDiskImageSize() {
+export async function getDiskImageSize(path: string) {
   try {
-    const stats = await fs.stat(CONSTANTS.IMAGE_PATH);
+    const stats = await fs.stat(path);
 
     if (stats) {
       return stats.size;