diff --git a/pages/tournament-fullscreen.js b/pages/tournament-fullscreen.js
index ecbe69b..84a7c7b 100644
--- a/pages/tournament-fullscreen.js
+++ b/pages/tournament-fullscreen.js
@@ -6,9 +6,10 @@ import '../static/css/everypage.css';
import '../static/css/tournament-fullscreen.css';
import {getTournamentMatches, getTournamentMeta} from '../js/redux/tournamentApi';
import {
- Col, DropdownItem, DropdownMenu, DropdownToggle, Navbar, NavbarBrand, NavItem, Row, UncontrolledDropdown
+ Col, Container, DropdownItem, DropdownMenu, DropdownToggle, Navbar, NavbarBrand, NavItem, Row, UncontrolledDropdown
} from 'reactstrap';
import {Match} from '../js/components/Match';
+import {Spinner} from 'react-bootstrap';
function FullscreenPage(props) {
@@ -19,10 +20,19 @@ function FullscreenPage(props) {
}
function Matches(props) {
- return (
-
+ let matches;
+ if (props.matches == null) {
+ matches = (
+
+ lade Matches
+
);
+ } else {
+ matches = (
{props.matches.map(match => )}
-
+
);
+ }
+ return (
+ {matches}
);
}
@@ -70,7 +80,7 @@ class Main extends React.Component {
super(props);
this.state = {
- tournamentMeta: null, matches: [], matchFilter: matchFilters.all
+ tournamentMeta: null, matches: [], matchFilter: matchFilters.all, loadedMeta: false, loadedMatches: false
};
this.onTournamentRequestSuccess = this.onTournamentRequestSuccess.bind(this);
this.onTournamentRequestError = this.onTournamentRequestError.bind(this);
@@ -81,7 +91,7 @@ class Main extends React.Component {
}
selectFilter(filter) {
- this.setState({matchFilter: filter});
+ this.setState({matchFilter: filter, loadedMatches: false});
this.updateMatches();
}
@@ -105,36 +115,55 @@ class Main extends React.Component {
onTournamentRequestSuccess(requestStatus, tournament) {
- this.setState({metaStatus: requestStatus, tournamentMeta: tournament});
+ this.setState({metaStatus: requestStatus, tournamentMeta: tournament, loadedMeta: true});
}
onTournamentRequestError(error) {
if (error.response) {
- this.setState({metaStatus: error.response.status});
+ this.setState({metaStatus: error.response.status, loadedMeta: true});
} else {
- this.setState({metaStatus: -1});
+ this.setState({metaStatus: -1, loadedMeta: true});
}
}
onTournamentMatchesRequestSuccess(requestStatus, matches) {
- this.setState({matchesStatus: requestStatus, matches: matches});
+ this.setState({matchesStatus: requestStatus, matches: matches, loadedMatches: true});
}
onTournamentMatchesRequestError(error) {
if (error.response) {
- this.setState({matchesStatus: error.response.status});
+ this.setState({matchesStatus: error.response.status, loadedMatches: true});
} else {
- this.setState({matchesStatus: -1});
+ this.setState({matchesStatus: -1, loadedMatches: true});
}
}
render() {
- const {metaStatus, tournamentMeta, matches} = this.state;
+ const {metaStatus, matchesStatus, tournamentMeta, matches} = this.state;
const filter = {
selected: this.state.matchFilter, select: this.selectFilter
};
- if (metaStatus === 200) {
+ if (!this.state.loadedMeta) {
+ return (
+
+
Vollbild-Ansicht: turnie.re
+
+
+
+ lade Vollbild-Ansicht
+
+ );
+ }
+ if (!this.state.loadedMatches) {
+ return (
+
+
{tournamentMeta.name}: turnie.re
+
+
+ );
+ }
+ if (metaStatus === 200 && matchesStatus === 200) {
return (
{tournamentMeta.name}: turnie.re