playball
Version:
Watch MLB games from the comfort of your terminal
112 lines • 4.1 kB
JavaScript
import React, { useEffect } from 'react';
import { useSelector } from "react-redux/lib/alternate-renderers.js";
import Count from "./Count.js";
import Bases from "./Bases.js";
import BoxScore from "./BoxScore.js";
import LineScore from "./LineScore.js";
import Matchup from "./Matchup.js";
import AtBat from "./AtBat.js";
import AllPlays from "./AllPlays.js";
import InningDisplay from "./InningDisplay.js";
import { get } from "../config.js";
import { selectGameStatus, selectLineScore, selectTeams } from "../features/games.js";
import { resetTitle, setTitle } from "../screen.js";
import useKey from "../hooks/useKey.js";
const GAME_STATUS = 'GAME_STATUS';
const BOX_SCORE = 'BOX_SCORE';
const SCORING_PLAYS = 'SCORING_PLAYS';
function LiveGame() {
const gameStatus = useSelector(selectGameStatus);
const linescore = useSelector(selectLineScore);
const teams = useSelector(selectTeams);
const [view, setView] = React.useState(GAME_STATUS);
useKey('g', () => setView(GAME_STATUS), {
key: 'G',
label: 'Game Status'
});
useKey('b', () => setView(BOX_SCORE), {
key: 'B',
label: 'Box Score'
});
useKey('p', () => setView(SCORING_PLAYS), {
key: 'P',
label: 'Scoring Plays'
});
useEffect(() => {
if (get('title')) {
const homeRuns = linescore.teams['home'].runs;
const awayRuns = linescore.teams['away'].runs;
const home = teams.home.abbreviation;
const away = teams.away.abbreviation;
let inning = '';
if (gameStatus.detailedState === 'Postponed') {
inning = 'PPD';
} else if (gameStatus.detailedState === 'Cancelled') {
inning = 'C';
} else if (gameStatus.detailedState === 'Final') {
inning = 'F';
} else if (gameStatus.detailedState !== 'Pre-Game' && gameStatus.detailedState !== 'Warmup') {
const currentInning = linescore.currentInning;
if (currentInning) {
const upDown = linescore.isTopInning ? '▲' : '▼';
inning = ` ${upDown} ${currentInning}`;
}
}
setTitle(`${away} ${awayRuns} - ${home} ${homeRuns}${inning}`);
return () => {
resetTitle();
};
}
}, [gameStatus, get, linescore, resetTitle, setTitle, teams]);
return /*#__PURE__*/React.createElement("element", null, /*#__PURE__*/React.createElement("element", {
top: 0,
left: 1,
width: "100%-1",
height: 3
}, /*#__PURE__*/React.createElement("element", {
left: 0,
width: 2
}, /*#__PURE__*/React.createElement(InningDisplay, null)), /*#__PURE__*/React.createElement("element", {
left: 5,
width: "25%-5"
}, /*#__PURE__*/React.createElement(Count, null)), /*#__PURE__*/React.createElement("element", {
left: "25%+1",
width: "25%"
}, /*#__PURE__*/React.createElement(Bases, null)), /*#__PURE__*/React.createElement("element", {
left: "50%+2",
width: "50%-2"
}, /*#__PURE__*/React.createElement(LineScore, null))), /*#__PURE__*/React.createElement("line", {
orientation: "horizontal",
type: "line",
top: 3,
width: "100%"
}), view === GAME_STATUS && /*#__PURE__*/React.createElement("element", {
top: 4,
left: 1
}, /*#__PURE__*/React.createElement("element", {
width: "50%-1"
}, /*#__PURE__*/React.createElement("element", {
top: 0,
height: 2
}, /*#__PURE__*/React.createElement(Matchup, null)), /*#__PURE__*/React.createElement("element", {
top: 3
}, /*#__PURE__*/React.createElement(AtBat, null))), /*#__PURE__*/React.createElement("line", {
orientation: "vertical",
type: "line",
left: "50%"
}), /*#__PURE__*/React.createElement("element", {
left: "50%+2",
width: "50%-2"
}, /*#__PURE__*/React.createElement(AllPlays, {
reverse: true
}))), view === BOX_SCORE && /*#__PURE__*/React.createElement("element", {
top: 4,
left: 1
}, /*#__PURE__*/React.createElement(BoxScore, null)), view === SCORING_PLAYS && /*#__PURE__*/React.createElement("element", {
top: 4,
left: 1
}, /*#__PURE__*/React.createElement(AllPlays, {
scoringOnly: true
})));
}
export default LiveGame;