jsbeeb 1.1.1

package/src/basic-tokenise.js

@@ -0,0 +1,104 @@
+"use strict";
+import * as utils from "./utils.js";
+import * as models from "./models.js";
+import { fake6502 } from "./fake6502.js";
+
+export async function create() {
+    const cpu = fake6502(models.basicOnly);
+    const callTokeniser = function (line) {
+        // Address of the tokenisation subroutine in the Master's BASIC ROM.
+        // With thanks to http://8bs.com/basic/basic4-8db2.htm
+        const tokeniseBASIC = 0x8db2;
+        // Address of the instruction to intercept where the tail is copied down.
+        const copyIntercept = 0x8ea1;
+        // Set the stack top to this, then execute until the CPU pops past this.
+        const stackTop = 0xf0;
+        // Address to inject the BASIC program text at.
+        const workSpace = 0x1000;
+        // Pointer to the program text.
+        const textPtrLo = 0x37;
+        const textPtrHi = 0x38;
+
+        cpu.pc = tokeniseBASIC;
+        cpu.s = stackTop;
+        let offset = workSpace;
+        // Set flags to indicate that we're at the start of a statement
+        // but have already processed the line number.
+        cpu.writemem(0x3b, 0x00);
+        cpu.writemem(0x3c, 0x00);
+        cpu.writemem(textPtrLo, offset & 0xff);
+        cpu.writemem(textPtrHi, (offset >>> 8) & 0xff);
+        // Set the paged ROM latch to page in the BASIC.
+        cpu.writemem(0xfe30, 12);
+        for (let i = 0; i < line.length; ++i) {
+            cpu.writemem(offset + i, line.charCodeAt(i));
+        }
+        cpu.writemem(offset + line.length, 0x0d);
+        let safety = 20 * 1000 * 1000;
+        let result = "";
+        while (cpu.s <= stackTop) {
+            cpu.execute(1);
+            if (--safety === 0) {
+                break;
+            }
+            if (cpu.pc === copyIntercept) {
+                // Intercept the subroutine in the BASIC ROM which replaces a keyword
+                // with a token and copies down the tail of the line.  The 6502 code
+                // uses the Y register to index the copy and fails if the untokenised
+                // tail is longer than 255 bytes.  It also makes tokenisation O(n²)
+                // for a line with a lot of tokens.
+                //
+                // Instead we copy out the newly processed part and advance the pointer
+                // to the unprocessed part.
+                let to = (cpu.readmemZpStack(textPtrHi) << 8) | cpu.readmemZpStack(textPtrLo);
+                while (offset < to) {
+                    result += String.fromCharCode(cpu.readmem(offset));
+                    offset++;
+                }
+                result += String.fromCharCode(cpu.a);
+                offset += cpu.y;
+                cpu.writememZpStack(textPtrLo, offset & 0xff);
+                cpu.writememZpStack(textPtrHi, (offset >>> 8) & 0xff);
+                ++offset;
+                // Skip over the JSR instruction.
+                cpu.pc += 3;
+            }
+        }
+        for (let i = offset; cpu.readmem(i) !== 0x0d; ++i) {
+            result += String.fromCharCode(cpu.readmem(i));
+        }
+        if (safety === 0) {
+            throw new Error(
+                "Unable to tokenize '" + line + "' - got as far as '" + result + "' pc=" + utils.hexword(cpu.pc),
+            );
+        }
+        return result;
+    };
+    const lineRe = /^([0-9]+)?(.*)/;
+    const tokeniseLine = function (line, lineNumIfNotSpec) {
+        const lineSplit = line.match(lineRe);
+        const lineNum = lineSplit[1] ? parseInt(lineSplit[1]) : lineNumIfNotSpec;
+        const tokens = callTokeniser(lineSplit[2]);
+        if (tokens.length > 251) {
+            throw new Error("Line " + lineNum + " tokenised length " + tokens.length + " > 251 bytes");
+        }
+        return (
+            "\r" +
+            String.fromCharCode((lineNum >>> 8) & 0xff) +
+            String.fromCharCode(lineNum & 0xff) +
+            String.fromCharCode(tokens.length + 4) +
+            tokens
+        );
+    };
+    const tokenise = function (text) {
+        let result = "";
+        text.split("\n").forEach(function (line, i) {
+            if (line) {
+                result += tokeniseLine(line, 10 + i * 10);
+            }
+        });
+        return result + "\r\xff";
+    };
+    await cpu.initialise();
+    return { tokenise };
+}

package/src/canvas.js

