Adjusting presentation of Memory and CPU windows

This commit is contained in:
2023-03-11 14:11:57 -06:00
parent 265aeed8cd
commit b77f2a5ab1
6 changed files with 98 additions and 113 deletions
+57 -44
View File
@@ -90,17 +90,10 @@ class CPU extends Toolkit.Window {
// Window visibility
onVisibility(e) {
let firstShow = !this.shown && e.visible;
// Configure instance fields
this.shown = this.shown || e.visible;
// Window visible for the first time
if (firstShow) {
this.disassembler.firstShow();
this.registers .firstShow();
}
// Configure subscriptions
if (!e.visible) {
if (this.registers)
@@ -114,6 +107,16 @@ class CPU extends Toolkit.Window {
}
///////////////////////////// Package Methods /////////////////////////////
// Window is being shown for the first time
firstShow() {
this.disassembler.firstShow();
this.registers .firstShow();
}
}
@@ -166,16 +169,16 @@ class DisassemblerPane extends Toolkit.ScrollPane {
view.addEventListener("wheel" , e=>this.viewWheel (e));
// Label for measuring text dimensions in the disassembler
this.sizer = new Toolkit.Label(cpu.debug.app, {
class : "tk label mono",
this.pc = new Toolkit.Label(cpu.debug.app, {
class : "tk label mono pc",
visible : false,
visibility: true,
style: {
style : {
position: "absolute"
}
});
this.sizer.setText("\u00a0", false); //  
view.append(this.sizer);
this.pc.setText("\u00a0", false); //  
view.append(this.pc);
}
@@ -233,16 +236,15 @@ class DisassemblerPane extends Toolkit.ScrollPane {
viewResize() {
// Error checking
if (!this.sizer)
if (!this.pc)
return;
// Working variables
let tall = this.tall(false) + 1;
let tall = this.tall(false);
let grew = this.lines.length < tall;
// Process all new lines
for (let y = this.lines.length; y < tall; y++) {
let first = y == 0 ? " first" : "";
let resizer = y != 0 ? null :
new ResizeObserver(()=>this.colResize());
@@ -250,12 +252,11 @@ class DisassemblerPane extends Toolkit.ScrollPane {
lblAddress : document.createElement("div"),
lblBytes : [],
lblMnemonic: document.createElement("div"),
lblOperands: document.createElement("div"),
spacer : document.createElement("div")
lblOperands: document.createElement("div")
};
// Address label
line.lblAddress.className = "addr" + first;
line.lblAddress.className = "addr";
if (y == 0)
resizer.observe(line.lblAddress);
this.view.append(line.lblAddress);
@@ -263,7 +264,7 @@ class DisassemblerPane extends Toolkit.ScrollPane {
// Byte labels
for (let x = 0; x < 4; x++) {
let lbl = line.lblBytes[x] = document.createElement("div");
lbl.className = "byte" + first + (x == 0 ? " b0" : "");
lbl.className = "byte" + (x == 0 ? " b0" : "");
if (y == 0) {
lbl.style.minWidth = "0px";
resizer.observe(lbl);
@@ -272,25 +273,20 @@ class DisassemblerPane extends Toolkit.ScrollPane {
}
// Mnemonic label
line.lblMnemonic.className = "inst" + first;
line.lblMnemonic.className = "inst";
if (y == 0)
resizer.observe(line.lblMnemonic);
this.view.append(line.lblMnemonic);
// Operand label
line.lblOperands.className = "ops" + first;
line.lblOperands.className = "ops";
this.view.append(line.lblOperands);
// Growing spacer
line.spacer.className = "spacer" + first;
this.view.append(line.spacer);
// All elements
line.all = line.lblBytes.concat([
line.lblAddress,
line.lblMnemonic,
line.lblOperands,
line.spacer
line.lblOperands
]);
this.lines.push(line);
@@ -302,15 +298,15 @@ class DisassemblerPane extends Toolkit.ScrollPane {
line.lblAddress .remove();
line.lblMnemonic.remove();
line.lblOperands.remove();
line.spacer .remove();
for (let lbl of line.lblBytes)
lbl.remove();
this.lines.splice(tall, 1);
}
// Configure scroll bar
this.hscroll.unitIncrement =
this.sizer.element.getBoundingClientRect().height;
// Configure elements
let lineHeight = this.pc.element.getBoundingClientRect().height;
this.hscroll.unitIncrement = lineHeight;
this.view.element.style.gridAutoRows = lineHeight + "px";
// Update components
if (grew)
@@ -330,7 +326,7 @@ class DisassemblerPane extends Toolkit.ScrollPane {
// Determine how many full lines were scrolled
let scr = Debugger.linesScrolled(e,
this.sizer.element.getBoundingClientRect().height,
this.pc.element.getBoundingClientRect().height,
this.tall(true),
this.delta
);
@@ -419,6 +415,7 @@ class DisassemblerPane extends Toolkit.ScrollPane {
// Component is being displayed for the first time
firstShow() {
this.viewLine = Math.floor(this.tall(true) / 3) + 10;
this.viewResize();
}
// Shrink all columns to fit the current view
@@ -503,11 +500,15 @@ class DisassemblerPane extends Toolkit.ScrollPane {
if (this.bytesColumn)
for (let x = 0; x<4 && this.columnWidths[x]!=0; x++, showBytes++);
// Working variables
let foundPC = false;
let lineHeight = this.pc.element.getBoundingClientRect().height;
// Process all lines
let index = 20 - this.viewLine;
let index = 20 - this.viewLine;
for (let y = 0; y < this.lines.length; y++, index++) {
let line = this.lines[y];
let method = "remove";
let line = this.lines[y];
let isPC = false;
// There is no data for this line
if (index < 0 || this.dasm == null || index >= this.dasm.length) {
@@ -529,17 +530,27 @@ class DisassemblerPane extends Toolkit.ScrollPane {
line.lblOperands.innerText = dasm.operands.join(", ");
for (let x = 0; x < 4; x++)
line.lblBytes[x].innerText = dasm.bytes[x] || "";
if (this.cpu.registers.pc == dasm.rawAddress)
method = "add";
isPC = this.cpu.registers.pc == dasm.rawAddress;
if (this.bytesColumn)
showBytes = Math.max(showBytes, dasm.bytes.length);
}
// Configure whether PC is on this line
for (let elm of line.all)
elm.classList[method]("pc");
if (isPC) {
foundPC = true;
this.pc.element.style.top = lineHeight * y + "px";
for (let elm of line.all)
elm.classList.add("is-pc");
} else {
for (let elm of line.all)
elm.classList.remove("is-pc");
}
}
// Show or hide the PC background
this.pc.visible = foundPC;
// Configure which byte columns are visible
for (let line of this.lines) {
for (let x = 0; x < 4; x++) {
@@ -552,7 +563,7 @@ class DisassemblerPane extends Toolkit.ScrollPane {
// Configure layout
this.view.element.style.gridTemplateColumns =
"repeat(" + (showBytes + 3) + ", max-content) auto";
"repeat(" + (showBytes + 3) + ", max-content)";// auto";
}
// Stop receiving updates from the simulation
@@ -565,10 +576,11 @@ class DisassemblerPane extends Toolkit.ScrollPane {
///////////////////////////// Private Methods /////////////////////////////
// Measure the number of lines visible in the view
tall(fully = null) {
return Math.max(1, Math[fully===null ? "abs" : fully?"floor":"ceil"](
this.view .element.getBoundingClientRect().height /
this.sizer.element.getBoundingClientRect().height
tall(fully) {
return Math.max(1, Math[fully ? "floor" : "ceil"](
(fully ? this.view : this).element
.getBoundingClientRect().height /
this.pc.element.getBoundingClientRect().height
));
}
@@ -1412,6 +1424,7 @@ class RegisterPane extends Toolkit.SplitPane {
// Prepare the initial dimensions of the register lists
this .element.style.width = Math.ceil(bounds.width ) + "px";
this.scrSystem.element.style.height = Math.ceil(bounds.height) + "px";
this.fetch();
}
// Update register lists
+4 -3
View File
@@ -321,9 +321,10 @@ class Memory extends Toolkit.Window {
this.lines.splice(tall, 1);
}
// Configure scroll bar
this.scrHex.hscroll.unitIncrement =
this.sizer.element.getBoundingClientRect().height;
// Configure components
let lineHeight = this.sizer.element.getBoundingClientRect().height;
this.scrHex.hscroll.unitIncrement = lineHeight;
this.hexEditor.element.style.gridAutoRows = lineHeight + "px";
// Update components
if (grew)