jsbeeb 1.22.1 → 1.22.2

package/README.md

@@ -1,4 +1,5 @@
 [![jsbeeb tests](https://github.com/mattgodbolt/jsbeeb/actions/workflows/test-and-deploy.yml/badge.svg)](https://github.com/mattgodbolt/jsbeeb/actions/workflows/test-and-deploy.yml)
+[![coverage](https://img.shields.io/endpoint?url=https%3A%2F%2Fraw.githubusercontent.com%2Fmattgodbolt%2Fjsbeeb%2Fbadges%2Fcoverage.json)](https://github.com/mattgodbolt/jsbeeb/actions/workflows/test-and-deploy.yml)
 
 # jsbeeb - JavaScript BBC Micro Emulator
 

package/package.json

@@ -7,7 +7,7 @@
   "name": "jsbeeb",
   "description": "Emulate a BBC Micro",
   "repository": "git@github.com:mattgodbolt/jsbeeb.git",
-  "version": "1.22.1",
+  "version": "1.22.2",
   "//engines": "If you change the version of Node, it must also be updated at the top of the Dockerfile.",
   "engines": {
     "node": ">=24.15.0"

package/src/basic-loader.js

@@ -1,5 +1,10 @@
 "use strict";
 
+/** Where the OS sits waiting for a keypress, per machine: the place to interrupt with a program. */
+export function basicIdleAddr(model) {
+    return model.isMaster ? 0xe7e6 : 0xe581;
+}
+
 /**
  * Pokes a tokenised BASIC program into memory at PAGE, and sets TOP and
  * VARTOP after it, exactly as if it had just been typed.

package/src/main.js

@@ -63,10 +63,7 @@ const noSeek = !!parsedQuery.noseek;
 const stationId = parsedQuery.stationId !== undefined ? parsedQuery.stationId : 101;
 
 const tryGl = parsedQuery.glEnabled ?? true;
-let lowLatency = true;
-if (parsedQuery.lowLatency !== undefined) {
-    lowLatency = parsedQuery.lowLatency === "true";
-}
+const lowLatency = parsedQuery.lowLatency ?? true;
 
 if (parsedQuery.embed) {
     for (const el of document.querySelectorAll(".embed-hide")) el.style.display = "none";
@@ -99,9 +96,7 @@ const keys = new KeyboardSetup({
     enterDebugger: () => loop.stop(true),
     reload: () => window.location.reload(),
     toggleFast: () => loop.toggleFastAsPossible(),
-    openRewind: () => {
-        if (rewindUI) rewindUI.open();
-    },
+    openRewind: () => rewindUI.open(),
     openPrinter: () => frontPanel.checkPrinterWindow(),
     pause: () => loop.stop(false),
     resume: () => loop.go(),
@@ -138,12 +133,6 @@ if (cpuMultiplier !== 1) console.log(`CPU multiplier set to ${cpuMultiplier}`);
 const cpuSpeed = model.cyclesPerSecond;
 const clocksPerSecond = (cpuMultiplier * cpuSpeed) | 0;
 
-const modals = new Modals({
-    isRunning: () => loop.isRunning(),
-    stop: (debug) => loop.stop(debug),
-    go: () => loop.go(),
-});
-
 const screenCanvas = document.getElementById("screen");
 const display = new Display({
     screenCanvas,
@@ -187,7 +176,7 @@ const quickSettings = new QuickSettings(
 );
 
 // ------------------------------------------------------------------------
-// The machine, and everything that feeds it.
+// The machine, the loop that runs it, and everything that feeds it.
 // ------------------------------------------------------------------------
 
 // Depends on the settings having applied the URL parameters.
@@ -208,6 +197,34 @@ const machine = new Machine({
 });
 const processor = machine.processor;
 
+const rewindBuffer = new RewindBuffer(30);
+const loop = new EmulationLoop({
+    processor,
+    display,
+    audioHandler,
+    dbgr,
+    gamepad,
+    keyboard: keys,
+    syncLights: () => frontPanel.syncLights(),
+    rewindBuffer,
+    onRewindCaptured: () => rewindUI.updateButtonState(),
+    clocksPerSecond,
+    cpuSpeed,
+    fastTape: !!parsedQuery.fasttape,
+    audioStatsNode,
+});
+
+const debugPause = document.getElementById("debug-pause");
+const debugPlay = document.getElementById("debug-play");
+loop.addEventListener("running", () => {
+    const running = loop.isRunning();
+    keys.setRunning(running);
+    debugPlay.disabled = running;
+    debugPause.disabled = !running;
+});
+
+const modals = new Modals({ loop });
+
 const drives = new Drives({ fdc: processor.fdc, driveTracks, areYouSure: modals.areYouSure.bind(modals) });
 const media = new MediaLoader({
     processor,
@@ -257,9 +274,7 @@ const snapshots = new SnapshotUI({
     drives,
     urlState,
     modals,
-    isRunning: () => loop.isRunning(),
-    stop: (debug) => loop.stop(debug),
-    go: () => loop.go(),
+    loop,
 });
 
 const inputs = new AnalogueInputs({
@@ -285,43 +300,15 @@ keys.attach({ processor, dbgr, keyLayout });
 const frontPanel = new FrontPanel({ processor, model, printer });
 
 // ------------------------------------------------------------------------
-// Running it: the loop, rewind and the visualiser.
+// Rewind, the visualiser and the layout.
 // ------------------------------------------------------------------------
 
-const rewindBuffer = new RewindBuffer(30);
-const loop = new EmulationLoop({
-    processor,
-    display,
-    audioHandler,
-    dbgr,
-    gamepad,
-    keyboard: keys,
-    syncLights: () => frontPanel.syncLights(),
-    rewindBuffer,
-    onRewindCaptured: () => rewindUI.updateButtonState(),
-    clocksPerSecond,
-    cpuSpeed,
-    fastTape: !!parsedQuery.fasttape,
-    audioStatsNode,
-});
-
-const debugPause = document.getElementById("debug-pause");
-const debugPlay = document.getElementById("debug-play");
-loop.addEventListener("running", () => {
-    const running = loop.isRunning();
-    keys.setRunning(running);
-    debugPlay.disabled = running;
-    debugPause.disabled = !running;
-});
-
 const rewindUI = new RewindUI({
     rewindBuffer,
     processor,
     video,
     captureInterval: RewindCaptureInterval,
-    stop: (debug) => loop.stop(debug),
-    go: () => loop.go(),
-    isRunning: () => loop.isRunning(),
+    loop,
 });
 rewindUI.updateButtonState();
 
@@ -391,11 +378,7 @@ window.addEventListener("beforeunload", function (event) {
 });
 
 function hardReset() {
-    if (rewindUI) {
-        rewindUI.close();
-        rewindBuffer.clear();
-        rewindUI.updateButtonState();
-    }
+    rewindUI.reset();
     processor.reset(true);
 }
 
@@ -530,7 +513,7 @@ electron({
     actions: {
         "soft-reset": () => processor.reset(false),
         "hard-reset": hardReset,
-        "save-state": () => document.getElementById("save-state").click(),
+        "save-state": () => snapshots.saveState(),
         rewind: () => rewindUI.open(),
         pause: pauseIntoDebugger,
         resume: resumeFromDebugger,

package/src/web/analogue-inputs.js

@@ -4,6 +4,8 @@ import { MouseJoystickSource } from "../mouse-joystick-source.js";
 import { calculateMouseCoordinates } from "../mouse-coordinates.js";
 import { toast } from "./toast.js";
 
+const AdcChannelCount = 4;
+
 /**
  * What feeds the analogue port and the touchscreen: the gamepad, the mouse
  * acting as a joystick, and the microphone, with the mouse on the monitor
@@ -59,7 +61,7 @@ export class AnalogueInputs {
     updateAdcSources(mouseJoystickEnabled, microphoneChannel) {
         const { processor } = this;
         // Default all channels to the gamepad source.
-        for (let ch = 0; ch < 4; ch++) {
+        for (let ch = 0; ch < AdcChannelCount; ch++) {
             processor.adconverter.setChannelSource(ch, this.gamepadSource);
         }
 
@@ -73,11 +75,25 @@ export class AnalogueInputs {
         }
 
         // Apply microphone if configured (can override any channel)
-        if (microphoneChannel !== undefined) {
+        if (microphoneChannel === undefined) return;
+        if (Number.isInteger(microphoneChannel) && microphoneChannel >= 0 && microphoneChannel < AdcChannelCount) {
             processor.adconverter.setChannelSource(microphoneChannel, this.microphoneInput);
+        } else {
+            toast(
+                `There is no analogue channel ${microphoneChannel}; channels are 0 to 3. ` +
+                    `The microphone channel has been turned off.`,
+                { title: "Microphone" },
+            );
+            this.clearMicrophoneChannel();
         }
     }
 
+    clearMicrophoneChannel() {
+        this.config.setMicrophoneChannel(undefined);
+        delete this.urlState.params.microphoneChannel;
+        this.urlState.updateUrl();
+    }
+
     async ensureMicrophoneRunning() {
         const { microphoneInput } = this;
         if (microphoneInput.audioContext && microphoneInput.audioContext.state !== "running") {
@@ -93,6 +109,8 @@ export class AnalogueInputs {
     }
 
     async setupMicrophone() {
+        // The channel can have been turned off between the request and now.
+        if (this.urlState.params.microphoneChannel === undefined) return;
         const micPermissionStatus = document.getElementById("micPermissionStatus");
         micPermissionStatus.textContent = "Requesting microphone access...";
 
@@ -110,10 +128,7 @@ export class AnalogueInputs {
             document.addEventListener("click", tryAgain);
         } else {
             micPermissionStatus.textContent = `Error: ${this.microphoneInput.getErrorMessage() || "Unknown error"}`;
-            this.config.setMicrophoneChannel(undefined);
-            // Update URL to remove the parameter
-            delete this.urlState.params.microphoneChannel;
-            this.urlState.updateUrl();
+            this.clearMicrophoneChannel();
         }
     }
 }

package/src/web/audio-handler.js

@@ -14,8 +14,8 @@ const StallSpikeHeight = 20;
 
 // Nobody is watching an unfocused window, so its sound can run far behind
 // the picture, deep enough to ride out the browser starving the tab.
-export const UnfocusedLatencyMs = 200;
-export const DefaultLatencyMs = 20;
+const UnfocusedLatencyMs = 200;
+const DefaultLatencyMs = 20;
 
 export class AudioHandler {
     constructor({

package/src/web/autoboot.js

@@ -1,7 +1,7 @@
 import * as utils from "../utils.js";
 import * as utils_atom from "../utils_atom.js";
 import * as tokeniser from "../basic-tokenise.js";
-import { installBasic } from "../basic-loader.js";
+import { basicIdleAddr, installBasic } from "../basic-loader.js";
 
 /** Booting and typing for the machine at startup: shift-break, *TAPE incantations and BASIC programs. */
 export class Autoboot {
@@ -69,7 +69,7 @@ export class Autoboot {
         const tokenised = await t.tokenise(prog);
 
         const { processor } = this;
-        const idleAddr = processor.model.isMaster ? 0xe7e6 : 0xe581;
+        const idleAddr = basicIdleAddr(processor.model);
         const hook = processor.debugInstruction.add((addr) => {
             if (addr !== idleAddr) return;
             installBasic(tokenised, {

package/src/web/config.js

@@ -25,7 +25,7 @@ export function fittedRoms({ model, hasEconet, hasMusic5000, hasTeletextAdaptor
 }
 
 /** The settings the dialog presents as checkboxes. `enables` names a control only usable while ticked. */
-export const CheckboxSettings = [
+const CheckboxSettings = [
     { id: "65c02", field: "coProcessor", restartRequired: true, enables: "tubeCpuMultiplier" },
     { id: "hasTeletextAdaptor", field: "hasTeletextAdaptor", restartRequired: true },
     { id: "hasEconet", field: "hasEconet", restartRequired: true },

package/src/web/front-panel.js

@@ -39,8 +39,6 @@ export class FrontPanel {
                     } else {
                         processor.acia.rewindTape();
                     }
-                } else {
-                    console.log("unknown type", type);
                 }
             });
         }

package/src/web/google-drive-picker.js

@@ -33,18 +33,18 @@ export class GoogleDrivePicker {
 
         // Loading the Google client holds the main thread for ~100ms, so it waits for
         // someone to ask for Drive.
-        document.getElementById("open-drive-link").addEventListener("click", async () => {
+        document.getElementById("open-drive-link").addEventListener("click", async (e) => {
+            e.preventDefault();
             try {
                 await this.googleDrive.initialise();
             } catch (error) {
                 toast(`Google Drive is unavailable: ${errorText(error)}`, { title: "Google Drive" });
-                return false;
+                return;
             }
             const authed = await this.auth(false);
             if (authed) {
                 this.modal.show();
             }
-            return false;
         });
 
         this.el.addEventListener("show.bs.modal", () => this.showList());
@@ -55,9 +55,10 @@ export class GoogleDrivePicker {
         try {
             return await this.googleDrive.authorize(imm);
         } catch (err) {
-            console.log("Error handling google auth: " + err);
+            console.log("Error handling google auth: " + errorText(err));
             this.el.querySelector(".loading").textContent =
-                "There was an error accessing your Google Drive account: " + err;
+                `There was an error accessing your Google Drive account: ${errorText(err)}`;
+            return false;
         }
     }
 
@@ -131,7 +132,6 @@ export class GoogleDrivePicker {
         let name = document.querySelector("#google-drive .disc-name").value;
         if (!name) return;
 
-        this.modals.popupLoading("Connecting to Google Drive");
         this.modal.hide();
         this.modals.popupLoading("Creating '" + name + "' on Google Drive");
 
@@ -150,7 +150,10 @@ export class GoogleDrivePicker {
             // TODO support HFE, I guess?
             const discType = disc.guessDiscTypeFromName(name);
             if (!discType.byteSize) {
-                throw new Error(`Cannot create blank disc of type ${discType.extension} - unknown size`);
+                this.modals.loadingFinished(
+                    `Unable to create ${name} on Google Drive: blank ${discType.extension} discs have no known size`,
+                );
+                return;
             }
             data = new Uint8Array(discType.byteSize);
             if (discType.supportsCatalogue) {

package/src/web/media-loader.js

@@ -309,6 +309,7 @@ export class MediaLoader {
     }
 
     async loadTapeImage(tapeImage) {
+        if (!tapeImage) return null;
         const split = splitImage(tapeImage);
         tapeImage = split.image;
         const schema = split.schema;

package/src/web/modals.js

@@ -7,7 +7,7 @@ import { toast } from "./toast.js";
  * if it was running before.
  */
 export class Modals {
-    constructor({ isRunning, stop, go }) {
+    constructor({ loop }) {
         this.errorDialog = document.getElementById("error-dialog");
         this.errorModal = new bootstrap.Modal(this.errorDialog);
         this.loadingDialog = document.getElementById("loading-dialog");
@@ -18,11 +18,11 @@ export class Modals {
 
         let savedRunning = false;
         document.addEventListener("show.bs.modal", () => {
-            if (!this.anyVisible()) savedRunning = isRunning();
-            if (isRunning()) stop(false);
+            if (!this.anyVisible()) savedRunning = loop.isRunning();
+            if (loop.isRunning()) loop.stop(false);
         });
         document.addEventListener("hidden.bs.modal", () => {
-            if (!this.anyVisible() && savedRunning) go();
+            if (!this.anyVisible() && savedRunning) loop.go();
         });
     }
 

package/src/web/rewind-ui.js

@@ -13,18 +13,14 @@ export class RewindUI {
      * @param {object} options.processor - Cpu6502 instance
      * @param {object} options.video - Video instance
      * @param {number} options.captureInterval - rewind capture interval in frames
-     * @param {function} options.stop - function to pause the emulator
-     * @param {function} options.go - function to resume the emulator
-     * @param {function} options.isRunning - function returning current running state
+     * @param {object} options.loop - the emulation loop, for pausing and resuming
      */
-    constructor({ rewindBuffer, processor, video, captureInterval, stop, go, isRunning }) {
+    constructor({ rewindBuffer, processor, video, captureInterval, loop }) {
         this.rewindBuffer = rewindBuffer;
         this.processor = processor;
         this.video = video;
         this.captureInterval = captureInterval;
-        this.stop = stop;
-        this.go = go;
-        this.isRunning = isRunning;
+        this.loop = loop;
 
         this.panel = document.getElementById("rewind-panel");
         this.filmstrip = document.getElementById("rewind-filmstrip");
@@ -45,6 +41,13 @@ export class RewindUI {
         });
     }
 
+    /** Forget everything captured, as on a hard reset. */
+    reset() {
+        this.close();
+        this.rewindBuffer.clear();
+        this.updateButtonState();
+    }
+
     /** Open the rewind scrubber panel. */
     open() {
         if (this.isOpen) return;
@@ -52,8 +55,8 @@ export class RewindUI {
         this.snapshots = this.rewindBuffer.getAll();
         if (this.snapshots.length === 0) return;
 
-        this.wasRunning = this.isRunning();
-        if (this.wasRunning) this.stop(false);
+        this.wasRunning = this.loop.isRunning();
+        if (this.wasRunning) this.loop.stop(false);
 
         this.isOpen = true;
         this.savedState = this.processor.snapshotState();
@@ -70,7 +73,7 @@ export class RewindUI {
         } catch (e) {
             this.processor.restoreState(this.savedState);
             this._closePanel();
-            if (this.wasRunning) this.go();
+            if (this.wasRunning) this.loop.go();
             throw e;
         }
 
@@ -97,7 +100,7 @@ export class RewindUI {
             this.processor.restoreState(this.snapshots[this.selectedIndex]);
         }
         this._closePanel();
-        if (this.wasRunning) this.go();
+        if (this.wasRunning) this.loop.go();
     }
 
     /**
@@ -107,7 +110,7 @@ export class RewindUI {
         if (!this.isOpen) return;
         this._renderState(this.savedState);
         this._closePanel();
-        if (this.wasRunning) this.go();
+        if (this.wasRunning) this.loop.go();
     }
 
     /** Alias for cancel — closing the panel without explicit commit cancels. */

package/src/web/settings.js

@@ -140,7 +140,7 @@ export class Settings {
             machine.emulationConfig.keyLayout = changed.keyLayout;
             keys.setKeyLayout(changed.keyLayout);
         }
-        if (changed.mouseJoystickEnabled !== undefined || changed.microphoneChannel !== undefined) {
+        if (changed.mouseJoystickEnabled !== undefined || Object.hasOwn(changed, "microphoneChannel")) {
             inputs.updateAdcSources(parsedQuery.mouseJoystickEnabled, parsedQuery.microphoneChannel);
 
             if (changed.microphoneChannel !== undefined) {

package/src/web/snapshot-ui.js

@@ -38,7 +38,7 @@ export function isSnapshotFile(filename, arrayBuffer) {
 }
 
 /** The saved snapshot in whichever of the formats we read the buffer holds. */
-export async function readSnapshot(arrayBuffer) {
+async function readSnapshot(arrayBuffer) {
     if (isBemSnapshot(arrayBuffer)) return await parseBemSnapshot(arrayBuffer);
     if (isUefSnapshot(arrayBuffer)) return parseUefSnapshot(arrayBuffer);
     // Detect gzip (magic bytes 0x1f 0x8b) or plain JSON
@@ -84,7 +84,7 @@ export function snapshotMedia(fdcDrives, params) {
 
 /** Saving and restoring states: the menu item, the file input and the reload across a model change. */
 export class SnapshotUI {
-    constructor({ processor, model, video, media, drives, urlState, modals, isRunning, stop, go }) {
+    constructor({ processor, model, video, media, drives, urlState, modals, loop }) {
         this.processor = processor;
         this.model = model;
         this.video = video;
@@ -92,9 +92,7 @@ export class SnapshotUI {
         this.drives = drives;
         this.urlState = urlState;
         this.modals = modals;
-        this.isRunning = isRunning;
-        this.stop = stop;
-        this.go = go;
+        this.loop = loop;
 
         document.getElementById("save-state").addEventListener("click", async (event) => {
             event.preventDefault();
@@ -110,8 +108,8 @@ export class SnapshotUI {
     }
 
     async saveState() {
-        const wasRunning = this.isRunning();
-        if (wasRunning) this.stop(false);
+        const wasRunning = this.loop.isRunning();
+        if (wasRunning) this.loop.stop(false);
         try {
             const manifest = snapshotMedia(this.processor.fdc.drives, this.urlState.params);
             const snapshot = createSnapshot(this.processor, this.model, manifest);
@@ -122,12 +120,12 @@ export class SnapshotUI {
         } catch (e) {
             this.modals.showError("saving state", e);
         }
-        if (wasRunning) this.go();
+        if (wasRunning) this.loop.go();
     }
 
     async loadStateFromFile(file, preReadBuffer) {
-        const wasRunning = this.isRunning();
-        if (wasRunning) this.stop(false);
+        const wasRunning = this.loop.isRunning();
+        if (wasRunning) this.loop.stop(false);
         try {
             const arrayBuffer = preReadBuffer || (await file.arrayBuffer());
             const snapshot = await readSnapshot(arrayBuffer);
@@ -146,7 +144,7 @@ export class SnapshotUI {
         } catch (e) {
             this.modals.showError("loading state", e);
         }
-        if (wasRunning) this.go();
+        if (wasRunning) this.loop.go();
     }
 
     /** Picks up the state a cross-model reload stashed, once the matching machine is up. */

package/src/web/sth-picker.js

@@ -22,8 +22,18 @@ export class SthPicker {
             document.getElementById("sth-filter").focus();
         });
 
-        const startLoad = () => showArchiveMessage("sth", "sth-list", "Loading catalog from STH archive");
-        const onError = () => showArchiveMessage("sth", "sth-list", "There was an error accessing the STH archive");
+        // Anything that clears the list takes a new ticket; a chain whose ticket is
+        // stale gives up (the same scheme as hfe-picker.js).
+        this.renderTicket = 0;
+
+        const startLoad = () => {
+            this.renderTicket++;
+            showArchiveMessage("sth", "sth-list", "Loading catalog from STH archive");
+        };
+        const onError = () => {
+            this.renderTicket++;
+            showArchiveMessage("sth", "sth-list", "There was an error accessing the STH archive");
+        };
         this.discs = new StairwayToHell(
             startLoad,
             (cat) => this.renderCatalogue(cat, (item) => this.pickDisc(item)),
@@ -95,17 +105,19 @@ export class SthPicker {
     }
 
     renderCatalogue(cat, onClick) {
+        const ticket = ++this.renderTicket;
         clearArchiveList("sth-list");
         const sthList = document.getElementById("sth-list");
         document.querySelector("#sth .loading").style.display = "none";
         const template = sthList.querySelector(".template");
 
         const doSome = (all) => {
+            if (ticket !== this.renderTicket) return;
             const MaxAtATime = 100;
             const Delay = 30;
             const batch = all.slice(0, MaxAtATime);
             const remaining = all.slice(MaxAtATime);
-            const filter = document.getElementById("sth-filter").value;
+            const filter = document.getElementById("sth-filter").value.toLowerCase();
             for (const name of batch) {
                 const row = template.cloneNode(true);
                 row.classList.remove("template");
@@ -117,7 +129,7 @@ export class SthPicker {
                 });
                 row.style.display = name.toLowerCase().indexOf(filter) >= 0 ? "" : "none";
             }
-            if (all.length) setTimeout(() => doSome(remaining), Delay);
+            if (remaining.length) setTimeout(() => doSome(remaining), Delay);
         };
 
         doSome(cat);

package/src/web/url-state.js

@@ -18,6 +18,7 @@ export const UrlParamTypes = {
     hasTeletextAdaptor: ParamTypes.BOOL,
     hasEconet: ParamTypes.BOOL,
     glEnabled: ParamTypes.BOOL,
+    lowLatency: ParamTypes.BOOL,
     fakeVideo: ParamTypes.BOOL,
     logFdcCommands: ParamTypes.BOOL,
     logFdcStateChanges: ParamTypes.BOOL,

package/tests/test-machine.js

@@ -1,4 +1,4 @@
-import { installBasic } from "../src/basic-loader.js";
+import { basicIdleAddr, installBasic } from "../src/basic-loader.js";
 import * as fdc from "../src/fdc.js";
 import { fake6502 } from "../src/fake6502.js";
 import { findModel } from "../src/models.js";
@@ -182,7 +182,7 @@ export class TestMachine {
             assert(hit, "Atom did not reach keyboard input in time");
             return this.runFor(10 * 1000);
         }
-        const idleAddr = this.processor.model.isMaster ? 0xe7e6 : 0xe581;
+        const idleAddr = basicIdleAddr(this.processor.model);
         let hit = false;
         const hook = this.processor.debugInstruction.add((addr) => {
             if (addr === idleAddr) {