126 lines
4.0 KiB
HTML
126 lines
4.0 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en-US">
|
||
<head>
|
||
<meta charset="utf-8" />
|
||
<title>JUMP!! HALT!! CATCH FIRE!!</title>
|
||
|
||
<link rel="stylesheet" href="css/style.css" />
|
||
<script defer src="js/bundle.js"></script>
|
||
</head>
|
||
<body>
|
||
<div class="centred">
|
||
<div style="text-align: center">
|
||
<h3>L'incredibile interprete di RJ</h3>
|
||
</div>
|
||
|
||
<div class="vertical">
|
||
<div class="interpreter spaced horizontal">
|
||
<div class="vertical">
|
||
<div class="container">
|
||
<textarea id="editing" col="60" row="80">
|
||
# This is a sample program that reads two numbers from input, computes their sum, and writes it to output. Read below to learn more about the machine and the syntax.
|
||
|
||
READ 1
|
||
READ 2
|
||
LOAD 1
|
||
ADD 2
|
||
STORE 3
|
||
WRITE 3
|
||
HALT
|
||
</textarea
|
||
>
|
||
<pre id="highlighting" aria-hidden="true"></pre>
|
||
</div>
|
||
</div>
|
||
<div class="right-container vertical">
|
||
<div class="inputcontainter">
|
||
<h3>INPUT:</h3>
|
||
<input
|
||
type="text"
|
||
id="inputqueue"
|
||
pattern="[0-9| ]+"
|
||
value="1 2 3"
|
||
/>
|
||
</div>
|
||
<div class="outputcontainer">
|
||
<h3>OUTPUT:</h3>
|
||
<div class="ioboxes outputbox">
|
||
<p id="outputqueue"></p>
|
||
</div>
|
||
<!-- <input type="text" name="inputqueue" value="" /> -->
|
||
</div>
|
||
<h3>MEMORY:</h3>
|
||
<table id="memtable">
|
||
<tr>
|
||
<th>r0</th>
|
||
<th>r1</th>
|
||
<th>r2</th>
|
||
<th>r3</th>
|
||
<th>r4</th>
|
||
<th>r5</th>
|
||
<th>r6</th>
|
||
<th>r7</th>
|
||
<th>r8</th>
|
||
<th>r9</th>
|
||
</tr>
|
||
<tr>
|
||
<td>0</td>
|
||
<td>0</td>
|
||
<td>0</td>
|
||
<td>0</td>
|
||
<td>0</td>
|
||
<td>0</td>
|
||
<td>0</td>
|
||
<td>0</td>
|
||
<td>0</td>
|
||
<td>0</td>
|
||
</tr>
|
||
</table>
|
||
<p id="messagebox"></p>
|
||
</div>
|
||
|
||
<div>
|
||
<h3>currently loaded program:</h3>
|
||
<div class="ioboxes" id="progbox"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="buttons centred">
|
||
<button id="load" type="button">Load</button>
|
||
<button id="run" type="button">Run</button>
|
||
<button id="run1" type="button">Run single step</button>
|
||
<button id="reset" type="button">Reset</button>
|
||
<!-- <button id="run1" type="button">Reset </button> -->
|
||
</div>
|
||
<details>
|
||
<summary>What is this? Click me to find out</summary>
|
||
|
||
<p>This is a register architecture machine emulator. The full specification can be found <a href="https://git.dekedin.me/raphy/RAM-emu/src/branch/master/ISA.md">here</a>.</p>
|
||
|
||
Here is the full spec, so you don't even need to follow the link:
|
||
|
||
<iframe src="/ISA.html" width="100%" height="100%">
|
||
Your browser doesn’t support the iframe tag.
|
||
</iframe>
|
||
|
||
<h3>Okay, but how do I use this?</h3>
|
||
|
||
Write your program in the leftmost box you see.
|
||
|
||
Press LOAD to actually load the program. You should see the instructions you've just typed on the right now.
|
||
|
||
Press RUN to execute the whole program until it halts.
|
||
Press RUN SINGLE STEP to execute just one instruction.
|
||
|
||
Reset will... reset everything. No program, no input, no output.
|
||
|
||
<h3>I found a bug. What do I do?</h3>
|
||
<p>Contact info can be found on <a href="https://dekedin.me/about">this page.</a></p>
|
||
<h3>This website looks very ugly!! I am a web developer and I think I can do better.</h3>
|
||
<p>I'm VERY GLAD! contact me (link above) or open a pull request <a href="https://git.dekedin.me/raphy/RAM-emu">here</a>.</p>
|
||
</details>
|
||
</div>
|
||
</div>
|
||
</body>
|
||
</html>
|