source: components/poker/sections/RaiseModal.jsx@ 189cd8f

main
Last change on this file since 189cd8f was 3a783f2, checked in by anastasovv <simon@…>, 2 years ago

Finished poker and added ball to roulette

  • Property mode set to 100644
File size: 2.4 KB
Line 
1import React from 'react'
2
3import { GiTwoCoins } from 'react-icons/gi'
4import { AiOutlineClose } from 'react-icons/ai'
5
6import { useSelector, useDispatch } from 'react-redux'
7
8import axios from 'axios';
9import { setPoker } from '../../../redux/reducers/styleSlice';
10
11const RaiseModal = () => {
12 const dispatch = useDispatch();
13
14 const playerState = useSelector(state => state.player);
15 const styleState = useSelector(state => state.style);
16
17 function chooseBet(e) {
18 dispatch(setPoker({
19 ...styleState.poker,
20 inputControls: {
21 ...styleState.poker.inputControls,
22 raise: {
23 ...styleState.poker.inputControls.bet,
24 chosenCredits: parseInt(e.target.value),
25 }
26 }
27 }));
28 }
29
30 function raise() {
31 axios.get(`/api/poker?action=game_action&session_id=${localStorage.CAESSINO_SESSION_ID}&specificAction=raise&betAmount=${styleState.poker.inputControls.raise.chosenCredits}`);
32
33 closeModal();
34 }
35
36 function closeModal() {
37 dispatch(setPoker({
38 ...styleState.poker,
39 displays: {
40 ...styleState.poker.displays,
41 raiseModal: false,
42 },
43 }))
44 }
45
46 return (
47 <div className="pokerRaiseModal" style={{display: styleState.poker.displays.raiseModal ? 'flex' : 'none'}}>
48 <p>Please select the amount you will raise.</p>
49 <div>
50 <div>
51 <input type="range" className="primarySlider" min={0} max={playerState.player.credits} step={1} value={styleState.poker.inputControls.raise.chosenCredits} onChange={(e) => chooseBet(e)} />
52 <div style={{marginTop: '15px', marginBottom: '-30px'}}>
53 <span>${styleState.poker.inputControls.raise.chosenCredits}</span>
54 </div>
55 </div>
56 <button style={{marginTop: '50px'}} className="primaryButton" onClick={() => raise()}>Raise <GiTwoCoins style={{marginTop: '3px', marginBottom: '-3px'}} /></button>
57 <br/>
58 <button style={{position: 'absolute', bottom: '10%', left: '50%', transform: 'translateX(-50%)'}} className="tertiaryButton" onClick={() => closeModal()}>Cancel <AiOutlineClose style={{marginTop: '3px', marginBottom: '-3px'}} /></button>
59 </div>
60 </div>
61 )
62}
63
64export default RaiseModal
Note: See TracBrowser for help on using the repository browser.