Chipvuelto8/index.html

62 lines
1.3 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Chip 8 emulator Test</title>
<style>
body {
background-color: #000;
color: #EEE;
}
#emulator-screen{
border: 1px solid pink;
}
</style>
<script src="./dist/revuelto8ts.js"></script>
</head>
<body>
<h1>Chip 8 emulator</h1>
<!-- Original screen is 64x32 -->
<canvas id="emulator-screen" width="512" height="256"></canvas>
<script>
const emulator = new Revuelto8ts.Chip8Emulator();
let fullDirRoms = [
'./roms/1-chip8-logo.ch8',
'./roms/2-ibm-logo.ch8',
'./roms/3-corax+.ch8',
'./roms/4-flags.ch8',
'./roms/5-quirks.ch8',
'./roms/6-keypad.ch8',
'./roms/7-beep.ch8',
'./roms/8-scrolling.ch8',
'./roms/Maze[David Winter, 199x].ch8',
];
// Load ROM
fetch(fullDirRoms[3])
.then(response => response.arrayBuffer())
.then(arrayBufferRom => {
let romData = new Uint8Array(arrayBufferRom);
emulator.loadRom(romData);
});
const emulatorCanvas = document.getElementById('emulator-screen');
setInterval(function() {
if(emulator.isRomLoaded()) {
//console.log(emulator.getCPUStatus());
emulator.emulateCycle();
emulator.drawToCanvas(emulatorCanvas, 8);
}
}, 5);
</script>
</body>
</html>