Created Task List

public/content/task_list.md

@@ -0,0 +1,20 @@
+Major
+---
+
+* Spies have no use right now.
+* Game instructions on the profile page.
+* Timers for count downs.
+
+Minor
+---
+
+* Attack button isn't being disabled with no soldiers.
+* Better combat log.
+* Game Ladder sorting.
+* Badges.
+
+Patch
+---
+
+* Game Balance.
+

public/styles/shared.css

@@ -272,6 +272,7 @@ footer {
 /* bits and pieces */
 .logoutButton {
 	align-self: stretch;
+	margin-bottom: .5rem;
 }
 
 .newsLine {

server/index.js

@@ -53,8 +53,9 @@ app.post('/equipmentpurchaserequest', equipment.purchaseRequest(connection));
 app.post('/equipmentsellrequest', equipment.sellRequest(connection));
 
 //static directories
-app.use('/styles', express.static(path.resolve(__dirname + '/../public/styles')) );
+app.use('/content', express.static(path.resolve(__dirname + '/../public/content')) );
 app.use('/img', express.static(path.resolve(__dirname + '/../public/img')) );
+app.use('/styles', express.static(path.resolve(__dirname + '/../public/styles')) );
 
 //the app file(s)
 app.get('/*app.bundle.js', (req, res) => {

src/components/app.jsx

@@ -71,6 +71,8 @@ export default class App extends React.Component {
 						<LazyRoute path='/combatlog' component={() => import('./pages/combat_log.jsx')} />
 						<LazyRoute path='/equipment' component={() => import('./pages/equipment.jsx')} />
 
+						<LazyRoute path='/tasklist' component={() => import('./pages/task_list.jsx')} />
+
 						<LazyRoute path='*' component={() => import('./pages/page_not_found.jsx')} />
 					</Switch>
 				</BrowserRouter>

src/components/pages/task_list.jsx

@@ -0,0 +1,68 @@
+import React from 'react';
+import ReactMarkdown from 'react-markdown/with-html';
+
+//panels
+import CommonLinks from '../panels/common_links.jsx';
+
+class TaskList extends React.Component {
+	constructor(props) {
+		super(props);
+		this.state = {
+			data: '',
+			warning: ''
+		};
+
+		this.sendRequest('/content/task_list.md');
+	}
+
+	render() {
+		let warningStyle = {
+			display: this.state.warning.length > 0 ? 'flex' : 'none'
+		};
+
+		return (
+			<div className='page'>
+				<div className='sidePanelPage'>
+					<div className='sidePanel'>
+						<CommonLinks />
+					</div>
+
+					<div className='mainPanel'>
+						<div className='warning' style={warningStyle}>
+							<p>{this.state.warning}</p>
+						</div>
+
+						<h1 className='centered'>Kingdom Battles Developer Task List</h1>
+						{this.state ? <ReactMarkdown source={this.state.data} escapeHtml={false} /> : <p>Loading task list...</p>}
+					</div>
+				</div>
+			</div>
+		);
+	}
+
+	sendRequest(url, args = {}) {
+		//build the XHR
+		let xhr = new XMLHttpRequest();
+		xhr.open('GET', url, true);
+
+		xhr.onreadystatechange = () => {
+			if (xhr.readyState === 4) {
+				if (xhr.status === 200) {
+					//on success
+					this.setState({ data: xhr.responseText });
+				}
+				else {
+					this.setWarning(xhr.responseText);
+				}
+			}
+		};
+
+		xhr.send();
+	}
+
+	setWarning(s) {
+		this.setState({ warning: s });
+	}
+};
+
+export default TaskList;

src/components/panels/common_links.jsx

@@ -34,6 +34,7 @@ class CommonLinks extends React.Component {
 					<p><Link to='/ladder' onClick={this.props.onClickLadder}>Game Ladder</Link></p>
 					<p><Link to='/combatlog' onClick={this.props.onClickCombatLog}>Combat Log</Link></p>
 					<p><Link to='/passwordchange' onClick={this.props.onClickPasswordChange}>Change Password</Link></p>
+					<p><Link to='/tasklist' onClick={this.props.onClickTaskList}>Task List</Link></p>
 
 					<Extra />
 
@@ -48,6 +49,7 @@ class CommonLinks extends React.Component {
 					<p><Link to='/login' onClick={this.props.onClickLogin}>Login</Link></p>
 					<p><Link to='/passwordrecover' onClick={this.props.onClickPasswordRecover}>Recover Password</Link></p>
 					<p><Link to='/ladder' onClick={this.props.onClickLadder}>Game Ladder</Link></p>
+					<p><Link to='/tasklist' onClick={this.props.onClickTaskList}>Task List</Link></p>
 
 					<Extra />
 				</div>
@@ -65,7 +67,8 @@ CommonLinks.propTypes = {
 	onClickHome: PropTypes.func,
 	onClickProfile: PropTypes.func,
 	onClickLadder: PropTypes.func,
-	onClickPasswordChange: PropTypes.func
+	onClickPasswordChange: PropTypes.func,
+	onClickTaskList: PropTypes.func
 };
 
 function mapStoreToProps(store) {