Skip to content

Commit

Permalink
Merge pull request #329 from MARIE-js/add_feature_dma_display
Browse files Browse the repository at this point in the history
Implement a memory-mapped 16x16 pixel display
  • Loading branch information
cyderize committed Mar 21, 2024
2 parents 2f18c7e + 9e777a7 commit a8f1b89
Show file tree
Hide file tree
Showing 3 changed files with 77 additions and 5 deletions.
11 changes: 11 additions & 0 deletions src/css/plain.css
Original file line number Diff line number Diff line change
Expand Up @@ -522,3 +522,14 @@ codeblock {
.simComponents{
resize: both;
}

#dma-display-memory-container {
margin: 20px;
}

.dma-display-cell {
width: 10px;
height: 10px;
border: 0.5px solid lightgray;
background-color: black;
}
60 changes: 57 additions & 3 deletions src/js/interface.js
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,8 @@ window.addEventListener("load", function() {
memoryContainer = document.getElementById("memory-container"),
memoryHeaders = document.getElementById("memory-headers"),
memory = document.getElementById("memory"),
dmaDisplayMemoryContainer = document.getElementById("dma-display-memory-container"),
dmaDisplayMemory = document.getElementById("dma-display-memory"),
statusInfo = document.getElementById("status-info"),
outputSelect = document.getElementById("output-select"),
outputLog = document.getElementById("output-log"),
Expand Down Expand Up @@ -287,7 +289,7 @@ window.addEventListener("load", function() {
programCodeMirror.clearGutter("breakpoints");
}

function populateMemoryView(sim) {
function populateMemoryView() {
while (memory.firstChild) {
memory.removeChild(memory.firstChild);
}
Expand Down Expand Up @@ -321,14 +323,47 @@ window.addEventListener("load", function() {
cell = document.createElement("td");
cell.id = "cell" + (i + j);
cell.className = "cell";
cell.appendChild(document.createTextNode(Utility.hex(sim.memory[i + j].contents)));
cell.appendChild(document.createTextNode(Utility.hex(0)));
tr.appendChild(cell);
}

memory.appendChild(tr);
}

memoryContainer.style.display = "inline-block";

while (dmaDisplayMemory.firstChild) {
dmaDisplayMemory.removeChild(dmaDisplayMemory.firstChild);
}
for (i = 0xf00; i < 4096; i += 16) {
tr = document.createElement("tr");

for (j = 0; j < 16; j++) {
cell = document.createElement("td");
cell.id = "dma-display-cell" + (i + j);
cell.className = "dma-display-cell";
tr.appendChild(cell);
}

dmaDisplayMemory.appendChild(tr);
}
dmaDisplayMemoryContainer.style.display = "inline-block";
}

function updateMemoryView(sim) {
// Populate memory cells from sim
for (var i = 0; i < 4096; i += 1) {
var cell = document.getElementById("cell" + i);
cell.textContent = Utility.hex(sim.memory[i].contents);
}
for (var i = 0xf00; i < 4096; i += 1) {
var cell = document.getElementById("dma-display-cell" + i);
var blue = Math.round((sim.memory[i].contents & 0x1f) / 31.0 * 255.0);
var green = Math.round(((sim.memory[i].contents >> 5) & 0x1f) / 31.0 * 255.0);
var red = Math.round(((sim.memory[i].contents >> 10) & 0x1f) / 31.0 * 255.0);
var color = "#"+red.toString(16)+green.toString(16)+blue.toString(16);
cell.style = "background-color: "+color+";";
}
}

function finishInputReplaceMemoryCell() {
Expand Down Expand Up @@ -713,6 +748,8 @@ window.addEventListener("load", function() {
}
});

populateMemoryView();

function finishInput(output) {
var type = $('#input-type').val(),
value = $('#input-value').val().split(" ").join("");
Expand Down Expand Up @@ -1071,6 +1108,7 @@ window.addEventListener("load", function() {

try {
sim = new MarieSim(asm, inputFunc, outputFunc);
updateMemoryView(sim);
} catch (e) {
setStatus(e.message, true);
assembleButton.innerHTML = "<span class='fa fa-th'></span> Assemble";
Expand Down Expand Up @@ -1128,7 +1166,6 @@ window.addEventListener("load", function() {
}
});

populateMemoryView(sim);
symbolCells = populateWatchList(asm, sim);
initializeOutputLog();
initializeRegisterLog();
Expand All @@ -1151,6 +1188,15 @@ window.addEventListener("load", function() {
cell.textContent = Utility.hex(e.newCell.contents, false);
cell.classList.add("memory-changed");

if (e.address >= 0xF00) {
var dmaDisplayCell = document.getElementById("dma-display-cell" + e.address);
var blue = Math.round((e.newCell.contents & 0x1f) / 31.0 * 255.0);
var green = Math.round(((e.newCell.contents >> 5) & 0x1f) / 31.0 * 255.0);
var red = Math.round(((e.newCell.contents >> 10) & 0x1f) / 31.0 * 255.0);
var color = "#"+red.toString(16)+green.toString(16)+blue.toString(16);
dmaDisplayCell.style = "background-color: "+color+";";
}

for (var address in symbolCells) {
if (address == e.address) {
symbolCells[address].textContent = Utility.hex(e.newCell.contents);
Expand Down Expand Up @@ -1262,6 +1308,14 @@ window.addEventListener("load", function() {
sim.memory[action.address].contents = action.value;
var cell = document.getElementById("cell" + action.address);
cell.textContent = Utility.hex(action.value, false);
if (action.address >= 0xf00) {
var dmaDisplayCell = document.getElementById("dma-display-cell" + action.address);
var blue = Math.round((action.value & 0x1f) / 31.0 * 255.0);
var green = Math.round(((action.value >> 5) & 0x1f) / 31.0 * 255.0);
var red = Math.round(((action.value >> 10) & 0x1f) / 31.0 * 255.0);
var color = "#"+red.toString(16)+green.toString(16)+blue.toString(16);
dmaDisplayCell.style = "background-color: "+color+";";
}
for (var address in symbolCells) {
if (address == action.address) {
symbolCells[address].textContent = Utility.hex(action.value);
Expand Down
11 changes: 9 additions & 2 deletions src/templates/index.ejs
Original file line number Diff line number Diff line change
Expand Up @@ -34,8 +34,9 @@
<ul class="nav nav-tabs">
<li class="active"><a data-toggle="tab" href="#output-log-outer">Output log</a></li>
<li><a data-toggle="tab" href="#register-log-outer">RTL log</a></li>
<li><a data-toggle="tab" href="#watch-list-outer">Watch list</a></li>
<li><a data-toggle="tab" href="#input-list-outer">Input list</a></li>
<li><a data-toggle="tab" href="#watch-list-outer">Watches</a></li>
<li><a data-toggle="tab" href="#input-list-outer">Inputs</a></li>
<li><a data-toggle="tab" href="#display-outer">Display</a></li>
</ul>
<div class="tab-content">
<div id="output-log-outer" class="tab-pane in active">
Expand Down Expand Up @@ -77,6 +78,12 @@
<hr>
<textarea id="input-list"></textarea>
</div>
<div id="display-outer" class="tab-pane">
<div id="dma-display-memory-container">
<span>16x16 display, 0xF00-0xFFF:</span>
<table id="dma-display-memory"></table>
</div>
</div>
</div>
</div>
</div>
Expand Down

0 comments on commit a8f1b89

Please sign in to comment.