broodjeaap/go-watch
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

added ids to nodes

Browse source
This commit is contained in:
BroodjeAap 2022-09-11 13:14:04 +00:00
parent a61e8343a2
commit 414d7a2877
3 changed files with 12 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
static/diagram.js
View file

@ -1,8 +1,9 @@
var DiagramNode = /** @class */ (function () {
function DiagramNode(x, y, width, height, label) {
function DiagramNode(id, x, y, width, height, label) {
this.hover = false;
this.inputHover = false;
this.outputHover = false;
this.id = id;
this.x = x;
this.y = y;
this.width = width;
@ -234,10 +235,10 @@ var Diagrams = /** @class */ (function () {
this.ctx.fill();
}
};
Diagrams.prototype.addNode = function (x, y, label) {
Diagrams.prototype.addNode = function (id, x, y, label) {
var textSize = this.ctx.measureText(label);
var textHeight = 2 * (textSize.actualBoundingBoxAscent + textSize.actualBoundingBoxDescent);
this.nodes.push(new DiagramNode(x, y, textSize.width + textHeight, textHeight, label));
this.nodes.push(new DiagramNode(id, x, y, textSize.width + textHeight, textHeight, label));
};
Diagrams.prototype.addConnection = function (A, B) {
this.connections.push([A, B]);

7
static/diagram.ts
View file

@ -1,4 +1,5 @@
class DiagramNode {
id: number;
x: number;
y: number;
label: string;
@ -13,12 +14,14 @@ class DiagramNode {
children: Array<DiagramNode>;
constructor(
id: number;
x: number,
y: number,
width: number,
height: number,
label: string,
){
this.id = id;
this.x = x;
this.y = y;
this.width = width;
@ -278,10 +281,10 @@ class Diagrams {
}
}
addNode(x: number, y: number, label: string){
addNode(id: number, x: number, y: number, label: string){
let textSize = this.ctx.measureText(label);
let textHeight = 2 * (textSize.actualBoundingBoxAscent + textSize.actualBoundingBoxDescent);
this.nodes.push(new DiagramNode(x, y, textSize.width + textHeight, textHeight, label));
this.nodes.push(new DiagramNode(id, x, y, textSize.width + textHeight, textHeight, label));
}
addConnection(A: DiagramNode, B: DiagramNode){

6
templates/diagrams.html
View file

@ -14,9 +14,9 @@
var diagrams;
function canvasInit() {
diagrams = new Diagrams("canvas");
diagrams.addNode(100, 100, "Test");
diagrams.addNode(300, 300, "Test2");
diagrams.addNode(500, 500, "A much longer name");
diagrams.addNode(1, 100, 100, "Test");
diagrams.addNode(2, 300, 300, "Test2");
diagrams.addNode(3, 500, 500, "A much longer name");
diagrams.fillParent();
}
document.addEventListener('DOMContentLoaded', canvasInit, false);