1
0
mirror of https://github.com/sehugg/8bitworkshop.git synced 2024-12-23 18:31:08 +00:00

refactored into SourceEditor object

This commit is contained in:
Steven Hugg 2018-06-29 20:06:14 -06:00
parent 3cd04bf5df
commit 9b41ae022a
3 changed files with 254 additions and 208 deletions

View File

@ -290,15 +290,14 @@ function showLoopTimingForPC(pc) {
s = minclocks + "-" + maxclocks; s = minclocks + "-" + maxclocks;
if (maxclocks == MAX_CLOCKS) if (maxclocks == MAX_CLOCKS)
s += "+"; s += "+";
var textel = document.createTextNode(s); getActiveEditor().setGutterBytes(line, s);
editor.setGutterMarker(line-1, "gutter-bytes", textel);
} }
} }
} }
function traceTiming() { function traceTiming() {
trace_pending_at_pc = platform.getOriginPC(); trace_pending_at_pc = platform.getOriginPC();
setCode(editor.getValue()); setCode(getActiveEditor().getValue()); // TODO
} }
/////////////// ///////////////

View File

@ -4,7 +4,6 @@ var profilelist;
var pcdata = {}; var pcdata = {};
var prof_reads, prof_writes; var prof_reads, prof_writes;
var dumplines;
function scrollProfileView(_ed) { function scrollProfileView(_ed) {
_ed.on('scroll', function(ed, changeobj) { _ed.on('scroll', function(ed, changeobj) {

450
src/ui.js
View File

@ -66,7 +66,7 @@ var disasmview = CodeMirror(document.getElementById('disassembly'), {
var userPaused; var userPaused;
var editor; var active_editor;
var current_output; var current_output;
var current_preset_entry; var current_preset_entry;
var current_file_id; var current_file_id;
@ -84,15 +84,60 @@ var lastDebugInfo;
var lastDebugState; var lastDebugState;
var memorylist; var memorylist;
var dumplines;
function deleteEditor() { function inspectVariable(ed, name) {
var val;
if (platform.inspect) {
platform.inspect(name);
}
}
function getCurrentPresetTitle() {
if (!current_preset_entry)
return "ROM";
else
return current_preset_entry.title || current_preset_entry.name || "ROM";
}
function setLastPreset(id) {
if (platform_id != 'base_z80') { // TODO
localStorage.setItem("__lastplatform", platform_id);
localStorage.setItem("__lastid_"+platform_id, id);
}
}
function initProject() {
current_project = new CodeProject(newWorker(), platform_id, platform, store);
current_project.callbackResendFiles = function() {
setCode(getActiveEditor().getValue()); // TODO
};
current_project.callbackBuildResult = function(result) {
setCompileOutput(result);
};
current_project.callbackBuildStatus = function(busy) {
if (busy) {
toolbar.addClass("is-busy");
} else {
toolbar.removeClass("is-busy");
}
$('#compile_spinner').css('visibility', busy ? 'visible' : 'hidden');
};
}
// TODO: remove some calls of global functions
function SourceEditor(path) {
var self = this;
var editor;
function deleteEditor() {
if (editor) { if (editor) {
$("#editor").empty(); $("#editor").empty();
editor = null; editor = null;
} }
} }
function newEditor(mode) { function newEditor(mode) {
deleteEditor(); deleteEditor();
var isAsm = mode=='6502' || mode =='z80' || mode=='verilog' || mode=='gas'; // TODO var isAsm = mode=='6502' || mode =='z80' || mode=='verilog' || mode=='gas'; // TODO
editor = CodeMirror(document.getElementById('editor'), { editor = CodeMirror(document.getElementById('editor'), {
@ -123,54 +168,193 @@ function newEditor(mode) {
}); });
//scrollProfileView(editor); //scrollProfileView(editor);
editor.setOption("mode", mode); editor.setOption("mode", mode);
}
function inspectVariable(ed, name) {
var val;
if (platform.inspect) {
platform.inspect(name);
} }
}
function getCurrentPresetTitle() { self.setText = function(text) {
if (!current_preset_entry) // TODO: refactor out all of this
return "ROM"; var tool = platform.getToolForFilename(path);
else
return current_preset_entry.title || current_preset_entry.name || "ROM";
}
function setLastPreset(id) {
if (platform_id != 'base_z80') { // TODO
localStorage.setItem("__lastplatform", platform_id);
localStorage.setItem("__lastid_"+platform_id, id);
}
}
function initProject() {
current_project = new CodeProject(newWorker(), platform_id, platform, store);
current_project.callbackResendFiles = function() {
setCode(editor.getValue()); // TODO
};
current_project.callbackBuildResult = function(result) {
setCompileOutput(result);
};
current_project.callbackBuildStatus = function(busy) {
if (busy) {
toolbar.addClass("is-busy");
} else {
toolbar.removeClass("is-busy");
}
$('#compile_spinner').css('visibility', busy ? 'visible' : 'hidden');
};
}
function loadCode(text, fileid) {
var tool = platform.getToolForFilename(fileid);
newEditor(tool && TOOL_TO_SOURCE_STYLE[tool]); newEditor(tool && TOOL_TO_SOURCE_STYLE[tool]);
editor.setValue(text); // calls setCode() editor.setValue(text); // calls setCode()
editor.clearHistory(); editor.clearHistory();
current_output = null; current_output = null;
setLastPreset(fileid); setLastPreset(path);
}
self.getValue = function() {
return editor.getValue();
}
var lines2errmsg = [];
self.addErrorMarker = function(line, msg) {
var div = document.createElement("div");
div.setAttribute("class", "tooltipbox tooltiperror");
div.style.color = '#ff3333'; // TODO
div.appendChild(document.createTextNode("\u24cd"));
var tooltip = document.createElement("span");
tooltip.setAttribute("class", "tooltiptext");
if (lines2errmsg[line])
msg = lines2errmsg[line] + "\n" + msg;
tooltip.appendChild(document.createTextNode(msg));
lines2errmsg[line] = msg;
div.appendChild(tooltip);
editor.setGutterMarker(line, "gutter-info", div);
}
self.markErrors = function(errors) {
// TODO: move cursor to error line if offscreen?
toolbar.addClass("has-errors");
editor.clearGutter("gutter-info");
var numLines = editor.lineCount();
for (var info of errors) {
var line = info.line-1;
if (line < 0 || line >= numLines) line = numLines-1;
self.addErrorMarker(line, info.msg);
}
}
self.updateListing = function(sourcefile) {
// update editor annotations
// TODO: do incrementally for performance
editor.clearGutter("gutter-info");
editor.clearGutter("gutter-bytes");
editor.clearGutter("gutter-offset");
editor.clearGutter("gutter-clock");
// TODO: support multiple files
var lstlines = sourcefile.lines || [];
for (var info of lstlines) {
if (info.offset >= 0) {
var textel = document.createTextNode(hex(info.offset,4));
editor.setGutterMarker(info.line-1, "gutter-offset", textel);
}
if (info.insns) {
var insnstr = info.insns.length > 9 ? ("...") : info.insns;
var textel = document.createTextNode(insnstr);
editor.setGutterMarker(info.line-1, "gutter-bytes", textel);
if (info.iscode) {
var opcode = parseInt(info.insns.split()[0], 16);
if (platform.getOpcodeMetadata) {
var meta = platform.getOpcodeMetadata(opcode, info.offset);
var clockstr = meta.minCycles+"";
var textel = document.createTextNode(clockstr);
editor.setGutterMarker(info.line-1, "gutter-clock", textel);
}
}
}
}
}
self.setGutterBytes = function(line, s) {
var textel = document.createTextNode(s);
editor.setGutterMarker(line-1, "gutter-bytes", textel);
}
self.setCurrentLine = function(line) {
function addCurrentMarker(line) {
var div = document.createElement("div");
div.style.color = '#66ffff'; // TODO
div.appendChild(document.createTextNode("\u25b6"));
editor.setGutterMarker(line, "gutter-info", div);
}
self.clearCurrentLine();
if (line>0) {
addCurrentMarker(line-1);
editor.setSelection({line:line,ch:0}, {line:line-1,ch:0}, {scroll:true});
currentDebugLine = line;
}
}
self.clearCurrentLine = function() {
if (currentDebugLine) {
editor.clearGutter("gutter-info");
editor.setSelection(editor.getCursor()); // TODO??
currentDebugLine = 0;
}
}
self.getLine = function(line) {
return editor.getLine(line-1);
}
self.getCurrentLine = function() {
return editor.getCursor().line+1;
}
// bitmap editor (TODO: refactor)
function handleWindowMessage(e) {
//console.log("window message", e.data);
if (e.data.bytes) {
editor.replaceSelection(e.data.bytestr);
}
if (e.data.close) {
$("#pixeditback").hide();
}
}
function openBitmapEditorWithParams(fmt, bytestr, palfmt, palstr) {
$("#pixeditback").show();
window.addEventListener("message", handleWindowMessage, false); // TODO: remove listener
pixeditframe.contentWindow.postMessage({fmt:fmt, bytestr:bytestr, palfmt:palfmt, palstr:palstr}, '*');
}
function lookBackwardsForJSONComment(line, req) {
var re = /[/;][*;]([{].+[}])[*;][/;]/;
while (--line >= 0) {
var s = editor.getLine(line);
var m = re.exec(s);
if (m) {
var jsontxt = m[1].replace(/([A-Za-z]+):/g, '"$1":'); // fix lenient JSON
var obj = JSON.parse(jsontxt);
if (obj[req]) {
var start = {obj:obj, line:line, ch:s.indexOf(m[0])+m[0].length};
var line0 = line;
var pos0 = start.ch;
line--;
while (++line < editor.lineCount()) {
var l = editor.getLine(line);
var endsection;
if (platform_id == 'verilog')
endsection = l.indexOf('end') >= pos0;
else
endsection = l.indexOf(';') >= pos0;
if (endsection) {
var end = {line:line, ch:editor.getLine(line).length};
return {obj:obj, start:start, end:end};
}
pos0 = 0;
}
line = line0;
}
}
}
}
self.openBitmapEditorAtCursor = function() {
if ($("#pixeditback").is(":visible")) {
$("#pixeditback").hide(250);
return;
}
var line = editor.getCursor().line + 1;
var data = lookBackwardsForJSONComment(self.getCurrentLine(), 'w');
if (data && data.obj && data.obj.w>0 && data.obj.h>0) {
var paldata = lookBackwardsForJSONComment(data.start.line-1, 'pal');
var palbytestr;
if (paldata) {
palbytestr = editor.getRange(paldata.start, paldata.end);
paldata = paldata.obj;
}
editor.setSelection(data.end, data.start);
openBitmapEditorWithParams(data.obj, editor.getSelection(), paldata, palbytestr);
} else {
alert("To edit graphics, move cursor to a constant array preceded by a comment in the format:\n\n/*{w:,h:,bpp:,count:...}*/\n\n(See code examples)");
}
}
}
// TODO: support multiple editors
function getActiveEditor() {
return active_editor;
} }
// can pass integer or string id // can pass integer or string id
@ -192,7 +376,8 @@ function loadProject(preset_id) {
if (err) { if (err) {
alert(err); alert(err);
} else if (result && result.length) { } else if (result && result.length) {
loadCode(result[0].data, preset_id); // TODO active_editor = new SourceEditor(preset_id);
active_editor.setText(result[0].data); // TODO
} }
}); });
} }
@ -281,7 +466,7 @@ function _shareFile(e) {
} }
var github = new Octokat(); var github = new Octokat();
var files = {}; var files = {};
var text = editor.getValue(); var text = getActiveEditor().getValue();
files[getCurrentFilename()] = {"content": text}; files[getCurrentFilename()] = {"content": text};
var gistdata = { var gistdata = {
"description": '8bitworkshop.com {"platform":"' + platform_id + '"}', "description": '8bitworkshop.com {"platform":"' + platform_id + '"}',
@ -317,7 +502,7 @@ function _downloadROMImage(e) {
} }
function _downloadSourceFile(e) { function _downloadSourceFile(e) {
var blob = new Blob([editor.getValue()], {type: "text/plain;charset=utf-8"}); var blob = new Blob([getActiveEditor().getValue()], {type: "text/plain;charset=utf-8"});
saveAs(blob, getCurrentFilename()); saveAs(blob, getCurrentFilename());
} }
@ -369,6 +554,7 @@ function updateSelector() {
}); });
} }
// TODO
function setCode(text) { function setCode(text) {
current_project.updateFile(current_file_id, text, false); current_project.updateFile(current_file_id, text, false);
} }
@ -395,32 +581,10 @@ function setCompileOutput(data) {
addr2symbol = invertMap(symbolmap); addr2symbol = invertMap(symbolmap);
addr2symbol[0x10000] = '__END__'; // TODO? addr2symbol[0x10000] = '__END__'; // TODO?
compparams = data.params; compparams = data.params;
var sed = getActiveEditor();
// errors? // errors?
var lines2errmsg = [];
function addErrorMarker(line, msg) {
var div = document.createElement("div");
div.setAttribute("class", "tooltipbox tooltiperror");
div.style.color = '#ff3333'; // TODO
div.appendChild(document.createTextNode("\u24cd"));
var tooltip = document.createElement("span");
tooltip.setAttribute("class", "tooltiptext");
if (lines2errmsg[line])
msg = lines2errmsg[line] + "\n" + msg;
tooltip.appendChild(document.createTextNode(msg));
lines2errmsg[line] = msg;
div.appendChild(tooltip);
editor.setGutterMarker(line, "gutter-info", div);
}
if (data.errors && data.errors.length > 0) { if (data.errors && data.errors.length > 0) {
// TODO: move cursor to error line if offscreen? sed.markErrors(data.errors);
toolbar.addClass("has-errors");
editor.clearGutter("gutter-info");
var numLines = editor.lineCount();
for (info of data.errors) {
var line = info.line-1;
if (line < 0 || line >= numLines) line = numLines-1;
addErrorMarker(line, info.msg);
}
current_output = null; current_output = null;
} else { } else {
// load ROM // load ROM
@ -442,7 +606,7 @@ function setCompileOutput(data) {
} catch (e) { } catch (e) {
console.log(e); // TODO: show error console.log(e); // TODO: show error
toolbar.addClass("has-errors"); toolbar.addClass("has-errors");
addErrorMarker(0, e+""); sed.addErrorMarker(0, e+"");
current_output = null; current_output = null;
} }
} else if (rom.program_rom_variable) { //TODO: a little wonky... } else if (rom.program_rom_variable) { //TODO: a little wonky...
@ -450,34 +614,7 @@ function setCompileOutput(data) {
rom_changed = true; rom_changed = true;
} }
if (rom_changed || trace_pending_at_pc) { if (rom_changed || trace_pending_at_pc) {
// update editor annotations sed.updateListing(sourcefile);
// TODO: do incrementally for performance
editor.clearGutter("gutter-info");
editor.clearGutter("gutter-bytes");
editor.clearGutter("gutter-offset");
editor.clearGutter("gutter-clock");
// TODO: support multiple files
var lstlines = sourcefile.lines || [];
for (var info of lstlines) {
if (info.offset >= 0) {
var textel = document.createTextNode(hex(info.offset,4));
editor.setGutterMarker(info.line-1, "gutter-offset", textel);
}
if (info.insns) {
var insnstr = info.insns.length > 9 ? ("...") : info.insns;
var textel = document.createTextNode(insnstr);
editor.setGutterMarker(info.line-1, "gutter-bytes", textel);
if (info.iscode) {
var opcode = parseInt(info.insns.split()[0], 16);
if (platform.getOpcodeMetadata) {
var meta = platform.getOpcodeMetadata(opcode, info.offset);
var clockstr = meta.minCycles+"";
var textel = document.createTextNode(clockstr);
editor.setGutterMarker(info.line-1, "gutter-clock", textel);
}
}
}
}
} }
updateDisassembly(); updateDisassembly();
if (trace_pending_at_pc) { if (trace_pending_at_pc) {
@ -487,29 +624,6 @@ function setCompileOutput(data) {
trace_pending_at_pc = null; trace_pending_at_pc = null;
} }
function setCurrentLine(line) {
function addCurrentMarker(line) {
var div = document.createElement("div");
div.style.color = '#66ffff'; // TODO
div.appendChild(document.createTextNode("\u25b6"));
editor.setGutterMarker(line, "gutter-info", div);
}
clearCurrentLine();
if (line>0) {
addCurrentMarker(line-1);
editor.setSelection({line:line,ch:0}, {line:line-1,ch:0}, {scroll:true});
currentDebugLine = line;
}
}
function clearCurrentLine() {
if (currentDebugLine) {
editor.clearGutter("gutter-info");
editor.setSelection(editor.getCursor()); // TODO??
currentDebugLine = 0;
}
}
function showMemory(state) { function showMemory(state) {
var s = state && platform.cpuStateToLongString && platform.cpuStateToLongString(state.c); var s = state && platform.cpuStateToLongString && platform.cpuStateToLongString(state.c);
if (s) { if (s) {
@ -538,7 +652,7 @@ function setupBreakpoint() {
var line = sourcefile.findLineForOffset(PC); var line = sourcefile.findLineForOffset(PC);
if (line >= 0) { if (line >= 0) {
console.log("BREAKPOINT", hex(PC), line); console.log("BREAKPOINT", hex(PC), line);
setCurrentLine(line); getActiveEditor().setCurrentLine(line); // TODO
} else { } else {
console.log("BREAKPOINT", hex(PC)); console.log("BREAKPOINT", hex(PC));
// TODO: switch to disasm // TODO: switch to disasm
@ -576,7 +690,7 @@ function _resume() {
function resume() { function resume() {
clearBreakpoint(); clearBreakpoint();
if (! platform.isRunning() ) { if (! platform.isRunning() ) {
clearCurrentLine(); getActiveEditor().clearCurrentLine(); // TODO
} }
_resume(); _resume();
userPaused = false; userPaused = false;
@ -592,9 +706,6 @@ function singleFrameStep() {
platform.runToVsync(); platform.runToVsync();
} }
function getCurrentLine() {
return editor.getCursor().line+1;
}
function getDisasmViewPC() { function getDisasmViewPC() {
var line = disasmview.getCursor().line; var line = disasmview.getCursor().line;
@ -607,7 +718,7 @@ function getDisasmViewPC() {
} }
function getCurrentPC() { function getCurrentPC() {
var line = getCurrentLine(); var line = getActiveEditor().getCurrentLine(); // TODO
while (line >= 0) { while (line >= 0) {
// TODO: what if in disassembler? // TODO: what if in disassembler?
var pc = sourcefile.line2offset[line]; var pc = sourcefile.line2offset[line];
@ -698,7 +809,7 @@ function updateDisassembly() {
var disasm = platform.disassemble(a, platform.readAddress); var disasm = platform.disassemble(a, platform.readAddress);
var srclinenum = sourcefile.offset2line[a]; var srclinenum = sourcefile.offset2line[a];
if (srclinenum) { if (srclinenum) {
var srcline = editor.getLine(srclinenum-1); var srcline = getActiveEditor().getLine(srclinenum);
if (srcline && srcline.trim().length) { if (srcline && srcline.trim().length) {
s += "; " + srclinenum + ":\t" + srcline + "\n"; s += "; " + srclinenum + ":\t" + srcline + "\n";
curline++; curline++;
@ -834,6 +945,7 @@ function getDumpLineAt(line) {
var IGNORE_SYMS = {s__INITIALIZER:true, /* s__GSINIT:true, */ _color_prom:true}; var IGNORE_SYMS = {s__INITIALIZER:true, /* s__GSINIT:true, */ _color_prom:true};
// TODO: addr2symbol for ca65; and make it work without symbols
function getDumpLines() { function getDumpLines() {
if (!dumplines && addr2symbol) { if (!dumplines && addr2symbol) {
dumplines = []; dumplines = [];
@ -917,73 +1029,6 @@ function toggleMemoryWindow() {
} }
} }
function handleWindowMessage(e) {
//console.log("window message", e.data);
if (e.data.bytes) {
editor.replaceSelection(e.data.bytestr);
}
if (e.data.close) {
$("#pixeditback").hide();
}
}
function openBitmapEditorWithParams(fmt, bytestr, palfmt, palstr) {
$("#pixeditback").show();
pixeditframe.contentWindow.postMessage({fmt:fmt, bytestr:bytestr, palfmt:palfmt, palstr:palstr}, '*');
}
function lookBackwardsForJSONComment(line, req) {
var re = /[/;][*;]([{].+[}])[*;][/;]/;
while (--line >= 0) {
var s = editor.getLine(line);
var m = re.exec(s);
if (m) {
var jsontxt = m[1].replace(/([A-Za-z]+):/g, '"$1":'); // fix lenient JSON
var obj = JSON.parse(jsontxt);
if (obj[req]) {
var start = {obj:obj, line:line, ch:s.indexOf(m[0])+m[0].length};
var line0 = line;
var pos0 = start.ch;
line--;
while (++line < editor.lineCount()) {
var l = editor.getLine(line);
var endsection;
if (platform_id == 'verilog')
endsection = l.indexOf('end') >= pos0;
else
endsection = l.indexOf(';') >= pos0;
if (endsection) {
var end = {line:line, ch:editor.getLine(line).length};
return {obj:obj, start:start, end:end};
}
pos0 = 0;
}
line = line0;
}
}
}
}
function openBitmapEditorAtCursor() {
if ($("#pixeditback").is(":visible")) {
$("#pixeditback").hide(250);
return;
}
var data = lookBackwardsForJSONComment(getCurrentLine(), 'w');
if (data && data.obj && data.obj.w>0 && data.obj.h>0) {
var paldata = lookBackwardsForJSONComment(data.start.line-1, 'pal');
var palbytestr;
if (paldata) {
palbytestr = editor.getRange(paldata.start, paldata.end);
paldata = paldata.obj;
}
editor.setSelection(data.end, data.start);
openBitmapEditorWithParams(data.obj, editor.getSelection(), paldata, palbytestr);
} else {
alert("To edit graphics, move cursor to a constant array preceded by a comment in the format:\n\n/*{w:,h:,bpp:,count:...}*/\n\n(See code examples)");
}
}
function _recordVideo() { function _recordVideo() {
var canvas = $("#emulator").find("canvas")[0]; var canvas = $("#emulator").find("canvas")[0];
if (!canvas) { if (!canvas) {
@ -1057,6 +1102,10 @@ function _fastestFrameRate() {
setFrameRateUI(60); setFrameRateUI(60);
} }
function _openBitmapEditor() {
getActiveEditor().openBitmapEditorAtCursor();
}
function setupDebugControls(){ function setupDebugControls(){
$("#dbg_reset").click(resetAndDebug); $("#dbg_reset").click(resetAndDebug);
$("#dbg_pause").click(pause); $("#dbg_pause").click(pause);
@ -1095,7 +1144,7 @@ function setupDebugControls(){
$("#dbg_disasm").click(toggleDisassembly).show(); $("#dbg_disasm").click(toggleDisassembly).show();
} }
$("#disassembly").hide(); $("#disassembly").hide();
$("#dbg_bitmap").click(openBitmapEditorAtCursor); $("#dbg_bitmap").click(_openBitmapEditor);
$(".dropdown-menu").collapse({toggle: false}); $(".dropdown-menu").collapse({toggle: false});
$("#item_new_file").click(_createNewFile); $("#item_new_file").click(_createNewFile);
$("#item_upload_file").click(_uploadNewFile); $("#item_upload_file").click(_uploadNewFile);
@ -1260,7 +1309,6 @@ function loadSharedFile(sharekey) {
// start // start
function startUI(loadplatform) { function startUI(loadplatform) {
installErrorHandler(); installErrorHandler();
window.addEventListener("message", handleWindowMessage, false);
// add default platform? // add default platform?
platform_id = qs['platform'] || localStorage.getItem("__lastplatform"); platform_id = qs['platform'] || localStorage.getItem("__lastplatform");
if (!platform_id) { if (!platform_id) {