Merge pull request #173 from walkingeyerobot/color-counts

Add dominant color guides to players

client/src/draft/DraftState.ts

@@ -16,6 +16,13 @@ export interface DraftSeat {
   queuedPacks: PackContainer;
   originalPacks: number[];
   round: number;
+  colorCounts: {
+    w: number;
+    u: number;
+    b: number;
+    r: number;
+    g: number;
+  };
 }
 
 export interface PackContainer {

client/src/draft/TimelineEvent.ts

@@ -19,6 +19,7 @@ export type TimelineAction =
     | ActionMoveCard
     | ActionMovePack
     | ActionMarkTransfer
+    | ActionIncrementPickedColors
     | ActionIncrementSeatRound
     | ActionAssignPackRound
     | ActionAnnounce
@@ -33,6 +34,15 @@ export interface ActionMoveCard {
   to: number;
 }
 
+export interface ActionMovePack {
+  type: 'move-pack';
+  subtype: 'pass' | 'discard';
+  pack: number;
+  from: number;
+  to: number;
+  epoch: 'increment' | number;
+}
+
 /**
  * Decrements from's `count` by one and increments to's `count` by one.
  *
@@ -47,13 +57,19 @@ export interface ActionMarkTransfer {
   to: number;
 }
 
-export interface ActionMovePack {
-  type: 'move-pack';
-  subtype: 'open' | 'pass' | 'discard';
-  pack: number;
-  from: number;
-  to: number;
-  epoch: 'increment' | number;
+/**
+ * Increments the count of picked colors for a particular seat
+ *
+ * Should be included as part of a 'pick' event.
+ */
+export interface ActionIncrementPickedColors {
+  type: 'increment-picked-colors',
+  seat: number;
+  w: number;
+  u: number;
+  b: number;
+  r: number;
+  g: number;
 }
 
 export interface ActionAssignPackRound {

client/src/draft/mutate.ts

@@ -1,6 +1,6 @@
 import { DraftState, CardContainer, CardPack } from "./DraftState";
 import { checkNotNil } from '../util/checkNotNil';
-import { TimelineEvent, TimelineAction, ActionMovePack, ActionAssignPackRound, ActionIncrementSeatRound } from './TimelineEvent';
+import { TimelineEvent, TimelineAction, ActionMovePack, ActionAssignPackRound, ActionIncrementSeatRound, ActionIncrementPickedColors } from './TimelineEvent';
 import { MutationError } from './MutationError';
 import { CardStore } from './CardStore';
 import { eventToString } from '../state/util/eventToString';
@@ -61,6 +61,12 @@ function applyAction(
     case 'move-pack':
       movePack(action, state, 'forward');
       break;
+    case 'mark-transfer':
+      markTransfer(state, action.from, action.to);
+      break;
+    case 'increment-picked-colors':
+      incrementPickedColors(state, action);
+      break;
     case 'announce':
       console.log('ANNOUNCEMENT:', action.message);
       break;
@@ -70,9 +76,6 @@ function applyAction(
     case 'assign-pack-round':
       assignPackRound(action, state);
       break;
-    case 'mark-transfer':
-      markTransfer(state, action.from, action.to);
-      break;
     default:
       checkExhaustive(action);
   }
@@ -90,6 +93,12 @@ function rollbackAction(
     case 'move-pack':
       movePack(action, state, 'reverse');
       break;
+    case 'mark-transfer':
+      markTransfer(state, action.to, action.from);
+      break;
+    case 'increment-picked-colors':
+      decrementPickedColors(state, action);
+      break;
     case 'announce':
       break;
     case 'increment-seat-round':
@@ -98,9 +107,6 @@ function rollbackAction(
     case 'assign-pack-round':
       unassignPackRound(action, state);
       break;
-    case 'mark-transfer':
-      markTransfer(state, action.to, action.from);
-      break;
     default:
       checkExhaustive(action);
   }
@@ -180,6 +186,36 @@ function markTransfer(state: DraftState, from: number, to: number) {
   dstContainer.count++;
 }
 
+function incrementPickedColors(
+    state: DraftState,
+    action: ActionIncrementPickedColors,
+) {
+  const seat = state.seats[action.seat];
+  if (seat == undefined) {
+    throw new MutationError(`Cannot find seat ${action.seat}`);
+  }
+  seat.colorCounts.w += action.w;
+  seat.colorCounts.u += action.u;
+  seat.colorCounts.b += action.b;
+  seat.colorCounts.r += action.r;
+  seat.colorCounts.g += action.g;
+}
+
+function decrementPickedColors(
+    state: DraftState,
+    action: ActionIncrementPickedColors,
+) {
+  const seat = state.seats[action.seat];
+  if (seat == undefined) {
+    throw new MutationError(`Cannot find seat ${action.seat}`);
+  }
+  seat.colorCounts.w -= action.w;
+  seat.colorCounts.u -= action.u;
+  seat.colorCounts.b -= action.b;
+  seat.colorCounts.r -= action.r;
+  seat.colorCounts.g -= action.g;
+}
+
 function assignPackRound(action: ActionAssignPackRound, state: DraftState) {
   const pack = state.packs.get(action.pack);
   if (pack == undefined || pack.type != 'pack') {

client/src/parse/TimelineGenerator.ts

@@ -1,7 +1,7 @@
 import { SourceEvent, SecretPickEvent, NormalPickEvent, ShadowPickEvent } from './SourceData';
 import { commitTimelineEvent } from '../draft/mutate';
-import { DraftState, CardPack, DraftSeat, DraftCard } from '../draft/DraftState';
-import { TimelineEvent, TimelineEventType, ActionMovePack } from '../draft/TimelineEvent';
+import { DraftState, CardPack, DraftSeat, DraftCard, MtgCard } from '../draft/DraftState';
+import { TimelineEvent, TimelineEventType, ActionMovePack, ActionIncrementPickedColors } from '../draft/TimelineEvent';
 import { ParseError } from './ParseError';
 import { checkExhaustive } from '../util/checkExhaustive';
 import { checkNotNil } from '../util/checkNotNil';
@@ -87,18 +87,25 @@ export class TimelineGenerator {
         event = this.createEvent('pick', playerData);
         for (let cardId of srcEvent.cards) {
           const card = this.getCard(cardId);
-          event.actions.push({
-            type: 'move-card',
-            subtype: 'pick-card',
-            card: cardId,
-            cardName: card.definition.name,
-            from: activePack.id,
-            to: seat.picks.id
-          }, {
-            type: 'mark-transfer',
-            from: activePack.id,
-            to: seat.picks.id,
-          });
+          event.actions.push(
+            {
+              type: 'move-card',
+              subtype: 'pick-card',
+              card: cardId,
+              cardName: card.definition.name,
+              from: activePack.id,
+              to: seat.picks.id
+            }, {
+              type: 'mark-transfer',
+              from: activePack.id,
+              to: seat.picks.id,
+            },
+            buildIncrementPickedColorsAction(
+                seat.position,
+                [card.definition],
+                [],
+            ),
+          );
 
           // TODO: Do we really need to embed all this info? Can we just get it
           // out of the event object as-needed?
@@ -334,6 +341,60 @@ function cardDisplayName(card: DraftCard) {
   return card.hidden ? `Hidden Card ${card.id}` : card.definition.name;
 }
 
+function buildIncrementPickedColorsAction(
+  seat: number,
+  gainedCards: MtgCard[],
+  lostCards: MtgCard[],
+) {
+  const action: ActionIncrementPickedColors = {
+    type: 'increment-picked-colors',
+    seat,
+    w: 0,
+    u: 0,
+    b: 0,
+    r: 0,
+    g: 0,
+  };
+
+  for (let gainedCard of gainedCards) {
+    if (gainedCard.colors.includes('W')) {
+      action.w++;
+    }
+    if (gainedCard.colors.includes('U')) {
+      action.u++;
+    }
+    if (gainedCard.colors.includes('B')) {
+      action.b++;
+    }
+    if (gainedCard.colors.includes('R')) {
+      action.r++;
+    }
+    if (gainedCard.colors.includes('G')) {
+      action.g++;
+    }
+  }
+
+  for (let gainedCard of lostCards) {
+    if (gainedCard.colors.includes('W')) {
+      action.w--;
+    }
+    if (gainedCard.colors.includes('U')) {
+      action.u--;
+    }
+    if (gainedCard.colors.includes('B')) {
+      action.b--;
+    }
+    if (gainedCard.colors.includes('R')) {
+      action.r--;
+    }
+    if (gainedCard.colors.includes('G')) {
+      action.g--;
+    }
+  }
+
+  return action;
+}
+
 interface PlayerTracker {
   seatId: number;
   currentRound: number;

client/src/parse/parseInitialState.ts

@@ -75,6 +75,7 @@ class StateParser {
               this._nextLocationId++,
               `queuedPacks for seat ${position}`),
       round: 1,
+      colorCounts: { w: 0, u: 0, b: 0, r: 0, g: 0, },
     };
 
     this.parsePacks(seat, src);

client/src/shims/shims-images.d.ts

@@ -0,0 +1,14 @@
+
+/**
+ * Our webpack is configured to allow all image files to be imported as modules
+ *
+ * The result of the import is just the path to the file in the final served
+ * folder.
+ *
+ * Sadly, there's no way to force the TS compiler to check that the module
+ * actually exists.
+ */
+declare module '*.png' {
+  const value: string;
+  export default value;
+}