|
@@ -206,8 +206,11 @@ class Line extends Drawable {
|
|
|
this.draw();
|
|
|
}
|
|
|
|
|
|
-
|
|
|
- draw(){
|
|
|
+ get length() {
|
|
|
+ return this.distanceTo(this.x + this.width, this.y + this.height)
|
|
|
+ }
|
|
|
+
|
|
|
+ draw(selected){
|
|
|
ctx.beginPath();
|
|
|
ctx.moveTo(this.x, this.y);
|
|
|
ctx.lineTo(this.x + this.width, this.y + this.height);
|
|
@@ -216,6 +219,34 @@ class Line extends Drawable {
|
|
|
ctx.lineWidth = this.lineWidth
|
|
|
ctx.stroke();
|
|
|
}
|
|
|
+
|
|
|
+ in(x,y) {
|
|
|
+ let rotationAngleAlph = Math.atan2(this.height, this.width)
|
|
|
+ //console.log('raznici', y - this.y, x - this.x)
|
|
|
+ let mouseAngleBeta = Math.atan2(y - this.y, x - this.x)
|
|
|
+ let angleDiff = mouseAngleBeta - rotationAngleAlph
|
|
|
+
|
|
|
+ //x on 0 do dlinna y ot 0 do width
|
|
|
+
|
|
|
+
|
|
|
+ //let newX = Math.cos(angleDiff) * this.distanceTo(x,y)
|
|
|
+ let newX = Math.cos(rotationAngleAlph) * this.distanceTo(x,y)
|
|
|
+
|
|
|
+ //let newY = Math.sin(angleDiff) * this.distanceTo(x,y)
|
|
|
+ let newY = Math.sin(mouseAngleBeta) * this.distanceTo(x,y)
|
|
|
+
|
|
|
+
|
|
|
+ console.log('ot nachala do kincza X', newX)
|
|
|
+ console.log('dist . length', this.distanceTo(x,y) / this.length)
|
|
|
+ console.log('ot nachala do kincza Y', newY)
|
|
|
+ console.log(angleDiff, rotationAngleAlph, mouseAngleBeta)
|
|
|
+ console.log(this.lineWidth)
|
|
|
+ console.log('v line x', 0 <= newX && newX <= this.distanceTo(x,y) / this.length )
|
|
|
+ console.log('v line y', ( -this.lineWidth/2 <= newY && newY <= this.lineWidth/2 ))
|
|
|
+ return ( 0 >= newX && newX <= (this.distanceTo(x,y)/this.length) ) && ( -this.lineWidth/2 >= newY && newY <= this.lineWidth/2 )
|
|
|
+
|
|
|
+
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
color.onchange = () => {
|
|
@@ -229,7 +260,6 @@ document.getElementById('delete').onclick = () =>{
|
|
|
Drawable.drawAll()
|
|
|
}
|
|
|
|
|
|
-
|
|
|
class Rectangle extends Drawable {
|
|
|
constructor(x, y, width, height, color) {
|
|
|
super()
|