feat(live-feed): boss fight?

RangerRick · Oct 23, 2020 · e9fa118 · e9fa118
1 parent ee6f58e
commit e9fa118
Show file tree

Hide file tree

Showing 9 changed files with 154 additions and 30 deletions.
diff --git a/capacitor.config.json b/capacitor.config.json
@@ -13,9 +13,5 @@
     "preferences": {
       "DisableDeploy": "true"
     }
-  },
-  "server": {
-    "url": "http://192.168.211.228:8100",
-    "cleartext": true
   }
 }
diff --git a/ios/App/App/capacitor.config.json b/ios/App/App/capacitor.config.json
@@ -13,9 +13,5 @@
     "preferences": {
       "DisableDeploy": "true"
     }
-  },
-  "server": {
-    "url": "http://192.168.211.228:8100",
-    "cleartext": true
   }
 }
diff --git a/src/app/diamond/diamond.component.html b/src/app/diamond/diamond.component.html
@@ -11,7 +11,33 @@
               </ion-button>
             </ion-fab>
 
-            <div class="team-header">
+            <ion-grid *ngIf="isBossFight" class="boss-fight">
+              <ion-row>
+                <ion-col size="2">
+                  <app-team team="home" [teamColor]="game.homeTeamColor" [emoji]="game.homeTeamEmoji" [hideName]="true"></app-team>
+                </ion-col>
+                <ion-col>
+                  <ion-label>{{game.homeTeamName}}</ion-label><br>
+                  <div class="score-container">
+                    <ion-progress-bar [value]="game.homeHitPercent"></ion-progress-bar>
+                    <div class="score">{{game.homeHp || 0}} / {{game.homeMaxHp || 1}}</div>
+                  </div>
+                </ion-col>
+              </ion-row>
+              <ion-row>
+                <ion-col size="2">
+                  <app-team team="away" [teamColor]="game.awayTeamColor" [emoji]="game.awayTeamEmoji" [hideName]="true"></app-team>
+                </ion-col>
+                <ion-col>
+                  <ion-label>{{game.awayTeamName}}</ion-label><br>
+                  <div class="score-container">
+                    <ion-progress-bar [value]="game.awayHitPercent"></ion-progress-bar>
+                    <div class="score">{{game.awayHp || 0}} / {{game.awayMaxHp || 1}}</div>
+                  </div>
+                </ion-col>
+              </ion-row>
+            </ion-grid>
+            <div class="team-header" *ngIf="!isBossFight">
               <ion-grid>
                 <ion-row>
                   <ion-col class="ion-justify-content-end ion-no-padding ion-no-margin">

