diff --git a/auth.json.dev b/auth.json.dev new file mode 100644 index 0000000..9193c23 --- /dev/null +++ b/auth.json.dev @@ -0,0 +1,6 @@ +{ + "env": { + "REACT_APP_GA_TRACKING_ID": "", + "REACT_APP_GA_DEBUG": true + } +} \ No newline at end of file diff --git a/public/news/2019-05-30-01.md b/public/news/2019-05-30-01.md index d099352..1f57180 100644 --- a/public/news/2019-05-30-01.md +++ b/public/news/2019-05-30-01.md @@ -6,6 +6,7 @@ So changes I'm making today: * Both incoming and outgoing combats are now visible. * Google analytics implemented. +* The game ladder can now point to a specific rank with the URL: [https://kingdombattles.net/ladder?rank=0](ladder?rank=0) Known Bugs: diff --git a/src/components/pages/ladder.jsx b/src/components/pages/ladder.jsx index d59cfb3..b91709f 100644 --- a/src/components/pages/ladder.jsx +++ b/src/components/pages/ladder.jsx @@ -1,4 +1,6 @@ import React from 'react'; +import queryString from 'query-string'; +import { withRouter } from 'react-router-dom'; import CommonLinks from '../panels/common_links.jsx'; import PagedLadder from '../panels/paged_ladder.jsx'; @@ -6,15 +8,21 @@ import PagedLadder from '../panels/paged_ladder.jsx'; class Ladder extends React.Component { constructor(props) { super(props); + + let params = queryString.parse(props.location.search); + this.state = { - start: 0, + params: params, + start: parseInt(params.rank) || 0, length: 50, fetch: null }; } - componentDidUpdate() { - this.state.fetch(); + componentDidUpdate(prevProps, prevState, snapshot) { + if (JSON.stringify(this.state) !== JSON.stringify(prevState)) { + this.state.fetch(); + } } render() { @@ -52,15 +60,20 @@ class Ladder extends React.Component { } increment() { - this.setState({ - start: this.state.start + this.state.length - }); + let start = this.state.start + this.state.length; + + this.props.history.push(`${this.props.location.pathname}?rank=${start}`); } decrement() { - this.setState({ - start: Math.max(0, this.state.start - this.state.length) - }); + let start = Math.max(0, this.state.start - this.state.length); + + //don't decrement too far + if (start === this.state.start) { + return; + } + + this.props.history.push(`${this.props.location.pathname}?rank=${start}`); } //bound callbacks @@ -70,9 +83,16 @@ class Ladder extends React.Component { onReceived(data) { if (data.length === 0) { - this.decrement(); + let start = Math.max(0, this.state.start - this.state.length); + + //don't decrement too far + if (start === this.state.start) { + return; + } + + this.props.history.replace(`${this.props.location.pathname}?rank=${start}`); } } } -export default Ladder; \ No newline at end of file +export default withRouter(Ladder); \ No newline at end of file diff --git a/src/components/panels/paged_ladder.jsx b/src/components/panels/paged_ladder.jsx index 76d8734..8a4dd25 100644 --- a/src/components/panels/paged_ladder.jsx +++ b/src/components/panels/paged_ladder.jsx @@ -12,8 +12,6 @@ class PagedLadder extends React.Component { if (props.getFetch) { props.getFetch(this.fetchLadder.bind(this)); } - - this.fetchLadder(); } render() {