diff --git a/package.json b/package.json index 0ca23f1..d44d5de 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "windows95", "productName": "windows95", - "version": "1.0.0", + "version": "1.1.0", "description": "Windows 95, in an app. I'm sorry.", "main": "src/index.js", "scripts": { @@ -18,7 +18,10 @@ "forge": "./forge.config.js" }, "standard": { - "globals": [ "V86Starter", "windows95" ], + "globals": [ + "V86Starter", + "windows95" + ], "ignore": [ "/src/renderer/lib/*.js" ] diff --git a/src/renderer/index.html b/src/renderer/index.html index d18eafc..a5db04c 100644 --- a/src/renderer/index.html +++ b/src/renderer/index.html @@ -24,6 +24,17 @@
Reset Machine & Delete State
+
Insert Floppy Disk
+
Discard State & Boot From Scratch
+ +
+
+

+

You can insert a floppy disk image with the ".img" format.

+

+ Boot the machine from scratch if you've inserted a new floppy disk to + make sure that Windows can load it. +

diff --git a/src/renderer/renderer.js b/src/renderer/renderer.js index 2f03684..b000ae8 100644 --- a/src/renderer/renderer.js +++ b/src/renderer/renderer.js @@ -1,6 +1,11 @@ -const BUTTONS = document.querySelector('#buttons') +const $ = document.querySelector.bind(document) +const $$ = document.querySelectorAll.bind(document) + +const BUTTONS = $('#buttons') let cursorCaptured = false +let floppyFile = null +let bootFresh = false const OPTIONS = { win95: { @@ -21,15 +26,25 @@ async function main (id) { }, vga_bios: { url: './bios/vgabios.bin' - } + }, + fda: { + buffer: floppyFile || undefined + }, + boot_order: 0x132 }, OPTIONS[id]) // New v86 instance window.emulator = new V86Starter(opts) + + //high-dpi support + var scale = window.devicePixelRatio; + window.emulator.screen_adapter.set_scale(scale,scale); // Restore state. We can't do this right away. setTimeout(async () => { - await windows95.restoreState() + if (!bootFresh) { + await windows95.restoreState() + } cursorCaptured = true window.emulator.lock_mouse() @@ -37,17 +52,21 @@ async function main (id) { }, 500) } +function start (id) { + BUTTONS.remove() + document.body.className = '' + setupClickListener() + main(id) +} + function setupButtons () { - document.querySelectorAll('.btn-start').forEach((btn) => { - btn.addEventListener('click', () => { - BUTTONS.remove() - document.body.className = '' - main(btn.id) - setupClickListener() - }) + // Start + $$('.btn-start').forEach((btn) => { + btn.addEventListener('click', () => start(btn.id)) }) - document.querySelector('#reset').addEventListener('click', () => { + // Reset + $('#reset').addEventListener('click', () => { if (window.emulator.stop) { window.emulator.stop() } @@ -58,7 +77,29 @@ function setupButtons () { window.emulator.run() } - document.querySelector('#reset').disabled = true + $('#reset').disabled = true + }) + + $('#discard-state').addEventListener('click', () => { + bootFresh = true + + start('win95') + }) + + // Floppy + $('#floppy').addEventListener('click', () => { + $('#file-input').click() + }) + + // Floppy (Hidden Input) + $('#file-input').addEventListener('change', (event) => { + floppyFile = event.target.files && event.target.files.length > 0 + ? event.target.files[0] + : null + + if (floppyFile) { + $('#floppy-path').innerHTML = `Inserted Floppy Disk: ${floppyFile.path}` + } }) } diff --git a/src/renderer/style/style.css b/src/renderer/style/style.css index d16740e..58e453b 100644 --- a/src/renderer/style/style.css +++ b/src/renderer/style/style.css @@ -1,8 +1,32 @@ html, body { margin: 0; padding: 0; +} + +body { background: #000; - /* cursor: none; */ +} + +body.paused > #emulator { + display: none; +} + +body.paused { + background: #008080; + font-family: Courier; +} + +#floppy-path { + background: beige; + padding: 5px; +} + +#information { + text-align: center; + position: absolute; + width: 100vw; + bottom: 50px; + font-size: 18px; } #emulator { @@ -13,7 +37,7 @@ html, body { margin: auto; } -body.paused > #emulator { +#file-input { display: none; }