@@ -0,0 +1,177 @@
+"use strict";
+import webglDebug from "./lib/webgl-debug.js";
+import { PALCompositeFilter } from "./video-filters/pal-composite.js";
+import { PassthroughFilter } from "./video-filters/passthrough-filter.js";
+
+const DISPLAY_MODE_FILTERS = {
+    pal: PALCompositeFilter,
+    rgb: PassthroughFilter,
+};
+
+export function getFilterForMode(mode) {
+    return DISPLAY_MODE_FILTERS[mode] || DISPLAY_MODE_FILTERS.rgb;
+}
+
+export class Canvas {
+    isWebGl() {
+        return false;
+    }
+
+    constructor(canvas) {
+        this.ctx = canvas.getContext("2d", { alpha: false });
+        if (this.ctx === null) throw new Error("Unable to get a 2D context");
+        this.ctx.fillStyle = "black";
+        this.ctx.fillRect(0, 0, 1024, 625);
+        this.backBuffer = window.document.createElement("canvas");
+        this.backBuffer.width = 1024;
+        this.backBuffer.height = 625;
+        this.backCtx = this.backBuffer.getContext("2d", { alpha: false });
+        this.imageData = this.backCtx.createImageData(this.backBuffer.width, this.backBuffer.height);
+        this.canvasWidth = canvas.width;
+        this.canvasHeight = canvas.height;
+
+        this.fb32 = new Uint32Array(this.imageData.data.buffer);
+    }
+    paint(minx, miny, maxx, maxy, _frameCount) {
+        const width = maxx - minx;
+        const height = maxy - miny;
+        this.backCtx.putImageData(this.imageData, 0, 0, minx, miny, width, height);
+        this.ctx.drawImage(this.backBuffer, minx, miny, width, height, 0, 0, this.canvasWidth, this.canvasHeight);
+    }
+}
+
+const width = 1024;
+const height = 1024;
+export class GlCanvas {
+    isWebGl() {
+        return true;
+    }
+
+    constructor(canvas, filterClass) {
+        // failIfMajorPerformanceCaveat prevents the use of CPU based WebGL
+        // rendering, which is much worse than simply using a 2D canvas for
+        // rendering.
+        const glAttrs = {
+            alpha: false,
+            antialias: false,
+            depth: false,
+            preserveDrawingBuffer: false,
+            stencil: false,
+            failIfMajorPerformanceCaveat: true,
+        };
+        const gl = canvas.getContext("webgl", glAttrs) || canvas.getContext("experimental-webgl", glAttrs);
+        this.gl = gl;
+        if (!gl) {
+            throw new Error("Unable to create a GL context");
+        }
+        const checkedGl = webglDebug.makeDebugContext(gl, function (err, funcName) {
+            throw new Error("Problem creating GL context: " + webglDebug.glEnumToString(err) + " in " + funcName);
+        });
+
+        checkedGl.depthMask(false);
+
+        this.filter = new filterClass(checkedGl);
+        const program = this.filter.program;
+        checkedGl.useProgram(program);
+
+        this.fb8 = new Uint8Array(width * height * 4);
+        this.fb32 = new Uint32Array(this.fb8.buffer);
+        this.texture = checkedGl.createTexture();
+        checkedGl.bindTexture(checkedGl.TEXTURE_2D, this.texture);
+        checkedGl.pixelStorei(checkedGl.UNPACK_ALIGNMENT, 4);
+        checkedGl.texParameteri(checkedGl.TEXTURE_2D, checkedGl.TEXTURE_WRAP_S, checkedGl.CLAMP_TO_EDGE);
+        checkedGl.texParameteri(checkedGl.TEXTURE_2D, checkedGl.TEXTURE_WRAP_T, checkedGl.CLAMP_TO_EDGE);
+        checkedGl.texParameteri(checkedGl.TEXTURE_2D, checkedGl.TEXTURE_MAG_FILTER, checkedGl.LINEAR);
+        checkedGl.texParameteri(checkedGl.TEXTURE_2D, checkedGl.TEXTURE_MIN_FILTER, checkedGl.LINEAR);
+        checkedGl.texImage2D(
+            checkedGl.TEXTURE_2D,
+            0,
+            checkedGl.RGBA,
+            width,
+            height,
+            0,
+            checkedGl.RGBA,
+            checkedGl.UNSIGNED_BYTE,
+            this.fb8,
+        );
+        checkedGl.bindTexture(checkedGl.TEXTURE_2D, null);
+
+        const vertexPositionAttrLoc = checkedGl.getAttribLocation(program, "pos");
+        checkedGl.enableVertexAttribArray(vertexPositionAttrLoc);
+        const vertexPositionBuffer = checkedGl.createBuffer();
+        checkedGl.bindBuffer(checkedGl.ARRAY_BUFFER, vertexPositionBuffer);
+        checkedGl.bufferData(checkedGl.ARRAY_BUFFER, new Float32Array([0, 0, 0, 1, 1, 0, 1, 1]), checkedGl.STATIC_DRAW);
+        checkedGl.vertexAttribPointer(vertexPositionAttrLoc, 2, checkedGl.FLOAT, false, 0, 0);
+
+        const uvAttrLoc = checkedGl.getAttribLocation(program, "uvIn");
+        checkedGl.enableVertexAttribArray(uvAttrLoc);
+        this.uvBuffer = checkedGl.createBuffer();
+        checkedGl.bindBuffer(checkedGl.ARRAY_BUFFER, this.uvBuffer);
+        checkedGl.vertexAttribPointer(uvAttrLoc, 2, checkedGl.FLOAT, false, 0, 0);
+
+        checkedGl.activeTexture(gl.TEXTURE0);
+        checkedGl.bindTexture(gl.TEXTURE_2D, this.texture);
+
+        this.uvFloatArray = new Float32Array(8);
+        this.lastExtent = {};
+
+        console.log("GL Canvas set up");
+    }
+
+    paint(minx, miny, maxx, maxy, frameCount) {
+        const gl = this.gl;
+        // We can't specify a stride for the source, so have to use the full width.
+        gl.texSubImage2D(
+            gl.TEXTURE_2D,
+            0,
+            0,
+            miny,
+            width,
+            maxy - miny,
+            gl.RGBA,
+            gl.UNSIGNED_BYTE,
+            this.fb8.subarray(miny * width * 4, maxy * width * 4),
+        );
+        const extent = { minx, miny, maxx, maxy };
+
+        if (
+            extent.minx !== this.lastExtent.minx ||
+            extent.miny !== this.lastExtent.miny ||
+            extent.maxx !== this.lastExtent.maxx ||
+            extent.maxy !== this.lastExtent.maxy
+        ) {
+            this.lastExtent = extent;
+            minx /= width;
+            maxx /= width;
+            miny /= height;
+            maxy /= height;
+            this.uvFloatArray[0] = minx;
+            this.uvFloatArray[1] = maxy;
+            this.uvFloatArray[2] = minx;
+            this.uvFloatArray[3] = miny;
+            this.uvFloatArray[4] = maxx;
+            this.uvFloatArray[5] = maxy;
+            this.uvFloatArray[6] = maxx;
+            this.uvFloatArray[7] = miny;
+            gl.bindBuffer(gl.ARRAY_BUFFER, this.uvBuffer);
+            gl.bufferData(gl.ARRAY_BUFFER, this.uvFloatArray, gl.DYNAMIC_DRAW);
+        }
+
+        this.filter.setUniforms({ width, height, frameCount });
+
+        gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);
+    }
+}
+
+export function bestCanvas(canvas, filterClass) {
+    try {
+        return new GlCanvas(canvas, filterClass);
+    } catch (e) {
+        console.log("Unable to use OpenGL: " + e);
+        if (filterClass.requiresGl()) {
+            const config = filterClass.getDisplayConfig();
+            console.warn(`${config.name} requires WebGL. Falling back to standard 2D canvas.`);
+        }
+    }
+    return new Canvas(canvas);
+}

