Remove the closure from the Stepper class in web/debugger.js

This commit is contained in:
Jonas Jenwald 2023-09-17 08:06:26 +02:00
parent b49fe5baac
commit 22cd0c6ff8

View File

@ -225,9 +225,9 @@ const StepperManager = (function StepperManagerClosure() {
})(); })();
// The stepper for each page's operatorList. // The stepper for each page's operatorList.
const Stepper = (function StepperClosure() { class Stepper {
// Shorter way to create element and optionally set textContent. // Shorter way to create element and optionally set textContent.
function c(tag, textContent) { #c(tag, textContent) {
const d = document.createElement(tag); const d = document.createElement(tag);
if (textContent) { if (textContent) {
d.textContent = textContent; d.textContent = textContent;
@ -235,7 +235,7 @@ const Stepper = (function StepperClosure() {
return d; return d;
} }
function simplifyArgs(args) { #simplifyArgs(args) {
if (typeof args === "string") { if (typeof args === "string") {
const MAX_STRING_LENGTH = 75; const MAX_STRING_LENGTH = 75;
return args.length <= MAX_STRING_LENGTH return args.length <= MAX_STRING_LENGTH
@ -251,7 +251,7 @@ const Stepper = (function StepperClosure() {
simpleArgs = []; simpleArgs = [];
let i, ii; let i, ii;
for (i = 0, ii = Math.min(MAX_ITEMS, args.length); i < ii; i++) { for (i = 0, ii = Math.min(MAX_ITEMS, args.length); i < ii; i++) {
simpleArgs.push(simplifyArgs(args[i])); simpleArgs.push(this.#simplifyArgs(args[i]));
} }
if (i < args.length) { if (i < args.length) {
simpleArgs.push("..."); simpleArgs.push("...");
@ -260,13 +260,11 @@ const Stepper = (function StepperClosure() {
} }
const simpleObj = {}; const simpleObj = {};
for (const key in args) { for (const key in args) {
simpleObj[key] = simplifyArgs(args[key]); simpleObj[key] = this.#simplifyArgs(args[key]);
} }
return simpleObj; return simpleObj;
} }
// eslint-disable-next-line no-shadow
class Stepper {
constructor(panel, pageIndex, initialBreakPoints) { constructor(panel, pageIndex, initialBreakPoints) {
this.panel = panel; this.panel = panel;
this.breakPoint = 0; this.breakPoint = 0;
@ -280,17 +278,17 @@ const Stepper = (function StepperClosure() {
init(operatorList) { init(operatorList) {
const panel = this.panel; const panel = this.panel;
const content = c("div", "c=continue, s=step"); const content = this.#c("div", "c=continue, s=step");
const table = c("table"); const table = this.#c("table");
content.append(table); content.append(table);
table.cellSpacing = 0; table.cellSpacing = 0;
const headerRow = c("tr"); const headerRow = this.#c("tr");
table.append(headerRow); table.append(headerRow);
headerRow.append( headerRow.append(
c("th", "Break"), this.#c("th", "Break"),
c("th", "Idx"), this.#c("th", "Idx"),
c("th", "fn"), this.#c("th", "fn"),
c("th", "args") this.#c("th", "args")
); );
panel.append(content); panel.append(content);
this.table = table; this.table = table;
@ -321,15 +319,15 @@ const Stepper = (function StepperClosure() {
operatorList.fnArray.length operatorList.fnArray.length
); );
for (let i = this.operatorListIdx; i < operatorsToDisplay; i++) { for (let i = this.operatorListIdx; i < operatorsToDisplay; i++) {
const line = c("tr"); const line = this.#c("tr");
line.className = "line"; line.className = "line";
line.dataset.idx = i; line.dataset.idx = i;
chunk.append(line); chunk.append(line);
const checked = this.breakPoints.includes(i); const checked = this.breakPoints.includes(i);
const args = operatorList.argsArray[i] || []; const args = operatorList.argsArray[i] || [];
const breakCell = c("td"); const breakCell = this.#c("td");
const cbox = c("input"); const cbox = this.#c("input");
cbox.type = "checkbox"; cbox.type = "checkbox";
cbox.className = "points"; cbox.className = "points";
cbox.checked = checked; cbox.checked = checked;
@ -337,37 +335,37 @@ const Stepper = (function StepperClosure() {
cbox.onclick = cboxOnClick; cbox.onclick = cboxOnClick;
breakCell.append(cbox); breakCell.append(cbox);
line.append(breakCell, c("td", i.toString())); line.append(breakCell, this.#c("td", i.toString()));
const fn = opMap[operatorList.fnArray[i]]; const fn = opMap[operatorList.fnArray[i]];
let decArgs = args; let decArgs = args;
if (fn === "showText") { if (fn === "showText") {
const glyphs = args[0]; const glyphs = args[0];
const charCodeRow = c("tr"); const charCodeRow = this.#c("tr");
const fontCharRow = c("tr"); const fontCharRow = this.#c("tr");
const unicodeRow = c("tr"); const unicodeRow = this.#c("tr");
for (const glyph of glyphs) { for (const glyph of glyphs) {
if (typeof glyph === "object" && glyph !== null) { if (typeof glyph === "object" && glyph !== null) {
charCodeRow.append(c("td", glyph.originalCharCode)); charCodeRow.append(this.#c("td", glyph.originalCharCode));
fontCharRow.append(c("td", glyph.fontChar)); fontCharRow.append(this.#c("td", glyph.fontChar));
unicodeRow.append(c("td", glyph.unicode)); unicodeRow.append(this.#c("td", glyph.unicode));
} else { } else {
// null or number // null or number
const advanceEl = c("td", glyph); const advanceEl = this.#c("td", glyph);
advanceEl.classList.add("advance"); advanceEl.classList.add("advance");
charCodeRow.append(advanceEl); charCodeRow.append(advanceEl);
fontCharRow.append(c("td")); fontCharRow.append(this.#c("td"));
unicodeRow.append(c("td")); unicodeRow.append(this.#c("td"));
} }
} }
decArgs = c("td"); decArgs = this.#c("td");
const table = c("table"); const table = this.#c("table");
table.classList.add("showText"); table.classList.add("showText");
decArgs.append(table); decArgs.append(table);
table.append(charCodeRow, fontCharRow, unicodeRow); table.append(charCodeRow, fontCharRow, unicodeRow);
} else if (fn === "restore" && this.indentLevel > 0) { } else if (fn === "restore" && this.indentLevel > 0) {
this.indentLevel--; this.indentLevel--;
} }
line.append(c("td", " ".repeat(this.indentLevel * 2) + fn)); line.append(this.#c("td", " ".repeat(this.indentLevel * 2) + fn));
if (fn === "save") { if (fn === "save") {
this.indentLevel++; this.indentLevel++;
} }
@ -375,11 +373,11 @@ const Stepper = (function StepperClosure() {
if (decArgs instanceof HTMLElement) { if (decArgs instanceof HTMLElement) {
line.append(decArgs); line.append(decArgs);
} else { } else {
line.append(c("td", JSON.stringify(simplifyArgs(decArgs)))); line.append(this.#c("td", JSON.stringify(this.#simplifyArgs(decArgs))));
} }
} }
if (operatorsToDisplay < operatorList.fnArray.length) { if (operatorsToDisplay < operatorList.fnArray.length) {
const lastCell = c("td", "..."); const lastCell = this.#c("td", "...");
lastCell.colspan = 4; lastCell.colspan = 4;
chunk.append(lastCell); chunk.append(lastCell);
} }
@ -434,9 +432,7 @@ const Stepper = (function StepperClosure() {
} }
} }
} }
} }
return Stepper;
})();
const Stats = (function Stats() { const Stats = (function Stats() {
let stats = []; let stats = [];