Implemented picking mechanism in UX

This commit is contained in:
Chris Blanchard 2015-09-16 16:16:00 +01:00
parent eef26b30c0
commit 51964138c5
3 changed files with 32 additions and 20 deletions

View file

@ -94,7 +94,14 @@ module.exports = function (namespace) {
let team = gatherLeader.team; let team = gatherLeader.team;
let method = (team === 'alien') ? gather.moveToAlien : gather.moveToMarine; let method = (team === 'alien') ? gather.moveToAlien : gather.moveToMarine;
method.call(gather, selectedPlayer.user); method.call(gather, selectedPlayer.user, socket._user);
// Check if last player and add to last team
if (gather.lobby().length === 1) {
let assignLast = (gather.marines().length === 6) ?
gather.moveToAlien : gather.moveToMarine;
assignLast.call(gather, gather.lobby().pop());
}
if (gather.can("confirmSelection")) { if (gather.can("confirmSelection")) {
gather.confirmSelection(socket._user); gather.confirmSelection(socket._user);

View file

@ -268,6 +268,7 @@ Gather.prototype.toJson = () => {
return { return {
gatherers: this.gatherers, gatherers: this.gatherers,
state: this.current, state: this.current,
pickingTurn: this.pickingTurn(),
election: { election: {
startTime: this.electionTimer(), startTime: this.electionTimer(),
interval: this.ELECTION_INTERVAL interval: this.ELECTION_INTERVAL

View file

@ -9,25 +9,24 @@ var SelectPlayerButton = React.createClass({
}, },
render() { render() {
let button;
if (this.props.gatherer.leader) { if (this.props.gatherer.leader) {
return (<button button = <button
className="btn btn-xs btn-default" className="btn btn-xs btn-default"
data-disabled="true">Leader</button>); data-disabled="true">Leader</button>;
} else if (this.props.gatherer.team !== "lobby") { } else if (this.props.gatherer.team !== "lobby") {
return (<button button = <button
onClick={this.selectPlayer} data-disabled="true"
value={this.props.gatherer.id} className="btn btn-xs btn-default"> {this.props.gatherer.team}
className="btn btn-xs btn-default"> Reselect </button>;
</button>
);
} else { } else {
return (<button button = <button
onClick={this.selectPlayer} onClick={this.selectPlayer}
value={this.props.gatherer.id} value={this.props.gatherer.id}
className="btn btn-xs btn-primary"> Select className="btn btn-xs btn-primary"> Select
</button> </button>;
);
} }
return button;
} }
}); });
@ -70,7 +69,7 @@ var GatherTeams = React.createClass({
render() { render() {
return ( return (
<div className="row add-top"> <div className="row add-top">
<div className="col-md-6"> <div className="col-sm-6">
<div className="panel panel-default"> <div className="panel panel-default">
<div className="panel-heading"> <div className="panel-heading">
Aliens Aliens
@ -78,7 +77,7 @@ var GatherTeams = React.createClass({
<GathererList gather={this.props.gather} team="alien" /> <GathererList gather={this.props.gather} team="alien" />
</div> </div>
</div> </div>
<div className="col-md-6"> <div className="col-sm-6">
<div className="panel panel-default"> <div className="panel panel-default">
<div className="panel-heading"> <div className="panel-heading">
Marines Marines
@ -191,7 +190,8 @@ var GatherProgress = React.createClass({
return { return {
num: num, num: num,
den: den, den: den,
message: num + " out of " + den + " players assigned" message: `${num} out of ${den} players assigned. Waiting
on ${_.capitalize(this.props.gather.pickingTurn)}s to pick next...`
}; };
}, },
@ -578,10 +578,10 @@ var Gather = React.createClass({
if (state === 'gathering' || state === 'election') { if (state === 'gathering' || state === 'election') {
voting = ( voting = (
<div className="row add-top"> <div className="row add-top">
<div className="col-md-6"> <div className="col-sm-6">
<MapVoting {...this.props} /> <MapVoting {...this.props} />
</div> </div>
<div className="col-md-6"> <div className="col-sm-6">
<ServerVoting {...this.props} /> <ServerVoting {...this.props} />
</div> </div>
</div> </div>
@ -668,14 +668,18 @@ var Gatherers = React.createClass({
} }
if (self.props.gather.state === 'selection') { if (self.props.gather.state === 'selection') {
if (self.props.currentGatherer && self.props.currentGatherer.leader) { if (self.props.currentGatherer &&
self.props.currentGatherer.leader &&
self.props.currentGatherer.team === self.props.gather.pickingTurn) {
action = ( action = (
<span> <span>
<SelectPlayerButton gatherer={gatherer} /> <SelectPlayerButton gatherer={gatherer} />
</span> </span>
); );
} else { } else {
if (gatherer.team !== "lobby") { if (gatherer.leader) {
action = (<span className="label label-default">Leader</span>);
} else if (gatherer.team !== "lobby") {
action = (<span className="label label-primary">{gatherer.team}</span>); action = (<span className="label label-primary">{gatherer.team}</span>);
} }
} }