99 lines
2.7 KiB
JavaScript
99 lines
2.7 KiB
JavaScript
// const { connect } = require('preact-redux');
|
|
const preact = require('preact');
|
|
const { connect } = require('preact-redux');
|
|
|
|
const { errorToast, infoToast } = require('../utils');
|
|
const actions = require('./../actions');
|
|
|
|
const VERSION = process.env.npm_package_version;
|
|
|
|
const Welcome = require('./welcome');
|
|
|
|
const addState = connect(
|
|
function receiveState(state) {
|
|
const {
|
|
ws,
|
|
account,
|
|
tutorial,
|
|
} = state;
|
|
|
|
function sendInstancePractice() {
|
|
ws.sendInstancePractice();
|
|
}
|
|
|
|
return {
|
|
promptRegister: tutorial === 99, // see events
|
|
account,
|
|
sendInstancePractice,
|
|
};
|
|
},
|
|
);
|
|
|
|
function Play(args) {
|
|
const {
|
|
account,
|
|
promptRegister,
|
|
sendInstancePractice,
|
|
} = args;
|
|
|
|
const news = (
|
|
<div class="list">
|
|
<div class="intro">
|
|
<p> MNML is a turn-based 1v1 strategy game in an abstract setting. </p>
|
|
<p>
|
|
Build a unique team of 3 constructs from a range of skills and specialisations.<br />
|
|
Outplay your opponent across multiple rounds by adapting to an always shifting meta. <br />
|
|
</p>
|
|
</div>
|
|
<div class="awards"></div>
|
|
</div>
|
|
);
|
|
|
|
const list = () => {
|
|
if (promptRegister) {
|
|
return (
|
|
<div class='block-text'>
|
|
<p><b>You just won your first round of MNML.</b></p>
|
|
<p>Register below to play a real Bo5 against other players,<br/> play a practice round against a tougher AI opponent,<br/> customise your team & more...</p>
|
|
<p>glhf</p>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
return (
|
|
<div class='list play'>
|
|
<figure>
|
|
<button
|
|
class="ready"
|
|
onClick={() => sendInstancePractice()}>
|
|
Play
|
|
</button>
|
|
<figcaption>Learn MNML</figcaption>
|
|
</figure>
|
|
<figure>
|
|
<button
|
|
class='discord-btn'
|
|
onClick={() => window.open('https://discord.gg/YJJgurM') }>
|
|
|
|
</button>
|
|
<figcaption>Join the Community</figcaption>
|
|
</figure>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
return (
|
|
<main>
|
|
<div class="logo"/>
|
|
<hr />
|
|
{list()}
|
|
<hr />
|
|
<Welcome />
|
|
<hr />
|
|
{news}
|
|
</main>
|
|
);
|
|
}
|
|
|
|
module.exports = addState(Play);
|