diff --git a/js/api.js b/js/api.js
index a29021c..bf66369 100644
--- a/js/api.js
+++ b/js/api.js
@@ -183,7 +183,10 @@ const reducerTournamentinfo = (state = defaultStateTournamentinfo, action) => {
postRequest(action.state, '/tournaments', action.parameters.tournament).then(resp => {
storeOptionalToken(resp);
action.parameters.successCallback();
- }).catch(() => {
+ }).catch(error => {
+ if (error.response) {
+ storeOptionalToken(error.response);
+ }
action.parameters.errorCallback();
});
return Object.assign({}, state, {});
diff --git a/js/components/WarningPopup.js b/js/components/WarningPopup.js
new file mode 100644
index 0000000..0c0152a
--- /dev/null
+++ b/js/components/WarningPopup.js
@@ -0,0 +1,18 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import {Alert, Collapse} from 'reactstrap';
+
+export class WarningPopup extends React.Component {
+ render() {
+ return (
+
+ {this.props.text}
+
+ );
+ }
+}
+
+WarningPopup.propTypes = {
+ text: PropTypes.string.isRequired,
+ shown: PropTypes.bool.isRequired
+};
diff --git a/pages/create.js b/pages/create.js
index 9165c1b..0883b4a 100644
--- a/pages/create.js
+++ b/pages/create.js
@@ -2,12 +2,25 @@ import Head from 'next/head';
import React from 'react';
import {notify} from 'react-notify-toast';
import {connect} from 'react-redux';
-import posed from 'react-pose';
-import {Button, Card, CardBody, Col, Container, CustomInput, Form, FormGroup, Input, Label} from 'reactstrap';
+import {
+ Button,
+ Card,
+ CardBody,
+ Col,
+ Collapse,
+ Container,
+ CustomInput,
+ Form,
+ FormGroup,
+ Input,
+ Label,
+ Row
+} from 'reactstrap';
import {TurniereNavigation} from '../js/components/Navigation';
import {Footer} from '../js/components/Footer';
import EditableStringList from '../js/components/EditableStringList';
import {createTournament} from '../js/api';
+import {WarningPopup} from '../js/components/WarningPopup';
import '../static/css/everypage.css';
import RequireLogin from '../js/components/RequireLogin';
@@ -48,14 +61,6 @@ function CreateTournamentCard() {
);
}
-const GroupphaseFader = posed.div({
- visible: {
- opacity: 1, height: 150
- }, hidden: {
- opacity: 0, height: 0
- }
-});
-
class CreateTournamentForm extends React.Component {
constructor(props) {
super(props);
@@ -78,6 +83,7 @@ class CreateTournamentForm extends React.Component {
this.increaseGroupSize = this.increaseGroupSize.bind(this);
this.decreaseGroupSize = this.decreaseGroupSize.bind(this);
this.generateTournamentCreationObject = this.generateTournamentCreationObject.bind(this);
+ this.valuesAreCredible = this.valuesAreCredible.bind(this);
this.create = this.create.bind(this);
}
@@ -104,26 +110,34 @@ class CreateTournamentForm extends React.Component {
checked={this.state.groupPhaseEnabled}
onChange={this.handleGroupPhaseEnabledInput}/>
-
+
-
-
-
+
+
+
+
+
+
-
-
-
+
+
+
+
+
+
-
+
Teams
);
}
+ areGroupsIncomplete() {
+ return this.state.groups.filter(group => group.length !== this.state.groupSize).length !== 0;
+ }
+
teamListUpdate(list) {
this.setState({teams: list});
}
@@ -153,11 +171,9 @@ class CreateTournamentForm extends React.Component {
increaseGroupAdvance() {
const newGroupAdvance = this.state.groupAdvance * 2;
- if (newGroupAdvance <= this.state.groupSize) {
- this.setState({
- groupAdvance: newGroupAdvance
- });
- }
+ this.setState({
+ groupAdvance: newGroupAdvance
+ });
}
decreaseGroupAdvance() {
@@ -171,21 +187,14 @@ class CreateTournamentForm extends React.Component {
}
increaseGroupSize() {
- this.setState({groupSize: this.state.groupSize+1});
+ this.setState({groupSize: this.state.groupSize + 1});
}
decreaseGroupSize() {
const newGroupSize = this.state.groupSize - 1;
if (newGroupSize >= 3) {
- if (newGroupSize >= this.state.groupAdvance) {
- this.setState({groupSize: newGroupSize});
- } else {
- this.setState({
- groupSize: newGroupSize,
- groupAdvance: Math.floor(this.state.groupAdvance / 2)
- });
- }
+ this.setState({groupSize: newGroupSize});
}
}
@@ -206,11 +215,19 @@ class CreateTournamentForm extends React.Component {
}
create() {
- createTournament(this.generateTournamentCreationObject(), () => {
- notify.show('Das Turnier wurde erfolgreich erstellt.', 'success', 5000);
- }, () => {
- notify.show('Das Turnier konnte nicht erstellt werden.', 'warning', 5000);
- });
+ if (this.valuesAreCredible()) {
+ createTournament(this.generateTournamentCreationObject(), () => {
+ notify.show('Das Turnier wurde erfolgreich erstellt.', 'success', 5000);
+ }, () => {
+ notify.show('Das Turnier konnte nicht erstellt werden.', 'warning', 5000);
+ });
+ } else {
+ notify.show('Bitte korrigiere deine Eingaben zuerst.', 'warning', 5000);
+ }
+ }
+
+ valuesAreCredible() {
+ return this.state.teams.length >= this.state.groupAdvance && !this.areGroupsIncomplete();
}
generateTournamentCreationObject() {