package/src/cmos.js

@@ -0,0 +1,141 @@
+"use strict";
+
+const defaultCmos = [
+    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, 0xca, 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;
+
+function getBbcDateTime() {
+    const result = new Date(Date.now() + timeOffset);
+    result.setMilliseconds(0);
+    return result;
+}
+
+function toBcd(value) {
+    return parseInt(value.toString(10), 16);
+}
+
+function fromBcd(value) {
+    return parseInt(value.toString(16), 10);
+}
+
+export class Cmos {
+    constructor(persistence, cmosOverride, econet) {
+        this.store = persistence ? persistence.load() : null;
+        this.persistence = persistence;
+        this.enabled = false;
+        this.isRead = false;
+        this.addressSelect = false;
+        this.dataSelect = false;
+        this.cmosAddr = 0;
+
+        if (!this.store) {
+            this.store = defaultCmos;
+        }
+        if (cmosOverride) {
+            this.store = cmosOverride(this.store);
+        }
+        if (econet) {
+            this.store[0xe] = econet.stationId;
+            if (this.store[0xf] === 0) {
+                // Catch an invalid FS configuration setting (possibly as a result of using a prior version that didn't set a default of 254 in CMOS)
+                this.store[0xf] = 254;
+            }
+        }
+        this.save();
+    }
+
+    save() {
+        if (this.persistence) {
+            this.persistence.save(this.store);
+        }
+    }
+
+    read() {
+        if (!this.enabled) return 0xff;
+        // To drive the bus we need:
+        // - CMOS enabled.
+        // - Address Select low.
+        // - Data Select high.
+        // - Read high.
+
+        if (!this.addressSelect && this.dataSelect && this.isRead) {
+            // The first 10 bytes of CMOS RAM store the RTC clock
+            if (this.cmosAddr < 10) {
+                const current = getBbcDateTime();
+                switch (this.cmosAddr) {
+                    case 0:
+                        return toBcd(current.getSeconds());
+                    case 2:
+                        return toBcd(current.getMinutes());
+                    case 4:
+                        return toBcd(current.getHours());
+                    case 6:
+                        return toBcd(current.getDay() + 1);
+                    case 7:
+                        return toBcd(current.getDate());
+                    case 8:
+                        return toBcd(current.getMonth() + 1);
+                    case 9:
+                        return toBcd(current.getFullYear());
+                }
+            } else {
+                return this.store[this.cmosAddr] & 0xff;
+            }
+        }
+        return 0xff;
+    }
+
+    writeControl(portBpins, portApins, IC32) {
+        this.enabled = !!(portBpins & 0x40);
+        if (!this.enabled) return;
+        const oldDataSelect = this.dataSelect;
+        const oldAddressSelect = this.addressSelect;
+        this.isRead = !!(IC32 & 2);
+        this.dataSelect = !!(IC32 & 4);
+        this.addressSelect = !!(portBpins & 0x80);
+        if (oldAddressSelect && !this.addressSelect) this.cmosAddr = portApins & 0x3f;
+        if (oldDataSelect && !this.dataSelect && !this.addressSelect && !this.isRead) {
+            if (this.cmosAddr > 0xb) {
+                this.store[this.cmosAddr] = portApins;
+                this.save();
+            } else {
+                const bbcTime = getBbcDateTime();
+                switch (this.cmosAddr) {
+                    case 0:
+                        bbcTime.setSeconds(fromBcd(portApins));
+                        break;
+                    case 2:
+                        bbcTime.setMinutes(fromBcd(portApins));
+                        break;
+                    case 4:
+                        bbcTime.setHours(fromBcd(portApins));
+                        break;
+                    // I tried some day offset stuff to lazily simulate the fact the day is separate
+                    // from the date, but I couldn't easily get it to work during the multi-write update
+                    // cycle/ I'm probably being dumb. Or else I should emulate the clock "properly" but
+                    // that seems like an awful lot of work.
+                    // case 6:
+                    //     dayOffset = (bbcTime.getDay() - fromBcd(portApins - 1)) % 7;
+                    //     break;
+                    case 7:
+                        bbcTime.setDate(fromBcd(portApins));
+                        break;
+                    case 8:
+                        bbcTime.setMonth(fromBcd(portApins - 1));
+                        break;
+                    case 9: {
+                        const yearBase = fromBcd(portApins) > 80 ? 1900 : 2000;
+                        bbcTime.setFullYear(fromBcd(portApins) + yearBase);
+                        break;
+                    }
+                }
+                const secondsNow = Math.floor(Date.now() / 1000) * 1000;
+                timeOffset = bbcTime.getTime() - secondsNow;
+            }
+        }
+    }
+}

package/src/config.js

@@ -0,0 +1,165 @@
+"use strict";
+import $ from "jquery";
+import { findModel } from "./models.js";
+import { getFilterForMode } from "./canvas.js";
+
+export class Config {
+    constructor(onChange, onClose) {
+        this.onChange = onChange;
+        this.onClose = onClose;
+        this.changed = {};
+        this.model = null;
+        this.coProcessor = null;
+        const $configuration = document.getElementById("configuration");
+        $configuration.addEventListener("show.bs.modal", () => {
+            this.changed = {};
+            this.setDropdownText(this.model.name);
+            this.set65c02(this.model.tube);
+            this.setTeletext(this.model.hasTeletextAdaptor);
+            this.setMusic5000(this.model.hasMusic5000);
+            this.setEconet(this.model.hasEconet);
+        });
+
+        $configuration.addEventListener("hide.bs.modal", () => this.onClose(this.changed));
+
+        $(".model-menu a").on("click", (e) => {
+            this.changed.model = $(e.target).attr("data-target");
+            this.setDropdownText($(e.target).text());
+        });
+
+        $("#65c02").on("click", () => {
+            this.changed.coProcessor = $("#65c02").prop("checked");
+        });
+
+        $("#hasTeletextAdaptor").on("click", () => {
+            this.changed.hasTeletextAdaptor = $("#hasTeletextAdaptor").prop("checked");
+        });
+
+        $("#hasEconet").on("click", () => {
+            this.changed.hasEconet = $("#hasEconet").prop("checked");
+        });
+
+        $("#hasMusic5000").on("click", () => {
+            this.changed.hasMusic5000 = $("#hasMusic5000").prop("checked");
+        });
+
+        $(".keyboard-menu a").on("click", (e) => {
+            const keyLayout = $(e.target).attr("data-target");
+            this.changed.keyLayout = keyLayout;
+            this.setKeyLayout(keyLayout);
+        });
+
+        $(".mic-channel-option").on("click", (e) => {
+            const channelString = $(e.target).data("channel");
+            const channel = channelString === "" ? undefined : parseInt($(e.target).data("channel"), 10);
+            this.changed.microphoneChannel = channel;
+            this.setMicrophoneChannel(channel);
+        });
+
+        $("#mouseJoystickEnabled").on("click", () => {
+            this.changed.mouseJoystickEnabled = $("#mouseJoystickEnabled").prop("checked");
+        });
+
+        $(".display-mode-option").on("click", (e) => {
+            const mode = $(e.target).data("mode");
+            this.changed.displayMode = mode;
+            this.setDisplayMode(mode);
+            this.onChange({ displayMode: mode });
+        });
+    }
+
+    setMicrophoneChannel(channel) {
+        if (channel !== undefined) {
+            $(".mic-channel-text").text(`Channel ${channel}`);
+        } else {
+            $(".mic-channel-text").text("Disabled");
+        }
+    }
+
+    setMouseJoystickEnabled(enabled) {
+        $("#mouseJoystickEnabled").prop("checked", !!enabled);
+    }
+
+    setDisplayMode(mode) {
+        const config = getFilterForMode(mode).getDisplayConfig();
+        $(".display-mode-text").text(config.name);
+    }
+
+    setModel(modelName) {
+        this.model = findModel(modelName);
+        $(".bbc-model").text(this.model.name);
+    }
+
+    setKeyLayout(keyLayout) {
+        $(".keyboard-layout").text(keyLayout[0].toUpperCase() + keyLayout.substring(1));
+    }
+
+    set65c02(enabled) {
+        enabled = !!enabled;
+        $("#65c02").prop("checked", enabled);
+        this.model.tube = enabled ? findModel("Tube65c02") : null;
+    }
+
+    setEconet(enabled) {
+        enabled = !!enabled;
+        $("#hasEconet").prop("checked", enabled);
+        this.model.hasEconet = enabled;
+
+        if (enabled && this.model.isMaster) {
+            this.addRemoveROM("master/anfs-4.25.rom", true);
+        }
+    }
+
+    setMusic5000(enabled) {
+        enabled = !!enabled;
+        $("#hasMusic5000").prop("checked", enabled);
+        this.model.hasMusic5000 = enabled;
+        this.addRemoveROM("ample.rom", enabled);
+    }
+
+    setTeletext(enabled) {
+        enabled = !!enabled;
+        $("#hasTeletextAdaptor").prop("checked", enabled);
+        this.model.hasTeletextAdaptor = enabled;
+        this.addRemoveROM("ats-3.0.rom", enabled);
+    }
+
+    setDropdownText(modelName) {
+        $("#bbc-model-dropdown .bbc-model").text(modelName);
+    }
+
+    addRemoveROM(romName, required) {
+        if (required && !this.model.os.includes(romName)) {
+            this.model.os.push(romName);
+        } else {
+            let pos = this.model.os.indexOf(romName);
+            if (pos !== -1) {
+                this.model.os.splice(pos, 1);
+            }
+        }
+    }
+
+    mapLegacyModels(parsedQuery) {
+        if (!parsedQuery.model) {
+            return;
+        }
+
+        // "MasterTurbo" = Master + 6502 second processor
+        if (parsedQuery.model.toLowerCase() === "masterturbo") {
+            parsedQuery.model = "Master";
+            parsedQuery.coProcessor = true;
+        }
+
+        // "BMusic5000" = BBC DFS 1.2 + Music 5000
+        if (parsedQuery.model.toLowerCase() === "bmusic5000") {
+            parsedQuery.model = "B-DFS1.2";
+            parsedQuery.hasMusic5000 = true;
+        }
+
+        // "BTeletext" = BBC DFS 1.2 + Teletext adaptor
+        if (parsedQuery.model.toLowerCase() === "bteletext") {
+            parsedQuery.model = "B-DFS1.2";
+            parsedQuery.hasTeletextAdaptor = true;
+        }
+    }
+}