From 8eb862de458e9b71c9e536d9c08028c474d9ac83 Mon Sep 17 00:00:00 2001 From: Chris Karle Date: Thu, 4 Jun 2020 23:44:29 -0400 Subject: [PATCH] CardTable, TableList, TrumpPicker Add settings for CreateTable join call using existing checkboxes on the CreateTableModal, and add the options to the displayed TableList sections. Change CardTable to use the settings from incoming msg instead of old hard-code, and implement StickDealer functionality in the TrumpPicker and CardTable (disable pass for dealer on 2nd vote) --- assets/app.scss | 4 ++++ assets/components/CardTable.js | 21 ++++++++++++++------- assets/components/TableList.js | 23 ++++++++++++++++++----- assets/components/TrumpPicker.js | 4 +++- 4 files changed, 39 insertions(+), 13 deletions(-) diff --git a/assets/app.scss b/assets/app.scss index 417444b..1fed9f0 100644 --- a/assets/app.scss +++ b/assets/app.scss @@ -353,6 +353,10 @@ font-size: 1.2rem; font-weight: 600; } +.table__options { + font-size: 0.8rem; + font-variant: small-caps; +} .table__name--locked { color: red; } diff --git a/assets/components/CardTable.js b/assets/components/CardTable.js index 8454176..efda930 100644 --- a/assets/components/CardTable.js +++ b/assets/components/CardTable.js @@ -17,9 +17,6 @@ const suit = { C: 'Clubs' } -const hard_order = true; -const hard_pick = true; - export default class CardTable extends React.Component { constructor(props) { @@ -57,8 +54,12 @@ export default class CardTable extends React.Component { innerWinMsg: '', onlyAlone: false, noPick: false, + noPass: false, amSpectator: false, - latestPost: '' + latestPost: '', + hard_order: true, + hard_pick: true, + stick_dealer: false }; }; @@ -242,7 +243,10 @@ export default class CardTable extends React.Component { this.setState({ playerNames: plAr, mySeat: mySeat, - amSpectator: newSpec + amSpectator: newSpec, + hard_order: msg.settings.hard_order, + hard_pick: msg.settings.hard_pick, + stick_dealer: msg.settings.stick_dealer }); }; } @@ -266,10 +270,11 @@ export default class CardTable extends React.Component { // second condition is for all players pass trump twice this.trumpStartSetup(msg); } - const {leftSeat, rightSeat, partnerSeat, mySeat, dealSeat} = this.state; + const {leftSeat, rightSeat, partnerSeat, mySeat, dealSeat, hard_order, hard_pick, stick_dealer} = this.state; const vote1phase = msg.game.pass_count < 4; const phaseString = vote1phase ? 'vote' : 'vote2'; const onlyAlone = hard_order && vote1phase && dealSeat == partnerSeat; + const noPass = stick_dealer && !vote1phase && (dealSeat == mySeat); const noPick = hard_pick && vote1phase && (dealSeat == mySeat) && !this.haveSuit(msg.hand, msg.game.trump_nominee); let turnInfo = ['', '', '', '']; turnInfo[msg.game.turn] = 'trump?'; @@ -279,6 +284,7 @@ export default class CardTable extends React.Component { turnSeat: msg.game.turn, onlyAlone: onlyAlone, noPick: noPick, + noPass: noPass, handLengths: msg.game.hand_lengths, leftTurnInfo: turnInfo[leftSeat], rightTurnInfo: turnInfo[rightSeat], @@ -677,7 +683,7 @@ export default class CardTable extends React.Component { const { playerNames, mySeat, phase, myCards, myTurnInfo, amSpectator, partnerHandInfo, partnerTurnInfo, partnerSeat, leftTurnInfo, leftHandInfo, leftSeat, rightHandInfo, rightTurnInfo, rightSeat, trumpPlace, trumpNom, turnSeat, - dealSeat, trump, handLengths, score, trickWinner, bannerMsg, noPick, onlyAlone, latestPost } = this.state; + dealSeat, trump, handLengths, score, trickWinner, bannerMsg, noPick, noPass, onlyAlone, latestPost } = this.state; const showSeatPicker = phase == 'lobby'; const showGameOver = phase == 'end'; const showTrump = (phase == 'vote') || (phase == 'vote2') || (phase == 'swap'); @@ -787,6 +793,7 @@ export default class CardTable extends React.Component { myDeal={dealSeat == mySeat} onlyAlone={onlyAlone} noPick={noPick} + noPass={noPass} handleVote={this.sendVote} /> )} {showSwap && !amSpectator && ( diff --git a/assets/components/TableList.js b/assets/components/TableList.js index 9c3f591..c51ff5d 100644 --- a/assets/components/TableList.js +++ b/assets/components/TableList.js @@ -45,9 +45,14 @@ export default class TableList extends React.Component { alert('Unnamed tables are not permitted'); } else { const pwd = this.ctPwd.value; + let settings = {}; + settings.hard_order = this.optHorder.checked; + settings.hard_pick = this.optHpick.checked; + settings.stick_dealer = this.optStick.checked; let joinInfo = { table: tableName, - player_name: playerName + player_name: playerName, + settings: settings } if (pwd && pwd != ''){ joinInfo.password = pwd; @@ -109,12 +114,20 @@ export default class TableList extends React.Component { }) const lockIcon = table.has_password ? () : null; const nameClass = table.has_password ? "table__name table__name--locked" : "table__name"; + const settings = table.settings; + let optionSpan = ''; + if (settings.hard_pick || settings.hard_order || settings.stick_dealer){ + const thp = settings.hard_pick ? 'HardPick' : ''; + const tho = settings.hard_order ? 'HardOrder' : ''; + const tsd = settings.stick_dealer ? 'StickDealer' : ''; + optionSpan = (   {thp} {tho} {tsd}); + } retVal.push( clickHandler(table.name, table.has_password)} > -
{lockIcon}{table.name}
+
{lockIcon}{table.name}{optionSpan}
{conflictWarning}
Seated: {seated}
Spectators: {specs}
@@ -201,11 +214,11 @@ export default class TableList extends React.Component {
Game Options {this.optHpick = input}} - defaultChecked labelText="Dealer must have suit to pick up"/> + defaultChecked labelText="HardPick: Dealer must have suit to pick up"/> {this.optHorder = input}} - defaultChecked labelText="Must play alone if ordering partner"/> + defaultChecked labelText="HardOrder: Must play alone if ordering partner"/> {this.optStick = input}} - labelText="Stick the dealer" /> + labelText="StickDealer: Dealer must name trump if no one has" />
diff --git a/assets/components/TrumpPicker.js b/assets/components/TrumpPicker.js index c1242fd..71a29ca 100644 --- a/assets/components/TrumpPicker.js +++ b/assets/components/TrumpPicker.js @@ -42,7 +42,7 @@ class TrumpPicker extends React.Component { render () { - const { trumpCard, phaseTwo, myDeal, onlyAlone, noPick, handleVote } = this.props; + const { trumpCard, phaseTwo, myDeal, onlyAlone, noPick, noPass, handleVote } = this.props; const { suitPick } = this.state; const trumpSuit = trumpCard ? trumpCard.substring(1) : 'U'; const orderLabel = myDeal ? 'Pick up' : 'Order'; @@ -59,6 +59,7 @@ class TrumpPicker extends React.Component { className="p1p__button" kind="primary" size="small" + disabled={noPass} onClick={()=>{handleVote(voteOptions.pass)}} >Pass {phaseTwo && ( @@ -97,6 +98,7 @@ TrumpPicker.propTypes = { myDeal: PropTypes.bool, onlyAlone: PropTypes.bool, noPick: PropTypes.bool, + noPass: PropTypes.bool, handleVote: PropTypes.func, } export default TrumpPicker; -- libgit2 1.1.1