jsbeeb 1.22.2 → 1.22.4

package/README.md

@@ -1,5 +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)
+[![coverage](https://img.shields.io/endpoint?url=https%3A%2F%2Fbbc.xania.org%2Fcoverage%2Fbadge.json)](https://bbc.xania.org/coverage/index.html)
 
 # jsbeeb - JavaScript BBC Micro Emulator
 
@@ -16,6 +16,7 @@ different peripherals.
 - [Emulator Shortcuts](#emulator-shortcuts)
 - [Printer Output](#printer-output)
 - [Save State and Rewind](#save-state-and-rewind)
+- [Joystick Support](#joystick-support)
 - [Getting Set Up to Run Locally](#getting-set-up-to-run-locally)
 - [Running as a Desktop Application](#running-as-a-desktop-application)
 - [URL Parameters](#url-parameters)
@@ -120,10 +121,10 @@ Save and load full emulator state snapshots from the **State** menu (or `Ctrl+S`
 
 The emulator continuously captures snapshots into a 30-slot rewind buffer (~1 per second). Open the rewind scrubber from **State > Rewind** or press **Alt+PageDown** to browse recent states as a visual filmstrip:
 
-- **Left/Right arrows** — navigate between snapshots (the main screen updates live)
+- **Left/Right arrows**: navigate between snapshots (the main screen updates live)
 - **Click** a thumbnail to jump to that point
-- **Enter** — commit selection and close the panel
-- **Escape** — cancel and restore the original state
+- **Enter**: commit selection and close the panel
+- **Escape**: cancel and restore the original state
 
 ### Joystick Support
 
@@ -146,13 +147,13 @@ presses `SPACE`. To play Superior's Space Invaders on a pad, where `COPY` fires:
 
 The gamepad control names are:
 
-- `FIRE` — every button at once, which is usually what you want for a one-button game
-- `UP` `DOWN` `LEFT` `RIGHT` — both analogue sticks at once, plus one face button each (`UP` is also `A`, `DOWN` is
+- `FIRE`: every button at once, which is usually what you want for a one-button game
+- `UP` `DOWN` `LEFT` `RIGHT`: both analogue sticks at once, plus one face button each (`UP` is also `A`, `DOWN` is
   `X`, `LEFT` is `Y`, `RIGHT` is `B`)
-- `UP1` `DOWN1` `LEFT1` `RIGHT1` — the left stick only; `UP2` `DOWN2` … — the right stick only; `UP3` `DOWN3` … — the
-  face buttons only
-- `A` `B` `X` `Y` `START` `BACK` `LB` `RB` `LT` `RT` — individual buttons, by their Xbox 360 names
-- `FIRE1` `FIRE2` — clicking the left and right sticks
+- `UP1` `DOWN1` `LEFT1` `RIGHT1`: the left stick only; `UP2` `DOWN2` and so on: the right stick only; `UP3` `DOWN3`
+  and so on: the face buttons only
+- `A` `B` `X` `Y` `START` `BACK` `LB` `RB` `LT` `RT`: individual buttons, by their Xbox 360 names
+- `FIRE1` `FIRE2`: clicking the left and right sticks
 
 The BBC key names are the same as for the keyboard, and digits may be written either way round: `GP.A=1` and `GP.A=K1`
 both press `1`. Unlike `KEY.`, gamepad mappings are BBC-only: there's no Atom equivalent. The D-pad's default mapping
@@ -191,7 +192,9 @@ site to make it smaller and faster to load when it's deployed to [https://bbc.xa
 
 ## Running as a Desktop Application
 
-jsbeeb can also run as a standalone desktop application using Electron:
+jsbeeb can also run as a standalone desktop application using Electron. Prebuilt packages (Debian/Ubuntu `.deb`,
+Fedora/RHEL `.rpm` and a Windows installer) are attached to each
+[GitHub release](https://github.com/mattgodbolt/jsbeeb/releases), or you can build your own:
 
 ### Running in Development
 
@@ -235,17 +238,15 @@ USE_SYSTEM_FPM=true npm run electron:build
 **Debian/Ubuntu:**
 
 ```sh
-sudo apt install ./out/dist/jsbeeb_1.0.1_amd64.deb
+sudo apt install ./out/dist/jsbeeb_<version>_amd64.deb
 ```
 
 **Fedora/RHEL/CentOS:**
 
 ```sh
-sudo rpm -i out/dist/jsbeeb-1.0.1.x86_64.rpm
+sudo rpm -i out/dist/jsbeeb-<version>.x86_64.rpm
 ```
 
-**Note:** Electron support was re-enabled in November 2024 after being disabled during the ESM migration in 2021. It now works with Electron 28+ which added full ES Modules support.
-
 ## URL Parameters
 
 - `autoboot` - fakes a shift break
@@ -335,19 +336,11 @@ Note that every update you make means you need to make a new raw link.
 
 If you're looking to help:
 
-- Testing
-  - Play lots of games and report issues either on [GitHub](https://github.com/mattgodbolt/jsbeeb/issues) or by email (
-    matt@godbolt.org).
-- Core
-  - Get the "boo" of the boot "boo-beep" working (disabled currently as the JavaScript startup makes the sound
-    dreadfully choppy on Chrome at least).
-- Save disc support
-  - Local discs need to be made more workable and need an "export" feature
-  - Multiple discs need a UI
-- `git grep -i todo`
-- Optimisation
-  - While every attempt to make things fast has been made, I'm sure there's some more clever things that can be done
-    without compromising emulation accuracy
+- Play lots of games and report anything that doesn't behave like the real machine, either on
+  [GitHub](https://github.com/mattgodbolt/jsbeeb/issues) or by email (matt@godbolt.org).
+- Pick something from the [issue tracker](https://github.com/mattgodbolt/jsbeeb/issues): there's a mix of emulation
+  accuracy work, missing hardware and peripherals, user interface improvements and performance ideas in there, at all
+  levels of difficulty.
 
 ## Tests
 
@@ -370,12 +363,14 @@ For timing correctness, we have:
   correctness-sensitive when it comes to the timers and interrupts of the BBC.
 - Some 65C12-specific read-modify-write tests written by Ed Spittles.
 
-Tests can be run automatically if you have `node` installed - just run `make` and it'll ensure the relevant libraries
-are installed, then it'll run the tests. Please note it can take a while to run the whole test suite.
+Tests are run via npm scripts: `npm test` runs the whole suite. The vitest suites are `npm run test:unit`,
+`npm run test:integration` and `npm run test:shader`; CPU tests are `npm run test:cpu`, and the smoke test is
+`npm run test:smoke` (the shader and smoke tests need Chrome installed). Please note it can take a while to run the
+whole test suite.
 
 ## Thanks
 
-jsbeeb was heavily based on Sarah Walker's C [B-Em emulator](https://github.com/stardot/b-em) -- thanks to her for her
+jsbeeb was heavily based on Sarah Walker's C [B-Em emulator](https://github.com/stardot/b-em); thanks to her for her
 hard work and for open sourcing her code. B-em is now being maintained by a group of enthusiasts - thanks to them too!
 
 Huge thanks to Richard Talbot-Watkins for his advice and help along the way in fathoming out the instruction timings,
@@ -410,7 +405,8 @@ and posted the [video up on YouTube](https://www.youtube.com/watch?v=37jyHQT7fXQ
 
 ## License
 
-This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.
+This project is licensed under the GNU General Public License v3.0 (or later); see the [LICENSE](LICENSE) file for
+details.
 
 ## Contact
 

package/package.json

@@ -7,7 +7,7 @@
   "name": "jsbeeb",
   "description": "Emulate a BBC Micro",
   "repository": "git@github.com:mattgodbolt/jsbeeb.git",
-  "version": "1.22.2",
+  "version": "1.22.4",
   "//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/6502.js

@@ -1195,6 +1195,7 @@ export class Cpu6502 extends Base6502 {
             while (this.model.swram[romIndex]) {
                 romIndex--;
             }
+            if (romIndex < 0) throw new Error("Too many extra ROMs (no free sideways ROM banks)");
 
             awaiting.push(this.loadRom(extraRoms[i_2], this.romOffset + romIndex * 16384));
         }
@@ -1823,7 +1824,11 @@ export class AtomCpu6502 extends Cpu6502 {
 
     // Override loadRom to accept 4KB ROMs
     async loadRom(name, offset) {
-        const data = await utils.loadData("roms/" + name);
+        if (name.indexOf("http") !== 0) name = "roms/" + name;
+        let data = await utils.loadData(name);
+        if (/\.zip/i.test(name)) {
+            data = (await utils.unzipRomImage(data)).data;
+        }
         const len = data.length;
         if (len !== 16384 && len !== 8192 && len !== 4096) {
             throw new Error(`Broken ROM file ${name} (length=${len})`);

package/src/app/electron.js

@@ -4,7 +4,7 @@
 // Handles IPC communication for loading disc/tape images and showing modals from Electron's main process.
 
 function init(args) {
-    const { loadDiscImage, loadTapeImage, loadStateFile, processor, modals, actions, config } = args;
+    const { loadDiscImage, loadTapeImage, loadStateFile, processor, modals, actions, config, media } = args;
     const api = window.electronAPI;
 
     api.onLoadDisc(async (message) => {
@@ -58,7 +58,9 @@ function init(args) {
         config.addEventListener("settings-changed", (e) => {
             api.saveSettings(e.detail);
         });
-        config.addEventListener("media-changed", (e) => {
+    }
+    if (media) {
+        media.addEventListener("media-changed", (e) => {
             api.saveSettings(e.detail);
         });
     }

package/src/cmos.js

@@ -9,11 +9,11 @@
 // STNICC-beeb to hang on the Master 128 because the WD1770 seek overran the
 // vsync window.  Confirmed by @tom-seddon (b2 emulator):
 // https://github.com/mattgodbolt/jsbeeb/issues/576
-const defaultCmos = [
+const defaultCmos = Object.freeze([
     0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xfe, 0x00, 0xeb, 0x00,
     0xc9, 0xff, 0xff, 0x12, 0x00, 0x17, 0xc8, 0x1e, 0x05, 0x00, 0x35, 0xa6, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00,
     0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00,
-];
+]);
 
 let timeOffset = 0;
 
@@ -82,7 +82,7 @@ export class Cmos {
         this.cmosAddr = 0;
 
         if (!this.store) {
-            this.store = defaultCmos;
+            this.store = [...defaultCmos];
         }
         if (cmosOverride) {
             this.store = cmosOverride(this.store);

package/src/main.js

@@ -22,6 +22,7 @@ import { Display } from "./web/display.js";
 import { Layout } from "./web/layout.js";
 import { EmulationLoop, RewindCaptureInterval } from "./web/emulation-loop.js";
 import { KeyboardSetup } from "./web/keyboard-setup.js";
+import { AccessibilitySwitches } from "./web/accessibility-switches.js";
 import { AnalogueInputs } from "./web/analogue-inputs.js";
 import { FrontPanel } from "./web/front-panel.js";
 import { Machine } from "./web/machine.js";
@@ -49,6 +50,7 @@ let secondDiscImage = null;
 const { discImage: queryDiscImage, secondDiscImage: querySecondDisc, mmcImage } = parseMediaParams(parsedQuery);
 if (queryDiscImage) discImage = queryDiscImage;
 if (querySecondDisc) secondDiscImage = querySecondDisc;
+const defaultBootDisc = queryDiscImage ? undefined : discImage;
 const { settings: driveTracks, warnings: driveTrackWarnings } = processDriveTrackParams(parsedQuery);
 
 const extraRoms = [];
@@ -92,19 +94,7 @@ const printer = new Printer({
         }),
 });
 
-const keys = new KeyboardSetup({
-    enterDebugger: () => loop.stop(true),
-    reload: () => window.location.reload(),
-    toggleFast: () => loop.toggleFastAsPossible(),
-    openRewind: () => rewindUI.open(),
-    openPrinter: () => frontPanel.checkPrinterWindow(),
-    pause: () => loop.stop(false),
-    resume: () => loop.go(),
-    onAnyKeyDown: () => {
-        audioHandler.tryResume();
-        inputs.ensureMicrophoneRunning();
-    },
-});
+const accessibilitySwitches = new AccessibilitySwitches();
 
 const settings = new Settings({ urlState });
 const { config, speechOutput, keyLayout, displayMode, audioOutput, speakerAmount } = settings;
@@ -188,7 +178,7 @@ const machine = new Machine({
     cpuMultiplier,
     extraRoms,
     stationId,
-    userPort: keys.userPort,
+    userPort: accessibilitySwitches.userPort,
     printer,
     speechOutput,
     video,
@@ -197,6 +187,26 @@ const machine = new Machine({
 });
 const processor = machine.processor;
 
+const keys = new KeyboardSetup({
+    actions: {
+        enterDebugger: () => loop.stop(true),
+        reload: () => window.location.reload(),
+        toggleFast: () => loop.toggleFastAsPossible(),
+        openRewind: () => rewindUI.open(),
+        openPrinter: () => frontPanel.checkPrinterWindow(),
+        pause: () => loop.stop(false),
+        resume: () => loop.go(),
+        onAnyKeyDown: () => {
+            audioHandler.tryResume();
+            inputs.ensureMicrophoneRunning();
+        },
+    },
+    accessibilitySwitches,
+    processor,
+    dbgr,
+    keyLayout,
+});
+
 const rewindBuffer = new RewindBuffer(30);
 const loop = new EmulationLoop({
     processor,
@@ -225,23 +235,15 @@ loop.addEventListener("running", () => {
 
 const modals = new Modals({ loop });
 
-const drives = new Drives({ fdc: processor.fdc, driveTracks, areYouSure: modals.areYouSure.bind(modals) });
+const drives = new Drives({ fdc: processor.fdc, driveTracks, confirm: modals.confirm.bind(modals) });
 const media = new MediaLoader({
     processor,
     model,
     drives,
     urlState,
-    config,
     modals,
     isSnapshotFile,
     loadSnapshot: (file, buffer) => snapshots.loadStateFromFile(file, buffer),
-    // The archives are created further down; each source resolves when used.
-    sources: {
-        sth: (name) => sthPicker.discs.fetch(name),
-        tapeSth: (name) => sthPicker.tapes.fetch(name),
-        hfe: (path) => hfePicker.archive.fetch(path),
-        drive: (cat, layout) => drivePicker.load(cat, layout),
-    },
 });
 const autoBoot = new Autoboot({
     model,
@@ -257,7 +259,7 @@ const sthPicker = new SthPicker({
     processor,
     autoboot: (image) => autoBoot.boot(image),
 });
-const hfePicker = new HfePicker({
+new HfePicker({
     media,
     drives,
     modals,
@@ -265,7 +267,7 @@ const hfePicker = new HfePicker({
     processor,
     autoboot: (image) => autoBoot.boot(image),
 });
-const drivePicker = new GoogleDrivePicker({ media, drives, modals, processor });
+new GoogleDrivePicker({ media, drives, modals, processor });
 const snapshots = new SnapshotUI({
     processor,
     model,
@@ -275,6 +277,7 @@ const snapshots = new SnapshotUI({
     urlState,
     modals,
     loop,
+    defaultBootDisc,
 });
 
 const inputs = new AnalogueInputs({
@@ -295,8 +298,6 @@ if (parsedQuery.microphoneChannel !== undefined) {
 // Apply ADC source settings from URL parameters
 inputs.updateAdcSources(parsedQuery.mouseJoystickEnabled, parsedQuery.microphoneChannel);
 
-keys.attach({ processor, dbgr, keyLayout });
-
 const frontPanel = new FrontPanel({ processor, model, printer });
 
 // ------------------------------------------------------------------------
@@ -315,7 +316,7 @@ rewindUI.updateButtonState();
 if (processor.fdc) new DiscVisualiser({ fdc: processor.fdc });
 else document.getElementById("disc-visualiser-open").classList.add("disabled");
 
-new Layout({
+const layout = new Layout({
     screenCanvas,
     display,
     embed: parsedQuery.embed !== undefined,
@@ -323,7 +324,7 @@ new Layout({
 });
 
 // Everything a setting can reach now exists.
-settings.wire({ audioHandler, display, quickSettings, machine, keys, inputs, modals });
+settings.wire({ audioHandler, display, layout, quickSettings, machine, keys, inputs, modals });
 
 // ------------------------------------------------------------------------
 // The page's own handlers.
@@ -393,6 +394,7 @@ document.getElementById("soft-reset").addEventListener("click", function (event)
 });
 
 document.getElementById("download-filestore-link").addEventListener("click", function () {
+    if (!processor.filestore) return;
     downloadDriveData(processor.filestore.scsi, "scsi", ".dat");
 });
 
@@ -500,6 +502,7 @@ electron({
     loadTapeImage: media.loadTapeImage.bind(media),
     processor,
     config,
+    media,
     modals: {
         show: (modalId, sthType) => {
             if (modalId === "sth" && sthType) {

package/src/web/accessibility-switches.js

@@ -0,0 +1,26 @@
+/**
+ * The accessibility switches on the user port. Bits 0-7 correspond to switches
+ * 1-8, active low: 0xff = no switches pressed; a clear bit = that switch held.
+ *
+ * On real hardware, the Brilliant Computing switch interface box and special-ed
+ * joystick connect to the User Port only; they do not touch the analogue port
+ * or the System VIA fire buttons (PB4/PB5), which belong to the standard
+ * analogue joystick connector.
+ */
+export class AccessibilitySwitches {
+    constructor() {
+        this.switchState = 0xff;
+        const switches = this;
+        this.userPort = {
+            write() {},
+            read() {
+                return switches.switchState;
+            },
+        };
+    }
+
+    setSwitch(index, held) {
+        if (held) this.switchState &= ~(1 << index);
+        else this.switchState |= 1 << index;
+    }
+}

package/src/web/analogue-inputs.js

@@ -90,8 +90,7 @@ export class AnalogueInputs {
 
     clearMicrophoneChannel() {
         this.config.setMicrophoneChannel(undefined);
-        delete this.urlState.params.microphoneChannel;
-        this.urlState.updateUrl();
+        this.urlState.set({ microphoneChannel: undefined });
     }
 
     async ensureMicrophoneRunning() {

package/src/web/archive-list.js

@@ -28,12 +28,7 @@ export class AutobootTicks {
         for (const check of this.checks) {
             check.addEventListener("click", () => {
                 this.show(check.checked);
-                if (check.checked) {
-                    urlState.params.autoboot = "";
-                } else {
-                    delete urlState.params.autoboot;
-                }
-                urlState.updateUrl();
+                urlState.set({ autoboot: check.checked ? true : undefined });
             });
         }
     }

package/src/web/debug.js

@@ -89,6 +89,48 @@ class MemoryView {
     }
 }
 
+/**
+ * Guesses the address of the instruction before the given one by scoring each
+ * possible run of instructions leading up to it: a point per "common"
+ * instruction (loads, stores, branches, compares, arithmetic and
+ * carry-set/clear that avoid unusual indexing modes) and a large boost for a
+ * run that passes through the current program counter. The highest-scoring
+ * run wins and its last instruction is the answer.
+ * Good test cases:
+ *   Repton 2 @ 2cbb
+ *   MOS @ cfc8
+ * also, just starting from the back of ROM and going up...
+ */
+export function prevInstruction(disassemble, pc, address) {
+    const commonInstructions =
+        /(RTS|B..|JMP|JSR|LD[AXY]|ST[AXY]|TA[XY]|T[XY]A|AD[DC]|SUB|SBC|CLC|SEC|CMP|EOR|ORR|AND|INC|DEC).*/;
+    const uncommonInstrucions = /.*,\s*([XY]|X\))$/;
+
+    address &= 0xffff;
+    let bestAddr = address - 1;
+    let bestScore = 0;
+    for (let startingPoint = address - 20; startingPoint !== address; startingPoint++) {
+        let score = 0;
+        let addr = startingPoint & 0xffff;
+        while (addr < address) {
+            const result = disassemble(addr);
+            if (addr === pc) score += 10;
+            if (result[0].match(commonInstructions) && !result[0].match(uncommonInstrucions)) {
+                score++;
+            }
+            if (result[1] === address) {
+                if (score > bestScore) {
+                    bestScore = score;
+                    bestAddr = addr;
+                    break;
+                }
+            }
+            addr = result[1];
+        }
+    }
+    return bestAddr;
+}
+
 export class Debugger {
     constructor() {
         this.patchInstructions = new Map();
@@ -382,42 +424,7 @@ export class Debugger {
     }
 
     prevInstruction(address) {
-        // Some attempt at making prevInstruction more accurate; score the sequence of instructions leading
-        // up to the target by counting all "common" instructions as a point. The highest-scoring run of
-        // instructions is picked as the most likely, and the previous from that is used. Common instructions
-        // here mean loads, stores, branches, compares, arithmetic and carry-set/clear that don't use "unusual"
-        // indexing modes like abs,X, abs,Y and (zp,X).
-        // Good test cases:
-        //   Repton 2 @ 2cbb
-        //   MOS @ cfc8
-        // also, just starting from the back of ROM and going up...
-        const commonInstructions =
-            /(RTS|B..|JMP|JSR|LD[AXY]|ST[AXY]|TA[XY]|T[XY]A|AD[DC]|SUB|SBC|CLC|SEC|CMP|EOR|ORR|AND|INC|DEC).*/;
-        const uncommonInstrucions = /.*,\s*([XY]|X\))$/;
-
-        address &= 0xffff;
-        let bestAddr = address - 1;
-        let bestScore = 0;
-        for (let startingPoint = address - 20; startingPoint !== address; startingPoint++) {
-            let score = 0;
-            let addr = startingPoint & 0xffff;
-            while (addr < address) {
-                const result = this.disassemble(addr);
-                if (result[0] === this.cpu.pc) score += 10; // huge boost if this instruction was executed
-                if (result[0].match(commonInstructions) && !result[0].match(uncommonInstrucions)) {
-                    score++;
-                }
-                if (result[1] === address) {
-                    if (score > bestScore) {
-                        bestScore = score;
-                        bestAddr = addr;
-                        break;
-                    }
-                }
-                addr = result[1];
-            }
-        }
-        return bestAddr;
+        return prevInstruction((addr) => this.disassemble(addr), this.cpu.pc, address);
     }
 
     updatePrevMem() {
@@ -544,7 +551,7 @@ export class Debugger {
             case "N":
                 this.updatePrevMem();
                 this.cpu.execute(1);
-                self.debug(this.cpu.pc);
+                this.debug(this.cpu.pc);
                 break;
             case "m":
                 this.stepOver();

package/src/web/display.js

@@ -111,9 +111,6 @@ export class Display {
         this.sizeCanvasFor(this.filterClass);
         this.video.paint();
         this.setCrtPic();
-        window.setTimeout(() => window.dispatchEvent(new Event("resize")), 1);
-        // Relayout now as well: the monitor picture may have changed shape.
-        window.dispatchEvent(new Event("resize"));
     }
 
     sizeCanvasFor(filterClass) {

package/src/web/drives.js

@@ -11,7 +11,7 @@ const tracksPerStepFor = (tracks) => (tracks === "40" ? 2 : 1);
  * switches on the Discs menu, and downloading what is in drive 0.
  */
 export class Drives {
-    constructor({ fdc, driveTracks, areYouSure }) {
+    constructor({ fdc, driveTracks, confirm }) {
         this.fdc = fdc;
         this.driveTracks = driveTracks;
         this.saidWritesAreNotKept = false;
@@ -33,7 +33,7 @@ export class Drives {
             if (drive) this.showDriveTracks(driveIndex);
         }
 
-        document.getElementById("download-drive-link").addEventListener("click", () => {
+        document.getElementById("download-drive-link").addEventListener("click", async () => {
             const disc = this.discToDownload();
             if (!disc) return;
             const save = (options) =>
@@ -41,9 +41,8 @@ export class Drives {
             try {
                 save();
             } catch (e) {
-                areYouSure(`${e.message} Save anyway, losing what will not fit?`, "Save anyway", "Cancel", () =>
-                    save({ force: true }),
-                );
+                if (await confirm(`${e.message} Save anyway, losing what will not fit?`, "Save anyway", "Cancel"))
+                    save({ force: true });
             }
         });
 

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

@@ -16,6 +16,7 @@ export class GoogleDrivePicker {
         this.modals = modals;
         this.processor = processor;
         this.googleDrive = loader;
+        media.addSource("drive", (cat, layout) => this.load(cat, layout));
 
         this.authEl = document.getElementById("google-drive-auth");
         this.el = document.getElementById("google-drive");
@@ -27,10 +28,13 @@ export class GoogleDrivePicker {
             this.authEl.style.display = "none";
             e.preventDefault();
             const authed = await this.auth(false);
-            if (authed) this.authResolve();
-            else this.authReject(new Error("Unable to authorize Google Drive"));
+            if (authed) this.authResolve?.(true);
+            else this.authReject?.(new Error("Unable to authorize Google Drive"));
         });
 
+        // Closing the loading dialog while the auth panel waits is a cancellation, not an error.
+        document.getElementById("loading-dialog").addEventListener("hidden.bs.modal", () => this.authResolve?.(false));
+
         // 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 (e) => {
@@ -73,11 +77,21 @@ export class GoogleDrivePicker {
             console.log("Google Drive authed=", authed);
 
             if (!authed) {
-                await new Promise((resolve, reject) => {
-                    this.authResolve = resolve;
-                    this.authReject = reject;
-                    this.authEl.style.display = "";
-                });
+                let granted;
+                try {
+                    granted = await new Promise((resolve, reject) => {
+                        this.authResolve = resolve;
+                        this.authReject = reject;
+                        this.authEl.style.display = "";
+                    });
+                } finally {
+                    this.authResolve = this.authReject = null;
+                }
+                if (!granted) {
+                    console.log("Google Drive authorization dismissed");
+                    this.modals.loadingFinished();
+                    return null;
+                }
             }
 
             const ssd = await this.googleDrive.load(this.processor.fdc, cat.id, layout);
@@ -92,7 +106,8 @@ export class GoogleDrivePicker {
             return ssd;
         } catch (error) {
             console.error("Google Drive loading error:", error);
-            this.modals.loadingFinished(`Unable to load ${cat.name} from Google Drive: ${errorText(error)}`);
+            this.modals.loadingFinished();
+            throw error;
         }
     }
 
@@ -121,8 +136,14 @@ export class GoogleDrivePicker {
                 utils.noteEvent("google-drive", "click", item.name);
                 this.media.setDisc1Image(`gd:${item.id}/${item.name}`);
                 this.modal.hide();
-                const ssd = await this.load(item, this.drives.layoutForDrive(0));
-                if (ssd) this.drives.putDiscIn(0, ssd);
+                try {
+                    const ssd = await this.load(item, this.drives.layoutForDrive(0));
+                    if (ssd) this.drives.putDiscIn(0, ssd);
+                } catch (error) {
+                    toast(`Unable to load ${item.name} from Google Drive: ${errorText(error)}`, {
+                        title: "Google Drive",
+                    });
+                }
             });
         }
     }

package/src/web/hfe-picker.js

@@ -41,6 +41,7 @@ export class HfePicker {
                 showArchiveMessage("hfe", "hfe-list", "There was an error accessing the HFE archive");
             },
         );
+        media.addSource("hfe", (path) => this.archive.fetch(path));
 
         this.modal = new bootstrap.Modal(document.getElementById("hfe"));
         document.getElementById("hfe").addEventListener("shown.bs.modal", () => {

package/src/web/keyboard-setup.js

@@ -2,36 +2,16 @@ import * as utils from "../utils.js";
 import { Keyboard } from "../keyboard.js";
 import { showNotice } from "./reporting.js";
 
-/**
- * The page's keyboard: the emulated one, the browser shortcuts around it, and
- * the accessibility switches on the user port. Built in two steps because the
- * user port has to exist before the processor does, and the keyboard after.
- */
+/** The page's keyboard: the emulated one and the browser shortcuts around it. */
 export class KeyboardSetup {
     /**
-     * @param {object} actions what each shortcut does, supplied late-bound:
+     * @param {object} opts
+     * @param {object} opts.actions what each shortcut does, supplied late-bound:
      *   enterDebugger, reload, toggleFast, openRewind, openPrinter,
      *   pause, resume, onAnyKeyDown
+     * @param {import("./accessibility-switches.js").AccessibilitySwitches} opts.accessibilitySwitches
      */
-    constructor(actions) {
-        this.actions = actions;
-        this.keyboard = null;
-
-        // Accessibility switch state: bits 0-7 correspond to switches 1-8.
-        // Active low: 0xff = no switches pressed; clearing a bit = that switch is pressed.
-        this.switchState = 0xff;
-        const setup = this;
-        this.userPort = {
-            write() {},
-            read() {
-                return setup.switchState;
-            },
-        };
-    }
-
-    /** Initialise keyboard now that processor exists */
-    attach({ processor, dbgr, keyLayout }) {
-        const { actions } = this;
+    constructor({ actions, accessibilitySwitches, processor, dbgr, keyLayout }) {
         const keyboard = (this.keyboard = new Keyboard({
             processor,
             inputEnabledFunction: () => document.activeElement && document.activeElement.id === "paste-text",
@@ -66,22 +46,11 @@ export class KeyboardSetup {
         keyboard.registerKeyHandler(utils.keyCodes.PAGEDOWN, onDown("pagedown", actions.openRewind), alt);
         keyboard.registerKeyHandler(utils.keyCodes.B, onDown(null, actions.openPrinter), ctrl);
 
-        // Register accessibility switch key handlers.
-        // Keys 1-8 (K1-K8) and function keys F1-F8 both map to user port bits 0-7
-        // (active low: pressing the key clears the corresponding bit in &FE60).
-        //
-        // On real hardware, the Brilliant Computing switch interface box and special-ed
-        // joystick connect to the User Port only; they do not touch the analogue port
-        // or the System VIA fire buttons (PB4/PB5), which belong to the standard
-        // analogue joystick connector.  So we only update switchState here.
-        const handleSwitch = (bit) => (down) => {
-            if (down) this.switchState &= ~(1 << bit);
-            else this.switchState |= 1 << bit;
-        };
-
-        // Alt+1-8 and Alt+F1-F8 trigger the switches.  Using Alt means the underlying
-        // key is never forwarded to the BBC Micro (keyboard.js bails out early when a
-        // handler fires), so typing numbers or using function keys works normally.
+        // Alt+1-8 and Alt+F1-F8 trigger the accessibility switches. Using Alt means
+        // the underlying key is never forwarded to the BBC Micro (keyboard.js bails
+        // out early when a handler fires), so typing numbers or using function keys
+        // works normally.
+        const handleSwitch = (index) => (down) => accessibilitySwitches.setSwitch(index, down);
         for (let i = 0; i < 8; i++) {
             keyboard.registerKeyHandler(utils.keyCodes.K1 + i, handleSwitch(i), alt);
             keyboard.registerKeyHandler(utils.keyCodes.F1 + i, handleSwitch(i), alt);
@@ -96,11 +65,7 @@ export class KeyboardSetup {
     }
 
     sendRawKeyboard(keysToSend, checkCapsAndShiftLocks) {
-        if (this.keyboard) {
-            this.keyboard.sendRawKeyboard(keysToSend, checkCapsAndShiftLocks);
-        } else {
-            console.warn("Tried to send keys before keyboard was initialised");
-        }
+        this.keyboard.sendRawKeyboard(keysToSend, checkCapsAndShiftLocks);
     }
 
     clearKeys() {

package/src/web/machine.js

@@ -162,15 +162,17 @@ export class Machine {
         }
 
         if (discImage) {
-            startImageLoad(`disc ${discImage}`, async () =>
-                drives.putDiscIn(0, await media.loadDiscImage(discImage, drives.layoutForDrive(0))),
-            );
+            startImageLoad(`disc ${discImage}`, async () => {
+                const loadedDisc = await media.loadDiscImage(discImage, drives.layoutForDrive(0));
+                if (loadedDisc) drives.putDiscIn(0, loadedDisc);
+            });
         }
 
         if (secondDiscImage) {
-            startImageLoad(`disc ${secondDiscImage}`, async () =>
-                drives.putDiscIn(1, await media.loadDiscImage(secondDiscImage, drives.layoutForDrive(1))),
-            );
+            startImageLoad(`disc ${secondDiscImage}`, async () => {
+                const loadedDisc = await media.loadDiscImage(secondDiscImage, drives.layoutForDrive(1));
+                if (loadedDisc) drives.putDiscIn(1, loadedDisc);
+            });
         }
 
         if (tape) {

package/src/web/media-loader.js

@@ -50,22 +50,20 @@ function readFileAsBinaryString(file) {
  * URL schema can name, the local file inputs, the drop zone and the built-in
  * list. Choosing what goes in a drive funnels through drives.putDiscIn.
  */
-export class MediaLoader {
+export class MediaLoader extends EventTarget {
     /**
      * @param {object} deps
-     * @param {object} deps.sources fetchers keyed by schema: sth, tapeSth and hfe
-     *   resolve an archive name to image data; drive loads a Google Drive file
      * @param {Function} deps.isSnapshotFile says whether a dropped file is a save state
      * @param {Function} deps.loadSnapshot restores a dropped save state
      */
-    constructor({ processor, model, drives, urlState, config, modals, sources, isSnapshotFile, loadSnapshot }) {
+    constructor({ processor, model, drives, urlState, modals, isSnapshotFile, loadSnapshot }) {
+        super();
         this.processor = processor;
         this.model = model;
         this.drives = drives;
         this.urlState = urlState;
-        this.config = config;
         this.modals = modals;
-        this.sources = sources;
+        this.sources = {};
 
         document.getElementById("disc_load").addEventListener("change", async (evt) => {
             if (evt.target.files.length === 0) return;
@@ -105,8 +103,7 @@ export class MediaLoader {
                     tapeName = unzipped.name;
                 }
                 this.setProcessorTape(await loadTapeFromData(tapeName, tapeData, model));
-                delete this.params.tape;
-                urlState.updateUrl();
+                urlState.set({ tape: undefined });
                 modals.hide("tapes");
             } catch (error) {
                 reportLoadFailure(file.name, error);
@@ -167,6 +164,11 @@ export class MediaLoader {
         return this.urlState.params;
     }
 
+    /** Register the fetcher behind an image schema; each picker calls this as it is constructed. */
+    addSource(schema, fetcher) {
+        this.sources[schema] = fetcher;
+    }
+
     /** Route tape to the correct interface (ACIA for BBC, PPIA for Atom) */
     setProcessorTape(tape) {
         if (this.model.isAtom) {
@@ -177,22 +179,18 @@ export class MediaLoader {
     }
 
     setDisc1Image(name) {
-        delete this.params.disc;
-        this.params.disc1 = name;
-        this.urlState.updateUrl();
-        this.config.dispatchEvent(new CustomEvent("media-changed", { detail: { disc1: name } }));
+        this.urlState.set({ disc: undefined, disc1: name });
+        this.dispatchEvent(new CustomEvent("media-changed", { detail: { disc1: name } }));
     }
 
     setDisc2Image(name) {
-        this.params.disc2 = name;
-        this.urlState.updateUrl();
-        this.config.dispatchEvent(new CustomEvent("media-changed", { detail: { disc2: name } }));
+        this.urlState.set({ disc2: name });
+        this.dispatchEvent(new CustomEvent("media-changed", { detail: { disc2: name } }));
     }
 
     setTapeImage(name) {
-        this.params.tape = name;
-        this.urlState.updateUrl();
-        this.config.dispatchEvent(new CustomEvent("media-changed", { detail: { tape: name } }));
+        this.urlState.set({ tape: name });
+        this.dispatchEvent(new CustomEvent("media-changed", { detail: { tape: name } }));
     }
 
     async loadHTMLFile(file) {
@@ -207,15 +205,14 @@ export class MediaLoader {
         // Local file: retain the image bytes for embedding in save-to-file snapshots.
         loadedDisc.setOriginalImage(imageData);
         this.drives.putDiscIn(0, loadedDisc);
-        delete this.params.disc;
-        delete this.params.disc1;
-        this.urlState.updateUrl();
+        this.urlState.set({ disc: undefined, disc1: undefined });
         this.modals.hide("discs");
     }
 
     async loadSCSIFile(file) {
-        const binaryData = await readFileAsBinaryString(file);
         const { processor } = this;
+        if (!processor.filestore) return;
+        const binaryData = await readFileAsBinaryString(file);
         processor.filestore.scsi = utils.stringToUint8Array(binaryData);
 
         processor.filestore.PC = 0x400;

package/src/web/modals.js

@@ -58,26 +58,29 @@ export class Modals {
         if (message) toast(message);
     }
 
-    areYouSure(message, yesText, noText, yesFunc) {
+    /** @returns {Promise<boolean>} true for the yes button; false for any other way out of the dialog */
+    confirm(message, yesText, noText) {
         const yesButton = this.aysEl.querySelector(".ays-yes");
         this.aysEl.querySelector(".context").textContent = message;
         this.aysEl.querySelector(".ays-no").textContent = noText;
         yesButton.textContent = yesText;
-        let confirmed = false;
-        const onYes = () => {
-            confirmed = true;
-            this.aysModal.hide();
-        };
-        yesButton.addEventListener("click", onYes, { once: true });
-        // The "no" button, Escape and a click outside raise no event of their own: they only hide the modal.
-        this.aysEl.addEventListener(
-            "hidden.bs.modal",
-            () => {
-                yesButton.removeEventListener("click", onYes);
-                if (confirmed) yesFunc();
-            },
-            { once: true },
-        );
-        this.aysModal.show();
+        return new Promise((resolve) => {
+            let confirmed = false;
+            const onYes = () => {
+                confirmed = true;
+                this.aysModal.hide();
+            };
+            yesButton.addEventListener("click", onYes, { once: true });
+            // The "no" button, Escape and a click outside raise no event of their own: they only hide the modal.
+            this.aysEl.addEventListener(
+                "hidden.bs.modal",
+                () => {
+                    yesButton.removeEventListener("click", onYes);
+                    resolve(confirmed);
+                },
+                { once: true },
+            );
+            this.aysModal.show();
+        });
     }
 }

package/src/web/settings.js

@@ -39,13 +39,13 @@ export class Settings {
                 if (changed.displayMode) this.applyDisplayMode(changed.displayMode);
             },
             (changed) => this.onDialogClosed(changed),
-            () => {
-                this.targets.modals.areYouSure(
+            async () => {
+                const restart = await this.targets.modals.confirm(
                     "Your change is saved, but only takes effect when the emulator restarts. Restart now?",
                     "Restart now",
                     "Later",
-                    () => window.location.reload(),
                 );
+                if (restart) window.location.reload();
             },
         );
 
@@ -106,8 +106,7 @@ export class Settings {
         this.config.setAudioOutput(output);
         this.targets.quickSettings?.showAudioOutput(output);
         window.localStorage.audioOutput = output;
-        this.urlState.params.audioOutput = output;
-        this.urlState.updateUrl();
+        this.urlState.set({ audioOutput: output });
     }
 
     applySpeakerAmount(amount) {
@@ -123,18 +122,19 @@ export class Settings {
     applyDisplayMode(mode) {
         this.displayMode = mode;
         this.targets.display.setMode(mode);
+        // The monitor picture may have changed shape.
+        this.targets.layout.resize();
         this.config.setDisplayMode(mode);
         this.targets.quickSettings?.showDisplayMode(mode);
         window.localStorage.displayMode = mode;
-        this.urlState.params.displayMode = mode;
-        this.urlState.updateUrl();
+        this.urlState.set({ displayMode: mode });
     }
 
     onDialogClosed(changed) {
         const { urlState } = this;
         const { machine, keys, inputs } = this.targets;
         const parsedQuery = urlState.params;
-        Object.assign(parsedQuery, changed);
+        urlState.set(changed);
         if (changed.keyLayout) {
             window.localStorage.keyLayout = changed.keyLayout;
             machine.emulationConfig.keyLayout = changed.keyLayout;
@@ -155,6 +155,5 @@ export class Settings {
                 machine.processor.tube.cpuMultiplier = changed.tubeCpuMultiplier;
             }
         }
-        urlState.updateUrl();
     }
 }

package/src/web/snapshot-ui.js

@@ -1,7 +1,6 @@
 import * as disc from "../fdc.js";
 import { DiscLayout } from "../disc.js";
 import { downloadBlob } from "../dom-utils.js";
-import { toast } from "./toast.js";
 import {
     createSnapshot,
     restoreSnapshot,
@@ -58,9 +57,14 @@ async function readSnapshot(arrayBuffer) {
  * where they have one, the image bytes where they do not, and CRCs for
  * saying when a source has changed underneath a state.
  */
-export function snapshotMedia(fdcDrives, params) {
+export function snapshotMedia(fdcDrives, params, defaultBootDisc) {
     const manifest = {};
+    const drive0Disc = fdcDrives[0].disc;
     if (params.disc1 || params.disc) manifest.disc1 = params.disc1 || params.disc;
+    // A default boot loads the built-in disc without naming it in the URL; record it by
+    // name so the state can reload it, but only while that disc is still in the drive.
+    else if (defaultBootDisc && drive0Disc && drive0Disc.name === defaultBootDisc && !drive0Disc.originalImageData)
+        manifest.disc1 = defaultBootDisc;
     if (params.disc2) manifest.disc2 = params.disc2;
 
     // For each drive with a disc loaded, include CRC32 for verification
@@ -84,7 +88,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, loop }) {
+    constructor({ processor, model, video, media, drives, urlState, modals, loop, defaultBootDisc }) {
         this.processor = processor;
         this.model = model;
         this.video = video;
@@ -93,6 +97,7 @@ export class SnapshotUI {
         this.urlState = urlState;
         this.modals = modals;
         this.loop = loop;
+        this.defaultBootDisc = defaultBootDisc;
 
         document.getElementById("save-state").addEventListener("click", async (event) => {
             event.preventDefault();
@@ -110,22 +115,27 @@ export class SnapshotUI {
     async saveState() {
         const wasRunning = this.loop.isRunning();
         if (wasRunning) this.loop.stop(false);
+        let failure = null;
         try {
-            const manifest = snapshotMedia(this.processor.fdc.drives, this.urlState.params);
+            const manifest = snapshotMedia(this.processor.fdc.drives, this.urlState.params, this.defaultBootDisc);
             const snapshot = createSnapshot(this.processor, this.model, manifest);
             const json = snapshotToJSON(snapshot);
             const blob = await compressBlob(new Blob([json]));
             const timestamp = new Date().toISOString().replace(/[:.]/g, "-");
             downloadBlob(blob, `jsbeeb-${this.model.name}-${timestamp}.json.gz`);
         } catch (e) {
-            this.modals.showError("saving state", e);
+            failure = e;
         }
+        // Resume before reporting failure: the error dialog pauses a running
+        // loop itself, and resumes it on close.
         if (wasRunning) this.loop.go();
+        if (failure) this.modals.showError("saving state", failure);
     }
 
     async loadStateFromFile(file, preReadBuffer) {
         const wasRunning = this.loop.isRunning();
         if (wasRunning) this.loop.stop(false);
+        let failure = null;
         try {
             const arrayBuffer = preReadBuffer || (await file.arrayBuffer());
             const snapshot = await readSnapshot(arrayBuffer);
@@ -142,9 +152,10 @@ export class SnapshotUI {
             // Force a repaint so the display updates even while paused
             this.video.paint();
         } catch (e) {
-            this.modals.showError("loading state", e);
+            failure = e;
         }
         if (wasRunning) this.loop.go();
+        if (failure) this.modals.showError("loading state", failure);
     }
 
     /** Picks up the state a cross-model reload stashed, once the matching machine is up. */
@@ -192,16 +203,38 @@ export class SnapshotUI {
                 // Retain the image bytes so subsequent saves can re-embed them.
                 loadedDisc.setOriginalImage(imageData);
             }
-            if (!loadedDisc) continue;
-
-            // Verify CRC32 if present
-            if (savedMedia[crcKey] != null && loadedDisc.originalImageCrc32 != null) {
-                if (loadedDisc.originalImageCrc32 !== savedMedia[crcKey]) {
-                    toast(
-                        `${loadedDisc.name} has changed since this state was saved. The state has been restored anyway and may not run correctly.`,
-                        { title: "Restoring state" },
+            if (!loadedDisc) {
+                if (savedMedia[crcKey] != null) {
+                    // A state may name no source (older default-boot saves); the disc
+                    // already in the drive can still satisfy the CRC, but only laid out
+                    // the way the state's dirty tracks expect.
+                    const currentDisc = this.processor.fdc.drives[driveIndex].disc;
+                    const currentLayout = currentDisc?.is40Track ? DiscLayout.expanded40 : DiscLayout.contiguous;
+                    if (
+                        currentDisc &&
+                        currentDisc.originalImageCrc32 === savedMedia[crcKey] &&
+                        currentLayout === layout
+                    )
+                        continue;
+                    const problem = savedMedia[discKey]
+                        ? `The disc for drive ${driveIndex} (${savedMedia[discKey]}) could not be reloaded`
+                        : `This state does not record where the disc in drive ${driveIndex} came from`;
+                    throw new Error(
+                        `${problem}, and the drive does not hold a matching disc. ` +
+                            `Load the right disc, then load the state again.`,
                     );
                 }
+                continue;
+            }
+
+            if (
+                savedMedia[crcKey] != null &&
+                loadedDisc.originalImageCrc32 != null &&
+                loadedDisc.originalImageCrc32 !== savedMedia[crcKey]
+            ) {
+                throw new Error(
+                    `${loadedDisc.name} has changed since this state was saved, so the state cannot be restored over it.`,
+                );
             }
 
             this.drives.putDiscIn(driveIndex, loadedDisc);

package/src/web/sth-picker.js

@@ -46,6 +46,8 @@ export class SthPicker {
             onError,
             true,
         );
+        media.addSource("sth", (name) => this.discs.fetch(name));
+        media.addSource("tapeSth", (name) => this.tapes.fetch(name));
 
         document.addEventListener("click", (e) => {
             const target = e.target.closest("a.sth");

package/src/web/url-state.js

@@ -56,7 +56,8 @@ export const UrlParamTypes = {
 
 /**
  * The page's settings as carried in its URL. `params` is the one parsed
- * object: whoever changes a setting edits it in place and calls updateUrl.
+ * object: whoever changes a setting hands the change to set(), which edits
+ * it in place and writes the URL in one step.
  */
 export class UrlState {
     constructor(location, history, paramTypes = UrlParamTypes) {
@@ -78,6 +79,15 @@ export class UrlState {
         return buildUrlFromParams(this.baseUrl, { ...this.params, ...overrides }, this.paramTypes);
     }
 
+    /** Apply `changes` to the parameters (undefined deletes a key) and push the new URL. */
+    set(changes) {
+        for (const [key, value] of Object.entries(changes)) {
+            if (value === undefined) delete this.params[key];
+            else this.params[key] = value;
+        }
+        this.updateUrl();
+    }
+
     updateUrl() {
         this.history.pushState(null, null, this.url());
     }