mirror of
https://github.com/sehugg/8bitworkshop.git
synced 2024-11-29 14:51:17 +00:00
probe view: added tooltip
This commit is contained in:
parent
00b91acae3
commit
4301764154
15
css/ui.css
15
css/ui.css
@ -18,7 +18,7 @@
|
|||||||
display: inline-block;
|
display: inline-block;
|
||||||
border-bottom: 1px dotted black;
|
border-bottom: 1px dotted black;
|
||||||
}
|
}
|
||||||
.tooltipbox .tooltiptext {
|
.tooltiptext {
|
||||||
visibility: hidden;
|
visibility: hidden;
|
||||||
width: 500px;
|
width: 500px;
|
||||||
background-color: #660000;
|
background-color: #660000;
|
||||||
@ -48,6 +48,19 @@
|
|||||||
color:#ccccff;
|
color:#ccccff;
|
||||||
background-color:#000066;
|
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 {
|
#controls_top {
|
||||||
position:absolute;
|
position:absolute;
|
||||||
padding:0.5em;
|
padding:0.5em;
|
||||||
|
@ -178,6 +178,8 @@ TODO:
|
|||||||
- "shared" in URL doesn't work, leave in URL? (also importURL)
|
- "shared" in URL doesn't work, leave in URL? (also importURL)
|
||||||
- alert when skeleton file loaded or file not found
|
- alert when skeleton file loaded or file not found
|
||||||
|
|
||||||
|
- move segments into Platform object
|
||||||
|
|
||||||
- TypeError: null is not an object (evaluating 'n.destination')
|
- TypeError: null is not an object (evaluating 'n.destination')
|
||||||
https://8bitworkshop.com/v3.4.1/javatari.js/release/javatari/javatari.js
|
https://8bitworkshop.com/v3.4.1/javatari.js/release/javatari/javatari.js
|
||||||
(32:443651) Safari 12.1.2
|
(32:443651) Safari 12.1.2
|
||||||
|
36
src/views.ts
36
src/views.ts
@ -1,4 +1,3 @@
|
|||||||
"use strict";
|
|
||||||
|
|
||||||
import $ = require("jquery");
|
import $ = require("jquery");
|
||||||
//import CodeMirror = require("codemirror");
|
//import CodeMirror = require("codemirror");
|
||||||
@ -8,6 +7,7 @@ import { hex, lpad, rpad, safeident, rgb2bgr } from "./util";
|
|||||||
import { CodeAnalyzer } from "./analysis";
|
import { CodeAnalyzer } from "./analysis";
|
||||||
import { platform, platform_id, compparams, current_project, lastDebugState, projectWindows } from "./ui";
|
import { platform, platform_id, compparams, current_project, lastDebugState, projectWindows } from "./ui";
|
||||||
import { EmuProfilerImpl, ProbeRecorder, ProbeFlags } from "./recorder";
|
import { EmuProfilerImpl, ProbeRecorder, ProbeFlags } from "./recorder";
|
||||||
|
import { getMousePos } from "./emu";
|
||||||
import * as pixed from "./pixed/pixeleditor";
|
import * as pixed from "./pixed/pixeleditor";
|
||||||
declare var Mousetrap;
|
declare var Mousetrap;
|
||||||
|
|
||||||
@ -930,6 +930,7 @@ abstract class ProbeViewBase {
|
|||||||
maindiv : HTMLElement;
|
maindiv : HTMLElement;
|
||||||
canvas : HTMLCanvasElement;
|
canvas : HTMLCanvasElement;
|
||||||
ctx : CanvasRenderingContext2D;
|
ctx : CanvasRenderingContext2D;
|
||||||
|
tooldiv : HTMLElement;
|
||||||
recreateOnResize = true;
|
recreateOnResize = true;
|
||||||
|
|
||||||
createCanvas(parent:HTMLElement, width:number, height:number) {
|
createCanvas(parent:HTMLElement, width:number, height:number) {
|
||||||
@ -941,6 +942,15 @@ abstract class ProbeViewBase {
|
|||||||
canvas.style.width = '100%';
|
canvas.style.width = '100%';
|
||||||
canvas.style.height = '100vh'; // i hate css
|
canvas.style.height = '100vh'; // i hate css
|
||||||
canvas.style.backgroundColor = 'black';
|
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);
|
parent.appendChild(div);
|
||||||
div.appendChild(canvas);
|
div.appendChild(canvas);
|
||||||
this.canvas = canvas;
|
this.canvas = canvas;
|
||||||
@ -952,6 +962,23 @@ abstract class ProbeViewBase {
|
|||||||
initCanvas() {
|
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 {
|
setVisible(showing : boolean) : void {
|
||||||
if (showing) {
|
if (showing) {
|
||||||
this.probe = platform.startProbing();
|
this.probe = platform.startProbing();
|
||||||
@ -992,7 +1019,7 @@ abstract class ProbeViewBase {
|
|||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
p.reset();
|
if (!p.singleFrame) p.reset();
|
||||||
}
|
}
|
||||||
|
|
||||||
setContextForOp(op) {
|
setContextForOp(op) {
|
||||||
@ -1071,6 +1098,7 @@ export class AddressHeatMapView extends ProbeBitmapViewBase implements ProjectVi
|
|||||||
this.datau32[i] = rgb | 0xff000000;
|
this.datau32[i] = rgb | 0xff000000;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
drawEvent(op, addr, col, row) {
|
drawEvent(op, addr, col, row) {
|
||||||
var rgb = this.getOpRGB(op);
|
var rgb = this.getOpRGB(op);
|
||||||
if (!rgb) return;
|
if (!rgb) return;
|
||||||
@ -1081,6 +1109,10 @@ export class AddressHeatMapView extends ProbeBitmapViewBase implements ProjectVi
|
|||||||
this.datau32[addr & 0xffff] = data;
|
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 {
|
export class RasterHeatMapView extends ProbeBitmapViewBase implements ProjectView {
|
||||||
|
Loading…
Reference in New Issue
Block a user