56 lines
No EOL
1.9 KiB
TypeScript
56 lines
No EOL
1.9 KiB
TypeScript
import { HTMLappendIt, svgNamespace } from "../types";
|
|
import { Tragable } from "./tragable";
|
|
|
|
export class SVGNode extends Tragable implements HTMLappendIt {
|
|
group: SVGElement;
|
|
circle: SVGElement;
|
|
circleText: SVGElement;
|
|
aboveText: SVGElement;
|
|
constructor(node) {
|
|
super();
|
|
// Create the group element
|
|
this.group = document.createElementNS(svgNamespace, 'g');
|
|
this.group.classList.add("PNode");
|
|
this.group.setAttribute('transform', `translate(${node.x}, ${node.y})`);
|
|
|
|
// Create the circle
|
|
this.circle = document.createElementNS(svgNamespace, 'circle');
|
|
this.circle.setAttribute('cx', '0');
|
|
this.circle.setAttribute('cy', '0');
|
|
this.circle.setAttribute('r', '25');
|
|
|
|
// Create the text inside the circle
|
|
this.circleText = document.createElementNS(svgNamespace, 'text');
|
|
this.circleText.classList.add("circleText");
|
|
this.circleText.setAttribute('x', '0');
|
|
this.circleText.setAttribute('y', '5');
|
|
this.circleText.textContent = '0/1';
|
|
|
|
// Create the text above the circle
|
|
this.aboveText = document.createElementNS(svgNamespace, 'text');
|
|
this.aboveText.classList.add("aboveText");
|
|
this.aboveText.setAttribute('x', '0');
|
|
this.aboveText.setAttribute('y', '-35');
|
|
this.aboveText.textContent = node.name;
|
|
|
|
// Append the circle and texts to the group
|
|
this.group.appendChild(this.circle);
|
|
this.group.appendChild(this.circleText);
|
|
this.group.appendChild(this.aboveText);
|
|
}
|
|
|
|
appendIt(svg) {
|
|
svg.appendChild(this.group);
|
|
this.initTrag(this.group);
|
|
}
|
|
|
|
translate(x, y) {
|
|
this.group.setAttribute('transform', `translate(${x}, ${y})`);
|
|
}
|
|
setName(name) {
|
|
this.aboveText.textContent = name;
|
|
}
|
|
setMarks(amount, max) {
|
|
this.circleText.textContent = `${amount}/${max}`;
|
|
}
|
|
} |