From f8532b44aa41a53a6c2b56a245d9cec04b50a059 Mon Sep 17 00:00:00 2001 From: Steven Hugg Date: Wed, 23 Jun 2021 11:27:22 -0500 Subject: [PATCH] verilog: better scope zoom in/out, labels --- src/ide/waveform.ts | 56 +++++++++++++++++++++++++++++------------ src/platform/verilog.ts | 4 ++- 2 files changed, 43 insertions(+), 17 deletions(-) diff --git a/src/ide/waveform.ts b/src/ide/waveform.ts index 6ede26f3..e2d22fb8 100644 --- a/src/ide/waveform.ts +++ b/src/ide/waveform.ts @@ -27,6 +27,7 @@ export class WaveformView { parent : HTMLElement; wfp : WaveformProvider; toolbar : Toolbar; + clklabel : HTMLElement; wavelist; meta : WaveformMeta[]; lines : HTMLCanvasElement[] = []; @@ -37,6 +38,7 @@ export class WaveformView { clocksPerPage : number; clockMax : number; hexformat : boolean = false; + scrollbarWidth = 12; constructor(parent:HTMLElement, wfp:WaveformProvider) { this.parent = parent; @@ -64,14 +66,19 @@ export class WaveformView { this.toolbar.destroy(); this.toolbar = null; } + if (this.clklabel) { + this.clklabel.remove(); + this.clklabel = null; + } } _recreate() { this.meta = this.wfp.getSignalMetadata(); if (!this.meta) return; - var width = this.pageWidth = $(this.parent).width(); + var width = $(this.parent).width(); + this.pageWidth = width - this.scrollbarWidth; var rowHeight = 40; // TODO - this.clocksPerPage = Math.floor(this.pageWidth/this.zoom) - 1; + this.setClocksPerPage(); this.clockMax = 0; this.wavelist = new VirtualList({ w: width, @@ -83,7 +90,7 @@ export class WaveformView { //var s = metarow != null ? metarow.label : ""; let linediv = document.createElement("div"); let canvas = document.createElement("canvas"); - canvas.width = width - 12; + canvas.width = width - 12; // room for scrollbar canvas.height = rowHeight; linediv.appendChild(canvas); //document.createTextNode(s)); linediv.classList.add('waverow'); @@ -98,6 +105,7 @@ export class WaveformView { } }; linediv.classList.add('editable'); + linediv.style.cursor = 'grab'; } return linediv; } @@ -107,10 +115,9 @@ export class WaveformView { //wlc.style = "overflow-x: hidden"; // TODO? this.toolbar = new Toolbar(this.parent, this.parent); this.toolbar.span.css('display','inline-block'); - //var clklabel = document.createElement('span'); - //clklabel.style.display = 'inline-block'; - //clklabel.innerHTML = "TEST"; - //$(this.parent).append(clklabel); + this.clklabel = document.createElement('span'); + this.clklabel.innerText = "-"; + $(this.parent).append(this.clklabel); $(this.parent).append(wlc); var down = false; @@ -142,7 +149,7 @@ export class WaveformView { this.setSelTime(0); this.setOrgTime(0); }); - this.toolbar.add('ctrl+left', 'Move left 1/4 page', 'glyphicon-fast-backward', (e,combo) => { + this.toolbar.add('shift+left', 'Move left 1/4 page', 'glyphicon-fast-backward', (e,combo) => { this.setSelTime(this.tsel - this.clocksPerPage/4); }); this.toolbar.add('left', 'Move left 1 clock', 'glyphicon-step-backward', (e,combo) => { @@ -151,7 +158,7 @@ export class WaveformView { this.toolbar.add('right', 'Move right 1 clock', 'glyphicon-step-forward', (e,combo) => { this.setSelTime(this.tsel + 1); }); - this.toolbar.add('ctrl+right', 'Move right 1/4 page', 'glyphicon-fast-forward', (e,combo) => { + this.toolbar.add('shift+right', 'Move right 1/4 page', 'glyphicon-fast-forward', (e,combo) => { this.setSelTime(this.tsel + this.clocksPerPage/4); }); this.toolbar.add('h', 'Switch between hex/decimal format', 'glyphicon-barcode', (e,combo) => { @@ -187,11 +194,17 @@ export class WaveformView { this.t0 -= this.clocksPerPage / 4; this.tsel = t; this.setOrgTime(this.t0); + this.clklabel.innerText = " clk " + this.tsel; + } + + setClocksPerPage() { + this.clocksPerPage = Math.floor(this.pageWidth/this.zoom) - 1; } setZoom(zoom : number) { this.zoom = Math.max(1/16, Math.min(64, zoom)); - this.clocksPerPage = Math.ceil(this.pageWidth/this.zoom); // TODO: refactor into other one + this.setClocksPerPage(); + this.t0 = Math.max(0, Math.round(this.tsel - this.clocksPerPage / 2)); this.refresh(); } @@ -211,7 +224,9 @@ export class WaveformView { var w = canvas.width; var h = canvas.height; var ctx = canvas.getContext("2d"); - ctx.font = "14px Andale Mono, Lucida Console, monospace"; + var fontbig = "14px Andale Mono, Lucida Console, monospace"; + var fontsml = "10px Andale Mono, Lucida Console, monospace"; + ctx.font = fontbig; // clear to black ctx.clearRect(0, 0, canvas.width, canvas.height); // highlighted? @@ -227,10 +242,11 @@ export class WaveformView { var data = this.wfp.getSignalData(row, this.t0, Math.ceil(w/this.zoom)); this.clockMax = Math.max(this.clockMax, this.t0 + data.length); var printvals = meta.len > 1 && this.zoom >= 32; - var ycen = b1+h2-1; + var ycen = b1+h2-4; ctx.fillStyle = "#336633"; ctx.fillRect(0, fh/2, 3, b1+h2-fh/2); // draw left tag - ctx.strokeStyle = ctx.fillStyle = "#66ff66"; + ctx.strokeStyle = "#33ee33"; + ctx.fillStyle = "#99ff99"; // draw waveform ctx.beginPath(); var x = 0; @@ -240,24 +256,32 @@ export class WaveformView { for (var i=0; i 4) + ctx.font = fontsml; + ctx.fillText(txt, x+this.zoom/4, ytext); } - lastval = val; if (i>0) ctx.lineTo(x,y); y = b1 + (1.0 - val/yrange) * h2; - if (!isclk) x += this.zoom*(1/8); + if (!isclk) + x += this.zoom*(1/8); if (i==0) ctx.moveTo(x,y); else ctx.lineTo(x,y); + if (this.zoom > 0.75 && lastval != val) + ctx.fillRect(x,y,1+this.zoom/4,1); if (isclk) x += this.zoom; else x += this.zoom*(7/8); + lastval = val; } ctx.stroke(); // draw selection thingie + ctx.font = fontbig; if (this.tsel >= this.t0) { ctx.strokeStyle = ctx.fillStyle = "#ff66ff"; ctx.beginPath(); diff --git a/src/platform/verilog.ts b/src/platform/verilog.ts index e108c0cb..68a5dcdb 100644 --- a/src/platform/verilog.ts +++ b/src/platform/verilog.ts @@ -62,6 +62,8 @@ var VERILOG_KEYCODE_MAP = makeKeycodeMap([ [Keys.VK_7, 2, 0x10], ]); +const TRACE_BUFFER_DWORDS = 0x40000; + // SIMULATOR STUFF (should be global) export var vl_finished = false; @@ -361,7 +363,7 @@ var VerilogPlatform = function(mainElement, options) { }; this.setFrameRate(60); // setup scope - trace_buffer = new Uint32Array(0x20000); + trace_buffer = new Uint32Array(TRACE_BUFFER_DWORDS); var overlay = $("#emuoverlay").show(); this.topdiv = $('
').appendTo(overlay); vcanvas.appendTo(this.topdiv);