51 lines
1.1 KiB
JavaScript
51 lines
1.1 KiB
JavaScript
|
class StartConnection {
|
||
|
|
|
||
|
|
constructor(state, start) {
|
||
|
|
this.state = state;
|
||
|
|
this.deltaX = 0;
|
||
|
|
this.deltaY = 0;
|
||
|
|
this.text = '';
|
||
|
|
|
||
|
|
if(start) {
|
||
|
|
this.setAnchorPoint(start.x, start.y);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
setAnchorPoint(x, y) {
|
||
|
|
this.deltaX = x - this.state.x;
|
||
|
|
this.deltaY = y - this.state.y;
|
||
|
|
|
||
|
|
if(Math.abs(this.deltaX) < settings.snapToPadding) {
|
||
|
|
this.deltaX = 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
if(Math.abs(this.deltaY) < settings.snapToPadding) {
|
||
|
|
this.deltaY = 0;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
getEndPoints() {
|
||
|
|
const startX = this.state.x + this.deltaX;
|
||
|
|
const startY = this.state.y + this.deltaY;
|
||
|
|
|
||
|
|
const end = this.state.closestPointOnCircle(startX, startY);
|
||
|
|
|
||
|
|
return {
|
||
|
|
start: {x: startX, y: startY},
|
||
|
|
end,
|
||
|
|
};
|
||
|
|
}
|
||
|
|
|
||
|
|
draw() {
|
||
|
|
const endPoints = this.getEndPoints();
|
||
|
|
|
||
|
|
ctx.beginPath();
|
||
|
|
|
||
|
|
ctx.moveTo(endPoints.start.x, endPoints.start.y);
|
||
|
|
ctx.lineTo(endPoints.end.x, endPoints.end.y);
|
||
|
|
|
||
|
|
ctx.stroke();
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|