From 838a2097ec458d5c56553168773c1681c1373126 Mon Sep 17 00:00:00 2001
From: Andrew Guibert <andy.guibert@gmail.com>
Date: Tue, 22 May 2018 14:53:12 -0500
Subject: [PATCH] Make obstacles dark red and give them pulsing glowing effects

---
 frontend/prebuild/src/app/entity/obstacle.ts  | 13 ++++++++++--
 .../prebuild/src/app/game/game.component.ts   | 20 ++++++++++++++++---
 2 files changed, 28 insertions(+), 5 deletions(-)

diff --git a/frontend/prebuild/src/app/entity/obstacle.ts b/frontend/prebuild/src/app/entity/obstacle.ts
index 71403ba..9ce520e 100644
--- a/frontend/prebuild/src/app/entity/obstacle.ts
+++ b/frontend/prebuild/src/app/entity/obstacle.ts
@@ -1,16 +1,25 @@
-import { Shape } from 'createjs-module';
+import { Shape, Shadow } from 'createjs-module';
 
 export class Obstacle {
-  static readonly COLOR = '#808080';
+  static readonly COLOR = '#AF0000';
   
   public shape: Shape = new Shape();
+  obstaclePulseUp: boolean = true;
   
   constructor(public width: number, public height: number) {
+	this.shape.shadow = new Shadow(Obstacle.COLOR, 0, 0, 20);
 	this.shape.graphics.beginFill(Obstacle.COLOR).rect(0, 0, width, height);
   }
   
   public update(x: number, y: number) {
 	this.shape.x = x;
 	this.shape.y = y;
+    let blur: number = this.shape.shadow.blur;
+    blur += this.obstaclePulseUp ? 2 : -2;
+    if (blur >= 50)
+      this.obstaclePulseUp = false;
+    if (blur <= 10)
+      this.obstaclePulseUp = true;
+    this.shape.shadow.blur = blur;
   }
 }
diff --git a/frontend/prebuild/src/app/game/game.component.ts b/frontend/prebuild/src/app/game/game.component.ts
index ac11b3f..f0b0385 100644
--- a/frontend/prebuild/src/app/game/game.component.ts
+++ b/frontend/prebuild/src/app/game/game.component.ts
@@ -9,7 +9,7 @@ import { environment } from './../../environments/environment';
 import { Player } from '../entity/player';
 import { Obstacle } from '../entity/obstacle';
 import { PlayerTooltip } from '../entity/player.tooltip';
-import { Shape, Stage, Text } from 'createjs-module';
+import { Shape, Stage, Shadow, Text } from 'createjs-module';
 import { Constants } from './constants';
 
 @Component({
@@ -40,6 +40,7 @@ export class GameComponent implements OnInit, OnDestroy {
   trailsCanvas: HTMLCanvasElement;
   trailsContext: CanvasRenderingContext2D;
   obstaclesShape: Shape;
+  obstaclePulseUp: boolean = true;
 
   constructor(private meta: Meta,
     private router: Router,
@@ -160,8 +161,21 @@ export class GameComponent implements OnInit, OnDestroy {
   }
 
   updateObstacles(obstacles: any) {
-    for (let obstacle of obstacles) {
-      this.obstaclesShape.graphics.beginFill(Obstacle.COLOR).rect(obstacle.x * Constants.BOX_SIZE, obstacle.y * Constants.BOX_SIZE, obstacle.width * Constants.BOX_SIZE, obstacle.height * Constants.BOX_SIZE);
+    if (this.obstaclesShape.shadow) {
+      // give that shadow a pulsating effect by oscillating the blur between 10-50
+      let blur: number = this.obstaclesShape.shadow.blur;
+      blur += this.obstaclePulseUp ? 2 : -2;
+      if (blur >= 50)
+        this.obstaclePulseUp = false;
+      if (blur <= 10)
+        this.obstaclePulseUp = true;
+      this.obstaclesShape.shadow.blur = blur;
+    } else {
+      for (let obstacle of obstacles) {
+        this.obstaclesShape.shadow = new Shadow(Obstacle.COLOR, 0, 0, 20);
+        this.obstaclesShape.graphics.beginFill(Obstacle.COLOR)
+                                    .rect(obstacle.x * Constants.BOX_SIZE, obstacle.y * Constants.BOX_SIZE, obstacle.width * Constants.BOX_SIZE, obstacle.height * Constants.BOX_SIZE);
+      }
     }
   }