diff --git a/src/app/diamond/diamond.component.scss b/src/app/diamond/diamond.component.scss
@@ -32,6 +32,38 @@ ion-fab {
 
 $drop-shadow: 0 0 0.25em black, 0 0 0.1em black, 0 0 0.1em black;
 
+.boss-fight {
+  ion-label {
+    font-weight: bold;
+    text-shadow: $drop-shadow;
+  }
+
+  ion-progress-bar {
+    --progress-background: white;
+    --background: black;
+    height: 2em;
+    border: 3px solid yellow;
+    /* border-radius: 0.5em; */
+  }
+
+  .score-container {
+    position: relative;
+    text-align: center;
+
+    .score {
+      color: black;
+      width: 100%;
+      position: absolute;
+      padding: 0.2em;
+      font-weight: bold;
+      top: 0;
+      left: 0;
+      text-shadow: 1px 0 0 #fff, -1px 0 0 #fff, 0 1px 0 #fff, 0 -1px 0 #fff, 1px 1px #fff, -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff;
+    }
+  }
+
+}
+
 .game-over {
   text-align: center;
   font-size: 200%;

diff --git a/src/app/diamond/diamond.component.ts b/src/app/diamond/diamond.component.ts
@@ -16,6 +16,7 @@ import { GameDetailPage } from '../game-detail/game-detail.page';
 // import Player from '../../lib/model/player';
 
 import { environment } from '../../environments/environment';
+import { BossFight } from 'src/lib/model/bossfight';
 
 @Component({
   selector: 'app-diamond',
@@ -54,6 +55,7 @@ export class DiamondComponent implements DoCheck, OnInit {
   private oldGame = {} as Game;
   public environment = environment;
   public record: [number, number];
+  public isBossFight: boolean;
 
   constructor(
     private changeDetector: ChangeDetectorRef,
@@ -63,6 +65,7 @@ export class DiamondComponent implements DoCheck, OnInit {
   ) {
     // console.debug('Diamond component created.');
   }
+
   async ngOnInit() {
     // console.debug('Diamond component initialized.');
     // console.debug(this.game);
@@ -73,6 +76,8 @@ export class DiamondComponent implements DoCheck, OnInit {
       this.teams[team.id] = team;
     }
 
+    this.checkBossFight();
+
     return true;
   }
 
@@ -82,10 +87,16 @@ export class DiamondComponent implements DoCheck, OnInit {
       this.changeDetector.markForCheck();
       this.oldGame = this.game;
       this.checkInterestingEvents();
+      this.checkBossFight();
       // this.retrieveRecord();
     }
   }
 
+  checkBossFight() {
+    // this.isBossFight = true;
+    this.isBossFight = this.game instanceof BossFight;
+  }
+
   /* turns out TGB stopped making this expensive calculation too ;) */
   async retrieveRecord() {
     if (this.game && !this.record) {

diff --git a/src/app/live-feed/live-feed.page.html b/src/app/live-feed/live-feed.page.html
@@ -77,20 +77,32 @@ <h4>Next season starts in... uhh.  <i>*tugs collar*</i> I mean. What <i>is</i> t
       </div>
     </span>
     <span *ngIf="!uiState.notice">
-      <ion-item lines="none" *ngIf="uiState.seasonHeader">
-        <h4 *ngIf="streamData && streamData.games" class="ion-no-margin">{{uiState.seasonHeader}}</h4>
-      </ion-item>
-      <ion-item lines="none" *ngIf="segment === 'active' && (!games || games.length === 0)">
-        No active games for day {{streamData.games.sim.day}}.
-      </ion-item>
-      <ion-grid style="margin-top: 0; padding-top: 0">
-        <ion-row>
-          <!-- size-xs="12" size-sm="12" size-md="12" size-lg="6" size-xl="6" -->
-          <ion-col size="12" *ngFor="let game of games; trackBy: gameId">
-            <app-diamond [game]="game" prefix="live-diamond" (refresh)="refreshUI()"></app-diamond>
-          </ion-col>
-        </ion-row>
-      </ion-grid>
+      <span *ngIf="phase === PHASES.BOSS_FIGHT">
+        <ion-grid style="margin-top: 0; padding-top: 0">
+          <ion-row>
+            <!-- size-xs="12" size-sm="12" size-md="12" size-lg="6" size-xl="6" -->
+            <ion-col size="12" *ngFor="let game of streamData.fights.bossFights; trackBy: gameId">
+              <app-diamond [game]="game" prefix="live-diamond" (refresh)="refreshUI()"></app-diamond>
+            </ion-col>
+          </ion-row>
+        </ion-grid>
+      </span>
+      <span *ngIf="phase !== PHASES.BOSS_FIGHT">
+        <ion-item lines="none" *ngIf="uiState.seasonHeader">
+          <h4 *ngIf="streamData && streamData.games" class="ion-no-margin">{{uiState.seasonHeader}}</h4>
+        </ion-item>
+        <ion-item lines="none" *ngIf="segment === 'active' && (!games || games.length === 0)">
+          No active games for day {{streamData.games.sim.day}}.
+        </ion-item>
+        <ion-grid style="margin-top: 0; padding-top: 0">
+          <ion-row>
+            <!-- size-xs="12" size-sm="12" size-md="12" size-lg="6" size-xl="6" -->
+            <ion-col size="12" *ngFor="let game of games; trackBy: gameId">
+              <app-diamond [game]="game" prefix="live-diamond" (refresh)="refreshUI()"></app-diamond>
+            </ion-col>
+          </ion-row>
+        </ion-grid>
+      </span>
     </span>
   </span>
 </ion-content>
diff --git a/src/app/live-feed/live-feed.page.ts b/src/app/live-feed/live-feed.page.ts
@@ -48,6 +48,8 @@ export class LiveFeedPage implements OnInit, OnDestroy {
   public countdown: Countdown;
   public globalEvents: GlobalEvent[];
   private keepAwake = false;
+  public phase: PHASES;
+  public PHASES = PHASES;
   public uiState = {} as { [key: string]: any };
 
   constructor(
@@ -373,6 +375,7 @@ export class LiveFeedPage implements OnInit, OnDestroy {
       this.countdown = undefined;
     }
 
+    this.phase = phase;
     Object.assign(this.uiState, uiState);
 
     this.hideLoading();

diff --git a/src/lib/model/bossfight.ts b/src/lib/model/bossfight.ts
@@ -1,3 +1,4 @@
+import { sha256 } from 'hash.js';
 import { Game } from './game';
 import { ID } from './_entry';
 
@@ -10,21 +11,64 @@ interface damageResult {
 
 export class BossFight extends Game {
   awayHp: string;
+  awayHpNum: number;
   awayMaxHp: string;
+  awayMaxHpNum: number;
   homeHp: string;
+  homeHpNum: number;
   homeMaxHp: string;
+  homeMaxHpNum: number;
   repeatCount: number;
 
   constructor(data?: any) {
     super(data);
 
-    this.defineStrings([
+    const hp = [
       'awayHp',
       'awayMaxHp',
       'homeHp',
       'homeMaxHp',
-    ]);
+    ];
+    this.defineStrings(hp);
 
+    for (const prop of hp) {
+      if (data && data[prop]) {
+        this[`${prop}Num`] = parseInt(data[prop], 10);
+      }
+    }
+  }
+
+  protected hashKeys() {
+    return [
+      'awayBatter',
+      'homeBatter',
+      'lastUpdate',
+      'atBatBalls',
+      'atBatStrikes',
+      'awayScore',
+      'baserunnerCount',
+      'halfInningOuts',
+      'halfInningScore',
+      'homeScore',
+      'inning',
+      'gameComplete',
+      'gameStart',
+      'topOfInning',
+      'awayHp',
+      'awayMaxHp',
+      'homeHp',
+      'homeMaxHp',
+    ];
+  }
+
+  public get awayHitPercent() {
+    return 0.5;
+    return this.awayHpNum / this.awayMaxHpNum;
+  }
+
+  public get homeHitPercent() {
+    return 0.8;
+    return this.homeHpNum / this.homeMaxHpNum;
   }
 
   // "damageResults": "[{\"dmgType\":5,\"teamTarget\":\"40b9ec2a-cb43-4dbb-b836-5accb62e7c20\",\"playerSource\":\"04e14d7b-5021-4250-a3cd-932ba8e0a889\",\"dmg\":382}]",

diff --git a/src/lib/model/game.ts b/src/lib/model/game.ts
@@ -135,7 +135,14 @@ export class Game extends Entry {
     ]);
 
     const hash = sha256();
-    for (const prop of [
+    for (const prop of this.hashKeys()) {
+      hash.update(this.data?.[prop]);
+    }
+    this.hash = hash.digest('hex');
+  }
+
+  protected hashKeys() {
+    return [
       'awayBatter',
       'homeBatter',
       'lastUpdate',
@@ -150,10 +157,7 @@ export class Game extends Entry {
       'gameComplete',
       'gameStart',
       'topOfInning',
-    ]) {
-      hash.update(this.data?.[prop]);
-    }
-    this.hash = hash.digest('hex');
+    ];
   }
 
   public get awayBatting() {