-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
137 lines (105 loc) · 4.67 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
<!doctype html>
<head>
<meta charset="utf-8">
<title>cheapo.js — A CoffeeScript CHIP-8 and Super CHIP-8 emulator</title>
<script src="lib/dat.gui.min.js"></script>
<script src="cheapo.js"></script>
<link rel="stylesheet" type="text/css" href="cheapo.css"/>
</head>
<body>
<header>
<h1>cheapo.js</h1><br/>
<h2>A CHIP-8 and Super CHIP-8 emulator</h2>
</header>
<section id="canvas">
</section>
<table id="keyboard">
<tr><td>1</td><td>2</td><td>3</td><td>C</td></tr>
<tr><td>4</td><td>5</td><td>6</td><td>D</td></tr>
<tr><td>7</td><td>8</td><td>9</td><td>E</td></tr>
<tr><td>A</td><td>0</td><td>B</td><td>F</td></tr>
</table>
<!-- This input is never shown but it must be present for the ROM loading to work -->
<input type="file" id="local_rom" style="visibility:hidden"/>
<footer>
<ul>
<li>If some games do not work, play with the CPU > Quirks settings (<a href="http://mir3z.github.io/chip8-emu/doc/#toc1">explanation</a>)</li>
<li>Nice technical references: <a href="http://devernay.free.fr/hacks/chip8/C8TECH10.HTM">Cowgod's</a>, <a href="http://mattmik.com/chip8.html">Matthew Mikolay's</a> and <a href="http://devernay.free.fr/hacks/chip8/schip.txt">Eryk Bryntse's</a></li>
<li>Games from various authors (<a href="http://www.chip8.com/?page=84">CHIP-8</a> / <a href="http://www.chip8.com/?page=85">Super CHIP-8</a>)</li>
<li>Source code <a href="https://github.com/merwaaan/cheapo.js">here</a></li>
</ul></ul>
</footer>
<script>
// Go Cheapo, go!
window.addEventListener('load', function() {
var container = document.getElementById('canvas');
var cheapo = new Cheapo(container);
// GUI
var gui = new dat.GUI();
var game = gui.addFolder('Game');
// Select one of the hosted ROMS...
var games = [
['Animal Race', 'Astro Dodge', 'Blinky', 'Blitz', 'Brix', 'Hidden', 'Lunar Lander', 'Maze', 'Missile', 'Space Invaders', 'Tetris', 'Tic Tac', 'UFO'], // CHIP-8
['Alien', 'Car', 'Field!', 'H. Piper', 'Loopz', 'Joust', 'Rush Hour', 'Sokoban', 'Super Astro Dodge', 'U-Boat'] // Super CHIP-8
];
var hosted = game.add({load: ''}, 'load', games[0].concat(games[1])).name('Select');
function category(label, n) {
var select = document.querySelector('select');
var group = document.createElement('optgroup');
group.label = label;
for (var i = 0; i < n; ++i)
group.appendChild(select.querySelectorAll('option')[0]);
select.appendChild(group);
}
category('CHIP-8', games[0].length);
category('SUPER CHIP-8', games[1].length);
document.querySelector('select').selectedIndex = -1;
hosted.onChange(function(name) {
var request = new XMLHttpRequest(name);
request.open('GET', 'roms/' + name);
request.overrideMimeType("text/plain; charset=x-user-defined");
request.responseType = 'arraybuffer';
request.onload = function() {
cheapo.load(request.response);
};
request.send();
// Remove focus to avoid accidental game changes when playing
document.querySelector('select').blur();
});
// ... Or load a local file
var file_select = document.querySelector('input#local_rom');
game.add({
load: function() {
file_select.click();
}
}, 'load').name('Load a file');
file_select.addEventListener('change', function() {
var reader = new FileReader();
reader.addEventListener('load', function() {
cheapo.load(this.result);
});
reader.readAsArrayBuffer(this.files[0]);
});
game.open();
// Various Settings
var cpu = gui.addFolder('CPU');
cpu.add(cheapo.cpu, 'frequency').min(0).max(5000).name('clock rate');
cpu.add(cheapo.cpu, 'timerFrequency').min(0).max(5000).name('timer rate');
var quirks = cpu.addFolder('Quirks');
quirks.add(cheapo.cpu.quirks, 'I_increment');
quirks.add(cheapo.cpu.quirks, 'VY_shift');
var video = gui.addFolder('Video')
video.add(cheapo.video, 'size').min(1).max(10).step(1);
video.addColor(cheapo.video, 'foreground');
video.addColor(cheapo.video, 'background');
video.add(cheapo.video, 'fullscreen').name('Go full screen');
var audio = gui.addFolder('Audio');
audio.add(cheapo.audio, 'volume').min(0).max(100).step(1);
audio.add(cheapo.audio, 'frequency').min(0).max(1000).step(1);
var input = gui.addFolder('Input');
input.add(cheapo.input, 'visual_keyboard').name('Visual keyboard');
input.add(cheapo.input, 'remap_visual_keyboard').name('Remap keys');
});
</script>
</body>
</html>