diff --git a/pages/tournament.js b/pages/tournament.js index d8a0181..98a42d3 100644 --- a/pages/tournament.js +++ b/pages/tournament.js @@ -5,7 +5,7 @@ import { Card, CardBody, Col, - Container, + Container, Input, InputGroup, InputGroupAddon, ListGroup, ListGroupItem, Modal, @@ -136,10 +136,12 @@ class Match extends React.Component { function MatchModal(props) { let title; + let actionButton = ''; //possible states: single_team not_ready not_started in_progress team1_won team2_won undecided switch (props.match.state) { case 'in_progress': title = 'Spiel läuft'; + actionButton = break; case 'team1_won': title = 'Spiel beendet'; @@ -155,6 +157,7 @@ function MatchModal(props) { break; case 'not_started': title = 'Spiel kann gestartet werden'; + actionButton = ; break; case 'undecided': title = 'Spiel beendet'; @@ -164,11 +167,11 @@ function MatchModal(props) { {title} - + {props.match.state === 'in_progress' ? : + } - {props.match.state === 'not_started' ? - : ''}{' '} + {actionButton} @@ -217,6 +220,57 @@ function MatchTable(props) { ) } +function EditableMatchTable(props) { + return ( + + + + + + + + + + + +
+ + {props.match.team1}
+ + {props.match.team2}
+ ) +} + +class ScoreInput extends React.Component { + constructor(props) { + super(props); + this.state = {score: this.props.score}; + this.updateScore = this.updateScore.bind(this); + this.increaseScore = this.increaseScore.bind(this); + this.decreaseScore = this.decreaseScore.bind(this); + } + + updateScore(event){ + this.setState({score: event.target.value}); + } + + increaseScore(){ + this.setState({score: Number(this.state.score) + 1}); + } + + decreaseScore(){ + this.setState({score: Number(this.state.score) - 1}); + } + + render() { + return ( + + + + ); + } +} + class Main extends React.Component { constructor(props) { diff --git a/static/css/tournament.css b/static/css/tournament.css index 47a987e..b00bdef 100644 --- a/static/css/tournament.css +++ b/static/css/tournament.css @@ -21,4 +21,8 @@ .match:hover > div { border-width: 3px !important; margin: -2px; +} + +.scoreInput { + width: 11rem; } \ No newline at end of file