add status leds and their setting callback
This commit is contained in:
parent
55f1cebc6e
commit
83f24f3694
85
index.html
85
index.html
|
@ -4,8 +4,24 @@
|
|||
<meta charset="utf-8">
|
||||
<style>
|
||||
body {
|
||||
border: 0;
|
||||
margin: 30px;
|
||||
font-family: monospace;
|
||||
font-size: 14px;
|
||||
}
|
||||
div {
|
||||
border: 0;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
p, pre {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
line-height: 20px;
|
||||
}
|
||||
.switch {
|
||||
margin: 0 13px 0 0;
|
||||
padding: 0;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
@ -15,15 +31,52 @@
|
|||
<hr>
|
||||
|
||||
<p>
|
||||
<input type="button" value="INIT" onclick="init();">
|
||||
<input type="button" value="TEST" onclick="test();">
|
||||
<input type="button" value="POWER ON" onclick="powerOn();">
|
||||
<input type="button" value="POWER OFF" onclick="powerOff();">
|
||||
<input type="button" value="RUN" onclick="run();">
|
||||
<input type="button" value="STOP" onclick="stop();">
|
||||
<input type="button" value="SINGLE STEP" onclick="singleStep();">
|
||||
</p>
|
||||
<p>
|
||||
<input type="button" value="EXAMINE" onclick="examine();">
|
||||
<input type="button" value="EXAMINE NEXT" onclick="examineNext();">
|
||||
<input type="button" value="DEPOSIT" onclick="deposit();">
|
||||
<input type="button" value="DEPOSIT NEXT" onclick="depositNext();">
|
||||
<input type="button" value="RESET" onclick="reset();">
|
||||
<input type="button" value="CLR" disabled>
|
||||
</p>
|
||||
<p>
|
||||
<input type="button" value="PROTECT" disabled>
|
||||
<input type="button" value="UNPROTECT" disabled>
|
||||
<input type="button" value="AUX" disabled>
|
||||
<input type="button" value="AUX" disabled>
|
||||
</p>
|
||||
|
||||
<hr>
|
||||
|
||||
<p>LEDs: <!-- ● - on. ○ - off. -->
|
||||
<div id="status-leds">
|
||||
<p>
|
||||
INTE <span class="led">○</span>
|
||||
PROT <span class="led">○</span>
|
||||
MEMR <span class="led">●</span>
|
||||
INP <span class="led">○</span>
|
||||
MI <span class="led">●</span>
|
||||
OUT <span class="led">○</span>
|
||||
HLTA <span class="led">○</span>
|
||||
STACK <span class="led">○</span>
|
||||
WO <span class="led">●</span>
|
||||
INT <span class="led">○</span>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div id="wait-leds">
|
||||
<p>
|
||||
WAIT <span id="wait-led" class="led">●</span>
|
||||
HLDA <span class="led">○</span>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div id="data-leds">
|
||||
<p>
|
||||
D7 D6 D5 D4 D3 D2 D1 D0<br>
|
||||
|
@ -58,6 +111,28 @@
|
|||
<span id="a0" class="led">○</span>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div id="switches">
|
||||
<p>
|
||||
<input type="checkbox" id="s15" class="switch" value="">
|
||||
<input type="checkbox" id="s14" class="switch" value="">
|
||||
<input type="checkbox" id="s13" class="switch" value="">
|
||||
<input type="checkbox" id="s12" class="switch" value="">
|
||||
<input type="checkbox" id="s11" class="switch" value="">
|
||||
<input type="checkbox" id="s10" class="switch" value="">
|
||||
<input type="checkbox" id="s9" class="switch" value="">
|
||||
<input type="checkbox" id="s8" class="switch" value="">
|
||||
<input type="checkbox" id="s7" class="switch" value="">
|
||||
<input type="checkbox" id="s6" class="switch" value="">
|
||||
<input type="checkbox" id="s5" class="switch" value="">
|
||||
<input type="checkbox" id="s4" class="switch" value="">
|
||||
<input type="checkbox" id="s3" class="switch" value="">
|
||||
<input type="checkbox" id="s2" class="switch" value="">
|
||||
<input type="checkbox" id="s1" class="switch" value="">
|
||||
<input type="checkbox" id="s0" class="switch" value="">
|
||||
</p>
|
||||
</div>
|
||||
|
||||
</p>
|
||||
|
||||
<hr>
|
||||
|
@ -89,10 +164,16 @@
|
|||
}
|
||||
}
|
||||
|
||||
function setWaitLedCallback(isRunning) {
|
||||
var ledElem = document.getElementById('wait-led');
|
||||
ledElem.innerHTML = isRunning ? '○' : '●';
|
||||
}
|
||||
|
||||
var dumpCpuElem = document.getElementById('cpu');
|
||||
var dumpMemElem = document.getElementById('mem');
|
||||
var sim = new Sim8800(256, 1000000,
|
||||
setAddressLedsCallback, setDataLedsCallback,
|
||||
setWaitLedCallback,
|
||||
dumpCpuElem, dumpMemElem);
|
||||
|
||||
function init() {
|
||||
|
|
|
@ -28,6 +28,8 @@ class Sim8800 {
|
|||
* callback to set address LEDs.
|
||||
* @param {function(Array<number>)?} setDataLedsCallback The
|
||||
* callback to set data LEDs.
|
||||
* @param {function(boolean)?} setWaitLedCallback The callback to
|
||||
* set the WAIT LED.
|
||||
* @param {Element?} dumpCpuElem The DOM element used to render
|
||||
* dumped CPU status. null to disable the feature.
|
||||
* @param {Element?} dumpMemElem The DOM element used to render
|
||||
|
@ -35,11 +37,13 @@ class Sim8800 {
|
|||
*/
|
||||
constructor(memSize, clockRate,
|
||||
setAddressLedsCallback, setDataLedsCallback,
|
||||
setWaitLedCallback,
|
||||
dumpCpuElem, dumpMemElem) {
|
||||
this.clockRate = clockRate;
|
||||
this.mem = new Array(memSize);
|
||||
this.setAddressLedsCallback = setAddressLedsCallback;
|
||||
this.setDataLedsCallback = setDataLedsCallback;
|
||||
this.setWaitLedCallback = setWaitLedCallback;
|
||||
this.dumpCpuElem = dumpCpuElem;
|
||||
this.dumpMemElem = dumpMemElem;
|
||||
this.running = false;
|
||||
|
@ -294,6 +298,9 @@ class Sim8800 {
|
|||
*/
|
||||
stop() {
|
||||
this.running = false;
|
||||
if (this.setWaitLedCallback) {
|
||||
this.setWaitLedCallback(this.running);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -301,6 +308,9 @@ class Sim8800 {
|
|||
*/
|
||||
start() {
|
||||
this.running = true;
|
||||
if (this.setWaitLedCallback) {
|
||||
this.setWaitLedCallback(this.running);
|
||||
}
|
||||
window.setTimeout(this.getClockTickerCallback(), 1);
|
||||
}
|
||||
};
|
||||
|
|
Loading…
Reference in New Issue
Block a user