feat(overlay): battlegrounds anomalies

HearthSim · Aug 22, 2023 · e4f1f86 · e4f1f86
1 parent 5461682
commit e4f1f86
Show file tree

Hide file tree

Showing 4 changed files with 70 additions and 22 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -8,6 +8,7 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
 ### Added
 - Added support for decks containing sideboard
 - Added support for Twist decks
+- Added support for Battlegrounds anomalies
 
 ## [1.2.3] - 2022-02-04
 ### Added

diff --git a/src/twitch-hdt.d.ts b/src/twitch-hdt.d.ts
@@ -30,6 +30,11 @@ export interface BoardStateData {
 	 */
 	opponent?: BoardStatePlayer;
 
+	/**
+	 * The dbfId of the Battleground anomaly.
+	 */
+	battlegrounds_anomaly?: number;
+
 	/**
 	 * Contains the game type of the current game.
 	 */

diff --git a/src/viewer/mobile/Panel.tsx b/src/viewer/mobile/Panel.tsx
@@ -24,6 +24,7 @@ import BobsBuddy from "../overlay/BobsBuddy";
 import { TooltipBehaviour, TooltipProvider } from "../utils/tooltips";
 import CardList from "./CardList";
 import Scroller from "./Scroller";
+import CardTile from "../CardTile";
 
 interface Props {
 	boardState: BoardStateData | null;
@@ -167,6 +168,13 @@ const HeaderIcon = styled.img`
 	padding: 8px 3px;
 `;
 
+const BattlegroundsContainer = styled.div`
+	height: 100vh;
+	display: flex;
+	flex-direction: column;
+	justify-content: space-between;
+`;
+
 class Panel extends React.Component<Props & TwitchExtProps, State> {
 	public static getDerivedStateFromProps(
 		nextProps: Props & TwitchExtProps,
@@ -267,28 +275,45 @@ class Panel extends React.Component<Props & TwitchExtProps, State> {
 					<Portal ref={(ref) => (this.portal = ref)} />
 					<PortalProvider value={{ portal: this.portal }}>
 						{isBattlegrounds ? (
-							boardState &&
-							boardState.bobs_buddy_state != null &&
-							showBobsBuddy ? (
-								<BobsBuddy
-									winRate={boardState.bobs_buddy_state.win_rate}
-									tieRate={boardState.bobs_buddy_state.tie_rate}
-									lossRate={boardState.bobs_buddy_state.loss_rate}
-									playerLethal={boardState.bobs_buddy_state.player_lethal_rate}
-									opponentLethal={
-										boardState.bobs_buddy_state.opponent_lethal_rate
-									}
-									simulationState={boardState.bobs_buddy_state.simulation_state}
-									whenToShowStats={
-										this.props.config.when_to_show_bobs_buddy
-											? (this.props.config
-													.when_to_show_bobs_buddy as WhenToShowBobsBuddy)
-											: WhenToShowBobsBuddy.All
-									}
-									userSeesDuringCombat={true}
-									userSeesDuringShopping={true}
-									layout="mobile"
-								/>
+							boardState ? (
+								<BattlegroundsContainer>
+									{boardState.bobs_buddy_state != null && showBobsBuddy ? (
+										<BobsBuddy
+											winRate={boardState.bobs_buddy_state.win_rate}
+											tieRate={boardState.bobs_buddy_state.tie_rate}
+											lossRate={boardState.bobs_buddy_state.loss_rate}
+											playerLethal={
+												boardState.bobs_buddy_state.player_lethal_rate
+											}
+											opponentLethal={
+												boardState.bobs_buddy_state.opponent_lethal_rate
+											}
+											simulationState={
+												boardState.bobs_buddy_state.simulation_state
+											}
+											whenToShowStats={
+												this.props.config.when_to_show_bobs_buddy
+													? (this.props.config
+															.when_to_show_bobs_buddy as WhenToShowBobsBuddy)
+													: WhenToShowBobsBuddy.All
+											}
+											userSeesDuringCombat={true}
+											userSeesDuringShopping={true}
+											layout="mobile"
+										/>
+									) : null}
+									{boardState && boardState.battlegrounds_anomaly ? (
+										<div>
+											<Header style={{ paddingLeft: "3px" }}>
+												<h1>Battlegrounds Anomaly (tap and hold)</h1>
+											</Header>
+											<CardTile
+												dbfId={boardState.battlegrounds_anomaly}
+												showRarity={false}
+											/>
+										</div>
+									) : null}
+								</BattlegroundsContainer>
 							) : null
 						) : showDeckList && deck && deck.cards ? (
 							<>

diff --git a/src/viewer/overlay/Overlay.tsx b/src/viewer/overlay/Overlay.tsx
@@ -146,6 +146,15 @@ const Weapon = styled(OverlayElement)`
 	clip-path: circle(50% at 50% 50%);
 `;
 
+const BattlegroundsAnomaly = styled(OverlayElement)`
+	top: ${(props) => props.top || "unset"};
+	right: ${(props) => props.right || "unset"};
+
+	height: 8.5vh;
+	width: 8.5vh;
+	clip-path: circle(50% at 50% 50%);
+`;
+
 const Deck = styled(OverlayElement)`
 	top: ${(props) => props.top || "unset"};
 	right: ${(props) => props.right || "unset"};
@@ -322,6 +331,11 @@ class Overlay extends React.Component<Props & TwitchExtProps, State> {
 		const opponent =
 			boardState && boardState.opponent ? boardState.opponent : {};
 
+		const anomaly =
+			boardState && boardState.battlegrounds_anomaly
+				? boardState.battlegrounds_anomaly
+				: null;
+
 		const gameType =
 			boardState && boardState.game_type
 				? boardState.game_type
@@ -585,6 +599,9 @@ class Overlay extends React.Component<Props & TwitchExtProps, State> {
 									</Deck>
 								</>
 							) : null}
+							<BattlegroundsAnomaly right={"24vh"} top={"34.5vh"}>
+								<Entity dbfId={anomaly || null} />
+							</BattlegroundsAnomaly>
 						</Offset>
 					)}
 				</PortalProvider>