50 lines
1.6 KiB
TypeScript
50 lines
1.6 KiB
TypeScript
|
import { HTMLappendIt, svgNamespace } from "../types";
|
||
|
|
import { Tragable } from "./tragable";
|
||
|
|
|
||
|
|
export class SVGTRansition extends Tragable implements HTMLappendIt {
|
||
|
|
group;
|
||
|
|
rect;
|
||
|
|
rectText;
|
||
|
|
constructor(trans) {
|
||
|
|
super();
|
||
|
|
// Create the group element
|
||
|
|
this.group = document.createElementNS(svgNamespace, 'g');
|
||
|
|
this.group.classList.add("PTransition");
|
||
|
|
this.group.setAttribute('transform', `translate(${trans.x}, ${trans.y})`);
|
||
|
|
|
||
|
|
// Create the circle
|
||
|
|
this.rect = document.createElementNS(svgNamespace, 'rect');
|
||
|
|
this.rect.setAttribute('x', '-12.5');
|
||
|
|
this.rect.setAttribute('y', '-25');
|
||
|
|
this.rect.setAttribute('height', '50');
|
||
|
|
this.rect.setAttribute('width', '25');
|
||
|
|
|
||
|
|
// Create the text inside the circle
|
||
|
|
this.rectText = document.createElementNS(svgNamespace, 'text');
|
||
|
|
this.rectText.classList.add("rectText");
|
||
|
|
this.rectText.setAttribute('x', '-5');
|
||
|
|
this.rectText.setAttribute('y', '-35');
|
||
|
|
this.rectText.textContent = trans.name;
|
||
|
|
|
||
|
|
// Append the circle and texts to the group
|
||
|
|
this.group.appendChild(this.rect);
|
||
|
|
this.group.appendChild(this.rectText);
|
||
|
|
}
|
||
|
|
|
||
|
|
appendIt(svg: SVGElement) {
|
||
|
|
svg.appendChild(this.group);
|
||
|
|
this.initTrag(this.group);
|
||
|
|
}
|
||
|
|
|
||
|
|
translate(x: number, y: number) {
|
||
|
|
this.group.setAttribute('transform', `translate(${x}, ${y})`);
|
||
|
|
}
|
||
|
|
setName(name: string) {
|
||
|
|
this.rectText.textContent = name;
|
||
|
|
}
|
||
|
|
|
||
|
|
setCanFire(can: boolean) {
|
||
|
|
if (can) this.group.classList.add("canFire");
|
||
|
|
else this.group.classList.remove("canFire");
|
||
|
|
}
|
||
|
|
}
|