From 4301764154ea198a9bbcd30066aa736b9c7a840c Mon Sep 17 00:00:00 2001 From: Steven Hugg Date: Tue, 27 Aug 2019 11:42:23 -0400 Subject: [PATCH] probe view: added tooltip --- css/ui.css | 15 ++++++++++++++- doc/notes.txt | 2 ++ src/views.ts | 36 ++++++++++++++++++++++++++++++++++-- 3 files changed, 50 insertions(+), 3 deletions(-) diff --git a/css/ui.css b/css/ui.css index efaee3f5..8fcf8a31 100644 --- a/css/ui.css +++ b/css/ui.css @@ -18,7 +18,7 @@ display: inline-block; border-bottom: 1px dotted black; } -.tooltipbox .tooltiptext { +.tooltiptext { visibility: hidden; width: 500px; background-color: #660000; @@ -48,6 +48,19 @@ color:#ccccff; background-color:#000066; } +.tooltiptrack { + background-color: #666; + color: #fff; + text-align: center; + border: 2px solid #999; + border-radius: 8px; + padding: 5px; + position: absolute; + z-index: 10; + white-space: pre-wrap; /* css-3 */ + white-space: -moz-pre-wrap; /* Mozilla, since 1999 */ + pointer-events: none; +} #controls_top { position:absolute; padding:0.5em; diff --git a/doc/notes.txt b/doc/notes.txt index 7d6aebcd..e3dbf896 100644 --- a/doc/notes.txt +++ b/doc/notes.txt @@ -178,6 +178,8 @@ TODO: - "shared" in URL doesn't work, leave in URL? (also importURL) - alert when skeleton file loaded or file not found +- move segments into Platform object + - TypeError: null is not an object (evaluating 'n.destination') https://8bitworkshop.com/v3.4.1/javatari.js/release/javatari/javatari.js (32:443651) Safari 12.1.2 diff --git a/src/views.ts b/src/views.ts index 5e13f95a..6ab67aed 100644 --- a/src/views.ts +++ b/src/views.ts @@ -1,4 +1,3 @@ -"use strict"; import $ = require("jquery"); //import CodeMirror = require("codemirror"); @@ -8,6 +7,7 @@ import { hex, lpad, rpad, safeident, rgb2bgr } from "./util"; import { CodeAnalyzer } from "./analysis"; import { platform, platform_id, compparams, current_project, lastDebugState, projectWindows } from "./ui"; import { EmuProfilerImpl, ProbeRecorder, ProbeFlags } from "./recorder"; +import { getMousePos } from "./emu"; import * as pixed from "./pixed/pixeleditor"; declare var Mousetrap; @@ -930,6 +930,7 @@ abstract class ProbeViewBase { maindiv : HTMLElement; canvas : HTMLCanvasElement; ctx : CanvasRenderingContext2D; + tooldiv : HTMLElement; recreateOnResize = true; createCanvas(parent:HTMLElement, width:number, height:number) { @@ -941,6 +942,15 @@ abstract class ProbeViewBase { canvas.style.width = '100%'; canvas.style.height = '100vh'; // i hate css canvas.style.backgroundColor = 'black'; + canvas.style.cursor = 'crosshair'; + canvas.onmousemove = (e) => { + var pos = getMousePos(canvas, e); + this.showTooltip(this.getTooltipText(pos.x, pos.y)); + $(this.tooldiv).css('left',e.pageX+10).css('top',e.pageY-30); + } + canvas.onmouseout = (e) => { + $(this.tooldiv).hide(); + } parent.appendChild(div); div.appendChild(canvas); this.canvas = canvas; @@ -952,6 +962,23 @@ abstract class ProbeViewBase { initCanvas() { } + showTooltip(s:string) { + if (s) { + if (!this.tooldiv) { + this.tooldiv = document.createElement("div"); + this.tooldiv.setAttribute("class", "tooltiptrack"); + document.body.appendChild(this.tooldiv); + } + $(this.tooldiv).text(s).show(); + } else { + $(this.tooldiv).hide(); + } + } + + getTooltipText(x:number, y:number) : string { + return null; + } + setVisible(showing : boolean) : void { if (showing) { this.probe = platform.startProbing(); @@ -992,7 +1019,7 @@ abstract class ProbeViewBase { break; } } - p.reset(); + if (!p.singleFrame) p.reset(); } setContextForOp(op) { @@ -1071,6 +1098,7 @@ export class AddressHeatMapView extends ProbeBitmapViewBase implements ProjectVi this.datau32[i] = rgb | 0xff000000; } } + drawEvent(op, addr, col, row) { var rgb = this.getOpRGB(op); if (!rgb) return; @@ -1081,6 +1109,10 @@ export class AddressHeatMapView extends ProbeBitmapViewBase implements ProjectVi this.datau32[addr & 0xffff] = data; } + getTooltipText(x:number, y:number) : string { + var addr = (x & 0xff) + (y << 8); + return '$'+hex(addr); + } } export class RasterHeatMapView extends ProbeBitmapViewBase implements ProjectView {