Collision for obstacles

frontend/models/Collidable.ts

@@ -0,0 +1,3 @@
+interface Collidable {
+    collides(o: Entity): boolean;
+}

frontend/models/Obstacle.ts

@@ -1,4 +1,4 @@
-class Obstacle extends Entity {
+class Obstacle extends Entity implements Collidable{
     private pipeTop: Pipe;
     private pipeBottom: Pipe;
     private readonly distanceBetweenPipes: number;
@@ -49,4 +49,8 @@ class Obstacle extends Entity {
         this.pipeTop.draw();
         this.pipeBottom.draw();
     }
+
+    collides(o: Entity): boolean {
+        return this.pipeTop.collides(o) || this.pipeBottom.collides(o);
+    }
 }

frontend/models/Pipe.ts

@@ -1,4 +1,4 @@
-class Pipe extends Entity {
+class Pipe extends Entity implements Collidable {
     private _image: any;
 
     //region Getter & Setter
@@ -9,13 +9,15 @@ class Pipe extends Entity {
     set image(path: string) {
         this._image = loadImage(path);
     }
+
     //endregion
 
     constructor(positionX: number, width: number, height: number) {
         super(new Position(positionX, 0), width, height, 0);
     }
 
-    public update(): void {}
+    public update(): void {
+    }
 
     public draw(): void {
         image(this.image, this.position.x, this.position.y, this.width, this.height);
@@ -27,4 +29,11 @@ class Pipe extends Entity {
             this.height
         );
     }
+
+    collides(o: Entity): boolean {
+        return this.position.x < o.position.x + o.width && //inside left border
+            this.position.x + this.width > o.position.x && //but not outside right border
+            this.position.y < o.position.y + o.height && //inside top border
+            this.position.y + this.height > o.position.y; //but not outside bottom border
+    }
 }