source: imaps-frontend/src/scripts/base/RenderedMapShape.js@ 0c6b92a

main
Last change on this file since 0c6b92a was 0c6b92a, checked in by stefan toskovski <stefantoska84@…>, 5 weeks ago

Pred finalna verzija

  • Property mode set to 100644
File size: 1.8 KB
Line 
1import Konva from "konva";
2import config from "../net/netconfig.js";
3
4export default class RenderedMapShape extends Konva.Shape {
5 constructor(config) {
6 if (new.target === RenderedMapShape) {
7 throw new Error("Cannot instantiate abstract class RenderedMapShape directly.");
8 }
9
10 super(config);
11
12 this.info = {
13 name: "",
14 description: "",
15 type: "",
16 };
17 this.class = "Rect";
18 this.infoText = null;
19 this.textOffsetX = 0;
20 this.textOffsetY = 0;
21
22 this.eventName = "";
23
24 }
25
26 initText() {
27 const rectWidth = this.width();
28 const rectHeight = this.height();
29
30 this.infoText = new Konva.Text({
31 x: this.x(),
32 y: this.y(),
33 text: this.info.name || "no name",
34 fontSize: 10,
35 fontFamily: "Exo",
36 fill: "black",
37 align: "center",
38 verticalAlign: "middle",
39 });
40
41 this.infoText.offsetX(this.infoText.width() / 2);
42 this.infoText.offsetY(this.infoText.height() / 2);
43
44 this.infoText.x(this.x() + rectWidth / 2);
45 this.infoText.y(this.y() + rectHeight / 2);
46 this.infoText.rotation(this.rotation());
47 }
48
49
50 updateTextPosition() {
51 if (this.infoText) {
52 this.infoText.x(this.x() + this.textOffsetX);
53 this.infoText.y(this.y() + this.textOffsetY);
54 }
55 }
56
57 clearText() {
58 if (this.infoText !== null) {
59 this.infoText.remove()
60 console.log("cleared text")
61 }
62
63 }
64 _sceneFunc(context) {
65
66 let width = this.width();
67 let height = this.height();
68
69 const cornerRadius = this.attrs.cornerRadius;
70
71 context.beginPath();
72
73 if(!cornerRadius){
74 context.rect(0, 0, width, height)
75 } else {
76 Konva.Util.drawRoundedRectPath(context,width,height,cornerRadius)
77 }
78
79 context.closePath();
80 context.fillStrokeShape(this);
81 }
82
83
84 displayName(layer) {
85 if (this.infoText != null) {
86 layer.add(this.infoText);
87 }
88 }
89}
Note: See TracBrowser for help on using the repository browser.