This commit is contained in:
ntr
2018-10-26 12:01:23 +11:00
parent 89445a0b65
commit c5e07a26b5
18 changed files with 1554 additions and 106 deletions
+2 -2
View File
@@ -22,8 +22,8 @@ function CrypCard(cryp) {
<div className="has-text-centered">{cryp.hp.value} / {cryp.stam.value} HP </div>
<progress className="progress is-dark" value={cryp.hp.value} max={cryp.stam.value}></progress>
<div className="has-text-centered">{cryp.xp} / {Math.pow(2,cryp.lvl+1)} XP </div>
<progress className="progress is-dark" value={cryp.xp} max={Math.pow(2,cryp.lvl+1)}></progress>
<div className="has-text-centered">{cryp.xp} / {Math.pow(2, cryp.lvl + 1)} XP </div>
<progress className="progress is-dark" value={cryp.xp} max={Math.pow(2, cryp.lvl + 1)}></progress>
</div>
<button
+9 -9
View File
@@ -10,7 +10,7 @@ const CrypListContainer = require('./cryp.list.container');
const GameContainer = require('./game.container');
const addState = connect(
function receiveState(state) {
(state) => {
const { game, ws } = state;
if (!game) {
@@ -20,17 +20,17 @@ const addState = connect(
return { game };
},
function receiveDispatch(dispatch) {
(dispatch) => {
function setGame(game) {
dispatch(actions.setGame(game))
dispatch(actions.setGame(game));
}
return {setGame}
}
return { setGame };
},
);
function renderBody(props){
const {game, setGame} = props;
if (game){
function renderBody(props) {
const { game, setGame } = props;
if (game) {
return (
<div>
<GameContainer />
@@ -42,7 +42,7 @@ function renderBody(props){
Return to Main Menu
</button>
</div>
)
);
}
return (
<section className="columns">
+6 -3
View File
@@ -1,9 +1,12 @@
const preact = require('preact');
const { stringSort } = require('./../utils');
const nameSort = stringSort('name');
function CrypList({ cryps, activeItem, sendGamePve, sendGamePvp, sendItemUse }) {
function CrypList({
cryps, activeItem, sendGamePve, sendGamePvp, sendItemUse,
}) {
if (!cryps) return <div>not ready</div>;
const crypPanels = cryps.sort(nameSort).map(cryp => (
@@ -27,8 +30,8 @@ function CrypList({ cryps, activeItem, sendGamePve, sendGamePvp, sendItemUse })
<div className="has-text-centered">{cryp.hp.value} / {cryp.stam.value} HP </div>
<progress className="progress is-dark" value={cryp.hp.value} max={cryp.stam.value}></progress>
<div className="has-text-centered">{cryp.xp} / {Math.pow(2,cryp.lvl+1)} XP </div>
<progress className="progress is-dark" value={cryp.xp} max={Math.pow(2,cryp.lvl+1)}></progress>
<div className="has-text-centered">{cryp.xp} / {Math.pow(2, cryp.lvl + 1)} XP </div>
<progress className="progress is-dark" value={cryp.xp} max={Math.pow(2, cryp.lvl + 1)}></progress>
</div>
<button
+1 -1
View File
@@ -33,5 +33,5 @@ function renderCrypPanel(cryp) {
</div>
</div>
</div>
)
);
}
+1 -1
View File
@@ -27,4 +27,4 @@ function renderSpawnButton({ account, sendCrypSpawn }) {
);
}
module.exports = renderSpawnButton;
module.exports = renderSpawnButton;
+2 -2
View File
@@ -2,14 +2,14 @@ const preact = require('preact');
const { connect } = require('preact-redux');
const addState = connect(
function receiveState(state) {
(state) => {
const { ws, cryps } = state;
function sendGameJoin(gameId) {
return ws.sendGameJoin(gameId, [cryps[0].id]);
}
return { account: state.account, sendGameJoin };
}
},
);
function GameJoinButton({ account, sendGameJoin }) {
+23 -27
View File
@@ -12,7 +12,7 @@ function GamePanel(props) {
setActiveIncoming,
selectSkillTarget,
selectIncomingTarget,
account
account,
} = props;
if (!game) return <div>...</div>;
@@ -21,7 +21,7 @@ function GamePanel(props) {
const playerTeam = game.teams.find(t => t.id === account.id);
const incoming = playerTeam.incoming.map(inc => {
const incoming = playerTeam.incoming.map((inc) => {
key.unbind('1');
key('1', () => setActiveIncoming(inc.id));
return (
@@ -55,11 +55,9 @@ function GamePanel(props) {
);
});
const statuses = cryp.statuses.map((status, i) => {
return (
<div key={i}>{status} for {status.turns}T</div>
)
})
const statuses = cryp.statuses.map((status, i) => (
<div key={i}>{status} for {status.turns}T</div>
));
if (activeIncoming) console.log('should be a pointer');
return (
@@ -84,8 +82,8 @@ function GamePanel(props) {
<div className="has-text-centered">{cryp.hp.value} / {cryp.stam.value} HP </div>
<progress className="progress is-dark" value={cryp.hp.value} max={cryp.stam.value}></progress>
<div className="has-text-centered">{cryp.xp} / {Math.pow(2,cryp.lvl+1)} XP </div>
<progress className="progress is-dark" value={cryp.xp} max={Math.pow(2,cryp.lvl+1)}></progress>
<div className="has-text-centered">{cryp.xp} / {Math.pow(2, cryp.lvl + 1)} XP </div>
<progress className="progress is-dark" value={cryp.xp} max={Math.pow(2, cryp.lvl + 1)}></progress>
</div>
{statuses}
{skills}
@@ -100,15 +98,13 @@ function GamePanel(props) {
<div className="tile">
{cryps}
</div>
)
);
}
function OpponentCrypCard(cryp) {
const statuses = cryp.statuses.map((status, i) => {
return (
<div key={i}>{status.status} for {status.turns}T</div>
)
});
const statuses = cryp.statuses.map((status, i) => (
<div key={i}>{status.status} for {status.turns}T</div>
));
return (
<div key={cryp.id} className="tile is-vertical">
@@ -128,8 +124,8 @@ function GamePanel(props) {
<div className="has-text-centered">{cryp.hp.value} / {cryp.stam.value} HP </div>
<progress className="progress is-dark" value={cryp.hp.value} max={cryp.stam.value}></progress>
<div className="has-text-centered">{cryp.xp} / {Math.pow(2,cryp.lvl+1)} XP </div>
<progress className="progress is-dark" value={cryp.xp} max={Math.pow(2,cryp.lvl+1)}></progress>
<div className="has-text-centered">{cryp.xp} / {Math.pow(2, cryp.lvl + 1)} XP </div>
<progress className="progress is-dark" value={cryp.xp} max={Math.pow(2, cryp.lvl + 1)}></progress>
</div>
{statuses}
@@ -146,18 +142,18 @@ function GamePanel(props) {
onClick={() => selectSkillTarget(team.id)} >
{cryps}
</div>
)
);
}
// style={{ "min-height": "100%" }}
function phaseText(phase){
switch (phase){
case 'Skill':
return "Choose abilities"
case 'Target':
return "Block abilities"
case 'Finish':
return "Game over"
function phaseText(phase) {
switch (phase) {
case 'Skill':
return 'Choose abilities';
case 'Target':
return 'Block abilities';
case 'Finish':
return 'Game over';
}
}
return (
@@ -180,7 +176,7 @@ function GamePanel(props) {
<div className="title is-4">log</div>
</div>
</section>
)
);
}
module.exports = GamePanel;
+1 -1
View File
@@ -13,7 +13,7 @@ function renderHeader() {
</div>
</div>
</section>
)
);
}
module.exports = renderHeader;
+2 -2
View File
@@ -1,7 +1,7 @@
// eslint-disable-next-line
const preact = require('preact');
function renderLogin({ account, submitLogin, submitRegister}) {
function renderLogin({ account, submitLogin, submitRegister }) {
if (account) return <div>{JSON.stringify(account)}</div>;
const details = {
@@ -45,7 +45,7 @@ function renderLogin({ account, submitLogin, submitRegister}) {
<button
className="button inverted"
type="submit"
onClick={() => submitLogin("ntr", "grepgrepgrep")}>
onClick={() => submitLogin('ntr', 'grepgrepgrep')}>
Default
</button>
<button
+2 -2
View File
@@ -3,7 +3,7 @@ const { connect } = require('preact-redux');
const Login = require('./login.component');
const addState = connect(
function receiveState(state) {
(state) => {
const { ws } = state;
function submitLogin(name, password) {
return ws.sendAccountLogin(name, password);
@@ -12,7 +12,7 @@ const addState = connect(
return ws.sendAccountRegister(name, password);
}
return { account: state.account, submitLogin, submitRegister };
}
},
);
module.exports = addState(Login);