mnml/client/src/components/play.ctrl.jsx
2019-09-13 14:52:16 +10:00

85 lines
2.1 KiB
JavaScript

const preact = require('preact');
const { connect } = require('preact-redux');
const addState = connect(
function receiveState(state) {
const {
ws,
instances,
} = state;
function sendInstanceState(id) {
ws.sendInstanceState(id);
}
function sendInstancePractice() {
ws.sendInstancePractice();
}
function sendInstanceQueue() {
ws.sendInstanceQueue();
}
return {
instances,
sendInstanceState,
sendInstanceQueue,
sendInstancePractice,
};
}
);
function JoinButtons(args) {
const {
instances,
sendInstanceState,
sendInstanceQueue,
sendInstancePractice,
} = args;
if (instances.length) {
return (
<aside class='play-ctrl'>
<div class="timer-container"></div>
<div class="controls">
<button
class='pvp ready full'
onClick={() => sendInstanceState(instances[0].id)}
type="submit">
Rejoin
</button>
</div>
</aside>
);
}
return (
<aside class='play-ctrl'>
<div class="timer-container"></div>
<div class="controls">
<button
class='pvp ready'
onClick={() => sendInstanceQueue()}
type="submit">
PVP
</button>
<button
class='practice ready'
onClick={() => sendInstancePractice()}
type="submit">
Learn
</button>
<button
class='discord-btn'
onClick={() => document.location.assign('https://discord.gg/YJJgurM')}>
&nbsp;
</button>
</div>
</aside>
);
}
module.exports = addState(JoinButtons);