Changeset faff334 for components


Ignore:
Timestamp:
07/18/22 13:59:55 (2 years ago)
Author:
anastasovv <simon@…>
Branches:
main
Children:
22367db
Parents:
e903234
Message:

Ability for admin to watch live games and for user to see games history

Location:
components
Files:
2 added
2 edited

Legend:

Unmodified
Added
Removed
  • components/Stats.jsx

    re903234 rfaff334  
    55
    66import { AiOutlineClose } from 'react-icons/ai';
     7
     8import axios from 'axios';
    79
    810const Stats = () => {
     
    1820    }
    1921
     22    function openHistory() {
     23        axios.get(`/api/postgre?action=get_games_history&session_id=${localStorage.CAESSINO_SESSION_ID}`).then(res => {
     24            if (res.data?.success) {
     25                dispatch(setStyle({
     26                    ...styleState.style,
     27                    gamesHistory: {
     28                        blackjack: {
     29                            rooms: res.data?.blackjack,
     30                        },
     31                        roulette: {
     32                            games: res.data?.roulette,
     33                        },
     34                        poker: {
     35                            tables: res.data?.poker,
     36                        },
     37                    },
     38                    displayGamesHistoryScreen: true,
     39                }))
     40            }
     41        })
     42    }
     43
    2044    return (
    2145        <div className="fullscreen fs-centered statsScreen" style={{display: styleState.style.displayStatsScreen ? 'block' : 'none'}}>
     
    2751                <p>Total roulette games won: <span>{styleState.style.statsScreenInfo.roulette.wins}</span></p>
    2852                <p>Total poker games won: <span>{styleState.style.statsScreenInfo.poker.wins}</span></p>
     53
     54                <button onClick={() => openHistory()} className="primaryButton" style={{marginTop: '5rem', marginLeft: '1rem'}}>See Games History</button>
    2955            </div>
    3056        </div>
  • components/admin/LiveGames.jsx

    re903234 rfaff334  
    88import { setAdminInformation } from '../../redux/reducers/adminInformationSlice';
    99import { setAdmin } from '../../redux/reducers/adminSlice';
     10import FreeflowCard from '../FreeflowCard';
     11import Calculations from './Calculations';
    1012
    1113const LiveGames = () => {
     
    1618
    1719  useEffect(() => {
    18     axios.get(`/api/postgre?action=get_live_games_as_admin&admin_id=${localStorage.CAESSINO_ADMIN_ID}`).then(res => {
    19       if (res.data?.success) {
    20         dispatch(setAdminInformation({
    21           ...adminInformationState.adminInformation,
    22           complaints: res.data?.complaints,
    23         }))
    24       }
    25     })
     20    let interval = setInterval(() => {
     21      axios.get(`/api/postgre?action=get_live_games_as_admin&admin_id=${localStorage.CAESSINO_ADMIN_ID}`).then(res => {
     22        if (res.data?.success) {
     23          dispatch(setAdminInformation({
     24            ...adminInformationState.adminInformation,
     25            liveGames: {
     26              blackjack: {
     27                rooms: res.data?.blackjack,
     28              },
     29              roulette: res.data?.roulette,
     30              poker: {
     31                tables: res.data?.poker,
     32              },
     33            }
     34          }))
     35        }
     36      })
     37    }, 1000);
     38
     39    return () => {
     40      if (interval !== null) clearInterval(interval);
     41  };
    2642  }, [])
    2743 
     
    3753
    3854  return (
    39     <div className="fullscreen top-to-bottom-centered admin complaintsScreen">
     55    <div className="fullscreen top-to-bottom-centered admin liveGamesScreen">
    4056      <div>
    41           <p className="link" onClick={() => hideLiveGamesScreen()}>⬅ Go Back</p>
     57        <p className="link" onClick={() => hideLiveGamesScreen()}>⬅ Go Back</p>
    4258
    43           <h3>These are the current live games. You can click on one to see more details about it.</h3>
     59        <h3>These are the current live games.</h3>
    4460
    45           { adminInformationState.complaints?.map(complaint => (
    46             <div key={complaint.by + complaint.description.substr(0, 20)}>
    47               { complaint.by }
    48               { complaint.description }
     61        <div className="liveGamesMegaContainer">
     62          <div className="liveBlackjackGames liveGamesContainer">
     63            <h3>Live BLackjack Games:</h3>
     64            { adminInformationState.adminInformation.liveGames.blackjack?.rooms?.map(room => (
     65              <div key={room.id} className="liveBlackjackGame">
     66                <div>
     67                  <div>
     68                    { room?.playerCards?.map((card, i) => (
     69                      <FreeflowCard key={`playercard${i}`} card={card}/>
     70                    ))}
     71                    <h5><Calculations action="calculateHandValue" cards={room.playerCards}/></h5>
     72                  </div>
     73                  <p>Player {room.displayName} (${parseInt(room.initialBet) + parseInt(room.sideBet)})</p>
     74                </div>
     75                <div>
     76                  <div>
     77                      <h6><span>Status:</span><br/>{room.status}</h6>
     78                      <h6><span>Outcome:</span><br/>{room.outcome}</h6>
     79                      <h6><span>Side Bet Outcome:</span><br/>{room.sideBetOutcome}</h6>
     80                  </div>
     81                </div>
     82                <div>
     83                  <div>
     84                    <h5><Calculations action="calculateHandValue" cards={room.dealerCards}/></h5>
     85                    { room?.dealerCards?.map((card, i) => (
     86                      <FreeflowCard key={`dealercard${i}`} card={card}/>
     87                    ))}
     88                  </div>
     89                  <p>Dealer {room.dealerName}</p>
     90                </div>
     91              </div>
     92            )) }
     93          </div>
     94
     95          <div className="liveRouletteGame liveGamesContainer">
     96            <h3>Live Roulette Game:</h3>
     97            <div>
     98              <h6>
     99                <span>Status: </span>{adminInformationState.adminInformation?.liveGames?.roulette?.status}&nbsp;&nbsp;&nbsp;&nbsp;
     100                <span>Time to start: </span>{adminInformationState.adminInformation?.liveGames?.roulette?.timeToStart}&nbsp;&nbsp;&nbsp;&nbsp;
     101                <span>Ball on number: </span>{adminInformationState.adminInformation?.liveGames?.roulette?.magicNumber}&nbsp;&nbsp;&nbsp;&nbsp;
     102                <span>Winning bets: </span>{adminInformationState.adminInformation?.liveGames?.roulette?.winningBets?.join(", ")}
     103              </h6>
     104              <h6 style={{marginTop: '2rem'}}><span>Players:</span></h6>
     105              { adminInformationState.adminInformation?.liveGames?.roulette?.players?.map((player, i) => (
     106                <div key={player.session_id} className="playerInLiveRouletteGame">
     107                  <div>
     108                    <h6><span>Player {i+1} -&gt;</span></h6>
     109                  </div>
     110                  <div>
     111                    <h6><span>{player.name} (${player.betAmount})</span></h6>
     112                  </div>
     113                  <div>
     114                    <h6><span>Betted on: </span>{player.whichBets.join(", ")}</h6>
     115                  </div>
     116                  <div>
     117                    <h6><span>Outcome: {player.outcome}</span></h6>
     118                  </div>
     119                </div>
     120              )) }
    49121            </div>
    50           )) }
     122          </div>
     123
     124          <div className="livePokerGames liveGamesContainer">
     125            <h3>Live Poker Games:</h3>
     126            { adminInformationState.adminInformation.liveGames.poker?.tables?.map(table => (
     127              <div key={table.id} className="livePokerGame">
     128                <h6>
     129                  <span>Round: </span>{table?.round}/4&nbsp;&nbsp;&nbsp;&nbsp;
     130                  <span>Started: </span>{table?.started}&nbsp;&nbsp;&nbsp;&nbsp;
     131                  <span>Player on turn: </span>{table?.turnIdx}&nbsp;&nbsp;&nbsp;&nbsp;
     132                  <span>Pot: </span>{table?.pot}&nbsp;&nbsp;&nbsp;&nbsp;
     133                  <span>Winners: </span>{table?.winners?.map(e=>e.displayName)?.join(", ")}
     134                </h6>
     135                <div className="cardsOnTable" style={{marginTop: '2rem'}}>
     136                  { table?.cards?.map((card, i) => (
     137                    <FreeflowCard key={`tablecard${i}`} card={card}/>
     138                  ))}
     139                </div>
     140                <h6 style={{marginTop: '2rem'}}><span>Players:</span></h6>
     141                {table.players?.map(player => (
     142                  <div key={player.id} className="playerInLivePokerGame">
     143                    <div>
     144                      <h6><span>Player {player.displayName} (${player.betAmount})</span></h6>
     145                    </div>
     146                    <div className="cards">
     147                      { player?.cards?.map((card, i) => (
     148                        <FreeflowCard key={`playercard${i}`} card={card}/>
     149                      ))}
     150                    </div>
     151                    <div>
     152                      <h6><span>Hand: </span><Calculations action="getBestHandDetails" cards={player.cards} cards2={table.cards}/></h6>
     153                    </div>
     154                  </div>
     155                ))}
     156              </div>
     157            )) }
     158          </div>
     159        </div>
    51160      </div>
    52161    </div>
Note: See TracChangeset for help on using the changeset viewer.