Merge pull request #30 from halomademeapc/feature/#29-cheering-sound-…

…effect

it's like a birthday party

pokeR/ClientApp/src/app/shared-components/confetti/confetti.component.ts

@@ -12,8 +12,11 @@ declare const confetti;
 export class ConfettiComponent implements AfterViewInit {
   @ViewChild('canvas') canvas: ElementRef;
   private confettiLauncher: any;
+  private lastCheer: Date;
 
-  constructor(private service: ConfettiService) { }
+  constructor(private service: ConfettiService) {
+    this.lastCheer = new Date();
+  }
 
   ngAfterViewInit(): void {
     this.setupConfetti();
@@ -30,8 +33,12 @@ export class ConfettiComponent implements AfterViewInit {
 
   watchRequests = (): Observable<void> => this.service.confettiPlz.pipe(map(this.launch))
 
-  launch = (duration: number): void => {
-    var end = Date.now() + (duration);
+  launch = (request: { duration: number, cheer?: boolean }): void => {
+    var end = Date.now() + (request.duration);
+
+    if (request.cheer) {
+      this.cheer();
+    }
 
     var interval = setInterval(() => {
       if (Date.now() > end) {
@@ -51,4 +58,12 @@ export class ConfettiComponent implements AfterViewInit {
     }, 200);
   }
 
+  private cheer = (): void => {
+    // only cheer at most once every 8 seconds to avoid spam
+    if (((new Date()).getTime() - this.lastCheer.getTime()) > 8000) {
+      var audio = new Audio('/audio/yahtzee.mp3');
+      audio.play();
+      this.lastCheer = new Date();
+    }
+  }
 }

pokeR/ClientApp/src/app/shared-components/confetti/confetti.service.ts

@@ -7,7 +7,7 @@ export class ConfettiService {
 
   constructor() { }
 
-  public confettiPlz: EventEmitter<number> = new EventEmitter<number>();
+  public confettiPlz: EventEmitter<{ duration: number, cheer?: boolean }> = new EventEmitter<{ duration: number, cheer?: boolean }>();
 
-  public pop = (): void => this.confettiPlz.emit(5000);
+  public pop = (cheer?: boolean): void => this.confettiPlz.emit({ duration: 5000, cheer });
 }

pokeR/ClientApp/src/app/shared-components/playfield/playfield.component.ts

@@ -71,16 +71,14 @@ export class PlayfieldComponent implements OnInit, OnDestroy {
     console.log('YOU ACTIVATED MY TRAP CARD!');
     if (this.lastState.map(s => s.currentCardId).every(i => this.lastState.find(() => true).currentCardId === i)) {
       console.log('party time!');
-      this.showConfetti();
+      this.confetti.pop(true);
     }
 
     this.cardComponents.forEach((componentRef, index) => componentRef.instance.reveal(index * 70));
   }
 
   getEmblemUrl = (id: number): string => this.service.getEmblemUrl(id);
 
-  private showConfetti = (): void => this.confetti.pop();
-
   private updateState = (newState: Array<User>): void => {
     const previousState = this.lastState;
     this.lastState = newState;