ntr/mnml
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Battles are back on the menu

Browse Source
This commit is contained in:
Mashy 2019-03-29 13:33:44 +10:00
parent e9817f75e0
commit 383330ddad
4 changed files with 33 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
html-client/src/components/game.container.js
View File

@ -8,9 +8,9 @@ const addState = connect(
function receiveState(state) {
const { ws, game, account, activeSkill, activeIncoming } = state;
function selectSkillTarget(targetTeamId) {
function selectSkillTarget(targetCrypId) {
if (activeSkill) {
return ws.sendGameSkill(game.id, activeSkill.crypId, targetTeamId, activeSkill.skill.skill);
return ws.sendGameSkill(game.id, activeSkill.crypId, targetCrypId, activeSkill.skill.skill);
}
return false;
}

37
html-client/src/components/game.jsx
View File

@ -103,24 +103,28 @@ function GamePanel(props) {
));
return (
<div key={cryp.id} className="tile is-vertical">
<div className="tile is-child">
<div className="columns" >
<div className="column is-10">
<p className="title">{cryp.name}</p>
</div>
<div className="column">
<figure className="image">
<svg width="40" height="40" data-jdenticon-value={cryp.name} />
</figure>
<div className="tile"
style={activeSkill ? { cursor: 'pointer' } : {}}
onClick={() => selectSkillTarget(cryp.id)} >
<div key={cryp.id} className="tile is-vertical">
<div className="tile is-child">
<div className="columns" >
<div className="column is-10">
<p className="title">{cryp.name}</p>
</div>
<div className="column">
<figure className="image">
<svg width="40" height="40" data-jdenticon-value={cryp.name} />
</figure>
</div>
</div>
<div className="has-text-centered">{cryp.hp.value} / {cryp.hp.value} HP </div>
<progress className="progress is-dark" value={cryp.hp.value} max={cryp.hp.max}></progress>
</div>
<div className="has-text-centered">{cryp.hp.value} / {cryp.hp.value} HP </div>
<progress className="progress is-dark" value={cryp.hp.value} max={cryp.hp.max}></progress>
{effects}
</div>
{effects}
</div>
);
}
@ -128,10 +132,7 @@ function GamePanel(props) {
function OpponentTeam(team) {
const cryps = team.cryps.map(OpponentCrypCard);
return (
<div
className="tile"
style={activeSkill ? { cursor: 'pointer' } : {}}
onClick={() => console.log(activeSkill)} >
<div>
{cryps}
</div>
);

1
html-client/src/main.jsx
View File

@ -17,6 +17,7 @@ const Body = require('./components/body.component');
const store = createStore(
combineReducers({
account: reducers.accountReducer,
activeSkill: reducers.activeSkillReducer,
combiner: reducers.combinerReducer,
game: reducers.gameReducer,
cryps: reducers.crypsReducer,

11
html-client/src/reducers.jsx
View File

@ -10,6 +10,16 @@ function accountReducer(state = defaultAccount, action) {
}
}
const defaultActiveSkill = null;
function activeSkillReducer(state = defaultActiveSkill, action) {
switch (action.type) {
case actions.SET_ACTIVE_SKILL:
return action.value;
default:
return state;
}
}
const defaultCryps = null;
function crypsReducer(state = defaultCryps, action) {
switch (action.type) {
@ -72,6 +82,7 @@ function wsReducer(state = defaultWs, action) {
module.exports = {
accountReducer,
activeSkillReducer,
combinerReducer,
crypsReducer,
gameReducer,