diff --git a/src/components/pages/spying_log.jsx b/src/components/pages/spying_log.jsx index 5e16aba..9a3ffde 100644 --- a/src/components/pages/spying_log.jsx +++ b/src/components/pages/spying_log.jsx @@ -3,6 +3,9 @@ import { connect } from 'react-redux'; import queryString from 'query-string'; import PropTypes from 'prop-types'; +//actions +import { storeSpies, clearProfile } from '../../actions/profile.js'; + //panels import CommonLinks from '../panels/common_links.jsx'; import PagedSpyingLog from '../panels/paged_spying_log.jsx'; @@ -19,9 +22,12 @@ class SpyingLog extends React.Component { length: parseInt(params.length) || 20, fetch: null, + buttonsVisible: false, warning: '' }; + + this.sendRequest('/profilerequest', {username: this.props.username}); } componentDidMount() { @@ -30,6 +36,10 @@ class SpyingLog extends React.Component { } } + componentWillUnmount() { + this.props.clearProfile(); + } + componentDidUpdate(prevProps, prevState, snapshot) { if (JSON.stringify(this.state) !== JSON.stringify(prevState)) { this.state.fetch(); @@ -62,6 +72,7 @@ class SpyingLog extends React.Component { username={this.props.username} start={this.state.start} length={this.state.length} + spies={this.props.spies} getFetch={this.getFetch.bind(this)} onReceived={this.onReceived.bind(this)} /> @@ -73,6 +84,10 @@ class SpyingLog extends React.Component { } buttonHeader() { + if (!this.buttonsVisible) { + return null; + } + return (
@@ -102,12 +117,42 @@ class SpyingLog extends React.Component { this.props.history.push(`${this.props.location.pathname}?log=${start}`); } + //gameplay functions + sendRequest(url, args = {}) { //send a unified request, using my credentials + //build the XHR + let xhr = new XMLHttpRequest(); + xhr.open('POST', url, true); + + xhr.onreadystatechange = () => { + if (xhr.readyState === 4) { + if (xhr.status === 200) { + let json = JSON.parse(xhr.responseText); + + //on success + this.props.storeSpies(json.spies); + } + else if (xhr.status === 400) { + this.setWarning(xhr.responseText); + } + } + }; + + xhr.setRequestHeader('Content-Type', 'application/json; charset=UTF-8'); + xhr.send(JSON.stringify({ + id: this.props.id, + token: this.props.token, + ...args + })); + } + //bound callbacks getFetch(fn) { this.setState({ fetch: fn }); } onReceived(data) { + this.setState({ buttonsVisible: data.length > 0 }); + if (data.length === 0) { let start = Math.max(0, this.state.start - this.state.length); @@ -133,13 +178,16 @@ SpyingLog.propTypes = { const mapStoreToProps = (store) => { return { username: store.account.username, - loggedIn: store.account.id !== 0 + loggedIn: store.account.id !== 0, + username: store.account.username, + spies: store.profile.spies }; }; const mapDispatchToProps = (dispatch) => { return { - // + storeSpies: (x) => dispatch(storeSpies(x)), + clearProfile: () => dispatch(clearProfile()) }; }; diff --git a/src/components/panels/equipment.jsx b/src/components/panels/equipment.jsx index 8e6cfa8..2a4e621 100644 --- a/src/components/panels/equipment.jsx +++ b/src/components/panels/equipment.jsx @@ -8,7 +8,7 @@ class Equipment extends React.Component { super(props); this.state = { - // + data: [] }; if (this.props.getFetch) { @@ -17,7 +17,7 @@ class Equipment extends React.Component { } render() { - let display = this.flattenStructure(this.state, this.props.scientists); + let display = this.flattenStructure(this.state.data, this.props.scientists); //if there are no scientists if (this.props.scientists <= 0 && display.length === 0) { @@ -77,7 +77,7 @@ class Equipment extends React.Component { let json = JSON.parse(xhr.responseText); //on success - this.setState(json); + this.setState({ data: json }); if (this.props.onSuccess) { this.props.onSuccess(json); diff --git a/src/components/panels/paged_combat_log.jsx b/src/components/panels/paged_combat_log.jsx index 2bf6e0e..f77f89d 100644 --- a/src/components/panels/paged_combat_log.jsx +++ b/src/components/panels/paged_combat_log.jsx @@ -1,5 +1,4 @@ import React from 'react'; -import { withRouter, Link } from 'react-router-dom'; import { connect } from 'react-redux'; import PropTypes from 'prop-types'; @@ -10,7 +9,7 @@ class PagedCombatLog extends React.Component { super(props); this.state = { - // + data: [] }; if (props.getFetch) { @@ -21,7 +20,7 @@ class PagedCombatLog extends React.Component { render() { return (
- {Object.keys(this.state).map((key) => )} + {Object.keys(this.state.data).map((key) => )}
); } @@ -40,7 +39,7 @@ class PagedCombatLog extends React.Component { json.sort((a, b) => new Date(b.eventTime) - new Date(a.eventTime)); //on success - this.setState(json); + this.setState({ data: json }); if (this.props.onReceived) { this.props.onReceived(json); @@ -89,4 +88,4 @@ const mapDispatchToProps = (dispatch) => { PagedCombatLog = connect(mapStoreToProps, mapDispatchToProps)(PagedCombatLog); -export default withRouter(PagedCombatLog); \ No newline at end of file +export default PagedCombatLog; \ No newline at end of file diff --git a/src/components/panels/paged_spying_log.jsx b/src/components/panels/paged_spying_log.jsx index 4c02fc9..b331536 100644 --- a/src/components/panels/paged_spying_log.jsx +++ b/src/components/panels/paged_spying_log.jsx @@ -10,7 +10,7 @@ class PagedSpyingLog extends React.Component { super(props); this.state = { - // + data: [] }; if (props.getFetch) { @@ -19,9 +19,19 @@ class PagedSpyingLog extends React.Component { } render() { + //if there are no spies + if (this.props.spies <= 0 && this.state.data.length <= 0) { + return ( +
+

You have no spies!

+

Go and train some!

+
+ ); + } + return (
- {Object.keys(this.state).map((key) => )} + {Object.keys(this.state.data).map((key) => )}
); } @@ -40,7 +50,7 @@ class PagedSpyingLog extends React.Component { json.sort((a, b) => new Date(b.eventTime) - new Date(a.eventTime)); //on success - this.setState(json); + this.setState({ data: json }); if (this.props.onReceived) { this.props.onReceived(json);