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

client var -> item

Browse Source
This commit is contained in:
ntr 2019-05-20 12:31:37 +10:00
parent ad702c8901
commit 331844f904
12 changed files with 54 additions and 54 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
client/src/actions.jsx
View File

@ -53,7 +53,7 @@ export const SET_ACTIVE_CRYP = 'SET_ACTIVE_CRYP';
export const setActiveCryp = value => ({ type: SET_ACTIVE_CRYP, value }); export const setActiveCryp = value => ({ type: SET_ACTIVE_CRYP, value });
export const SET_ACTIVE_VAR = 'SET_ACTIVE_VAR'; export const SET_ACTIVE_VAR = 'SET_ACTIVE_VAR';
export const setActiveVar = value => ({ type: SET_ACTIVE_VAR, value }); export const setActiveItem = value => ({ type: SET_ACTIVE_VAR, value });
export const SET_INFO = 'SET_INFO'; export const SET_INFO = 'SET_INFO';
export const setInfo = value => ({ type: SET_INFO, value }); export const setInfo = value => ({ type: SET_INFO, value });

16
client/src/components/info.component.jsx
View File

@ -2,7 +2,7 @@ const preact = require('preact');
const range = require('lodash/range'); const range = require('lodash/range');
const { ITEMS: { SKILLS, COLOURS, SPECS: SPEC_CONSTANT } } = require('./../constants'); const { ITEMS: { SKILLS, COLOURS, SPECS: SPEC_CONSTANT } } = require('./../constants');
const { COLOUR_ICONS, STATS, SPECS, convertVar, crypAvatar } = require('../utils'); const { COLOUR_ICONS, STATS, SPECS, convertItem, crypAvatar } = require('../utils');
const shapes = require('./shapes'); const shapes = require('./shapes');
const InfoCryp = require('./info.cryp'); const InfoCryp = require('./info.cryp');
@ -19,7 +19,7 @@ function Info(args) {
vboxHidden, vboxHidden,
} = args; } = args;
function CrypVar() { function CrypItem() {
if (!info) return false; if (!info) return false;
const [type, value] = info; const [type, value] = info;
if (!type) return false; if (!type) return false;
@ -48,7 +48,7 @@ function Info(args) {
return console.warn('UNHANLDED VAR', value); return console.warn('UNHANLDED VAR', value);
} }
return ( return (
<div className="info-var"> <div className="info-item">
{value} - {itemDetails.description} {value} - {itemDetails.description}
</div> </div>
); );
@ -175,8 +175,8 @@ function Info(args) {
<tbody> <tbody>
{filteredCombos.map((c, i) => {filteredCombos.map((c, i) =>
<tr key={i} > <tr key={i} >
<td className="highlight" >{convertVar(c.var)}</td> <td className="highlight" >{convertItem(c.item)}</td>
{c.units.map((u, j) => <td key={j}>{convertVar(u)}</td>)} {c.units.map((u, j) => <td key={j}>{convertItem(u)}</td>)}
</tr> </tr>
)} )}
</tbody> </tbody>
@ -190,8 +190,8 @@ function Info(args) {
<tbody> <tbody>
{vboxCombos.map((c, i) => {vboxCombos.map((c, i) =>
<tr key={i} > <tr key={i} >
<td className="highlight" >{convertVar(c.var)}</td> <td className="highlight" >{convertItem(c.item)}</td>
{c.units.map((u, j) => <td key={j} >{convertVar(u)}</td>)} {c.units.map((u, j) => <td key={j} >{convertItem(u)}</td>)}
</tr> </tr>
)} )}
</tbody> </tbody>
@ -207,7 +207,7 @@ function Info(args) {
return ( return (
<div className={classes} > <div className={classes} >
<CrypVar /> <CrypItem />
<Combos /> <Combos />
</div> </div>
); );

4
client/src/components/info.cryp.jsx
View File

@ -52,8 +52,8 @@ function InfoCryp(args) {
if (!cryp) return false; if (!cryp) return false;
function setHighlight(type) { function setHighlight(type) {
if (type === 'skill') return setVboxHighlight(vboxInfo.vars.filter(v => v.skill).map(v => v.v)); if (type === 'skill') return setVboxHighlight(vboxInfo.items.filter(v => v.skill).map(v => v.v));
if (type === 'spec') return setVboxHighlight(vboxInfo.vars.filter(v => v.spec).map(v => v.v)); if (type === 'spec') return setVboxHighlight(vboxInfo.items.filter(v => v.spec).map(v => v.v));
return false; return false;
} }

4
client/src/components/instance.container.jsx
View File

@ -6,7 +6,7 @@ const Instance = require('./instance.component');
const addState = connect( const addState = connect(
function receiveState(state) { function receiveState(state) {
const { ws, instance, player, account, activeVar, vboxHidden } = state; const { ws, instance, player, account, activeItem, vboxHidden } = state;
function sendInstanceReady() { function sendInstanceReady() {
return ws.sendInstanceReady(instance.id); return ws.sendInstanceReady(instance.id);
@ -16,7 +16,7 @@ const addState = connect(
return ws.sendVboxApply(instance.id, crypId, i); return ws.sendVboxApply(instance.id, crypId, i);
} }
return { instance, player, account, sendInstanceReady, sendVboxApply, activeVar, vboxHidden }; return { instance, player, account, sendInstanceReady, sendVboxApply, activeItem, vboxHidden };
}, },
function receiveDispatch(dispatch) { function receiveDispatch(dispatch) {

28
client/src/components/instance.cryps.jsx
View File

@ -8,7 +8,7 @@ const actions = require('../actions');
const addState = connect( const addState = connect(
function receiveState(state) { function receiveState(state) {
const { ws, instance, player, account, vboxHidden, vboxInfo, activeVar, activeCryp } = state; const { ws, instance, player, account, vboxHidden, vboxInfo, activeItem, activeCryp } = state;
function sendInstanceReady() { function sendInstanceReady() {
return ws.sendInstanceReady(instance.id); return ws.sendInstanceReady(instance.id);
@ -18,7 +18,7 @@ const addState = connect(
return ws.sendVboxApply(instance.id, crypId, i); return ws.sendVboxApply(instance.id, crypId, i);
} }
return { instance, player, account, sendInstanceReady, sendVboxApply, vboxHidden, vboxInfo, activeVar, activeCryp }; return { instance, player, account, sendInstanceReady, sendVboxApply, vboxHidden, vboxInfo, activeItem, activeCryp };
}, },
function receiveDispatch(dispatch) { function receiveDispatch(dispatch) {
@ -50,7 +50,7 @@ const addState = connect(
function Cryp(props) { function Cryp(props) {
const { const {
activeCryp, activeCryp,
activeVar, activeItem,
cryp, cryp,
player, player,
sendVboxApply, sendVboxApply,
@ -61,21 +61,21 @@ function Cryp(props) {
} = props; } = props;
function setHighlight(type) { function setHighlight(type) {
if (type === 'skill') return setVboxHighlight(vboxInfo.vars.filter(v => v.skill).map(v => v.v)); if (type === 'skill') return setVboxHighlight(vboxInfo.items.filter(v => v.skill).map(v => v.v));
if (type === 'spec') return setVboxHighlight(vboxInfo.vars.filter(v => v.spec).map(v => v.v)); if (type === 'spec') return setVboxHighlight(vboxInfo.items.filter(v => v.spec).map(v => v.v));
return false; return false;
} }
function onClick(e) { function onClick(e) {
e.stopPropagation(); e.stopPropagation();
e.preventDefault(); e.preventDefault();
if (activeVar !== null) sendVboxApply(cryp.id, activeVar); if (activeItem !== null) sendVboxApply(cryp.id, activeItem);
return setActiveCryp(cryp); return setActiveCryp(cryp);
} }
const { vbox } = player; const { vbox } = player;
const skillList = vboxInfo.vars.filter(v => v.skill).map(v => v.v); const skillList = vboxInfo.items.filter(v => v.skill).map(v => v.v);
const specList = vboxInfo.vars.filter(v => v.spec).map(v => v.v); const specList = vboxInfo.items.filter(v => v.spec).map(v => v.v);
const skills = range(0, 3).map(i => { const skills = range(0, 3).map(i => {
const skill = cryp.skills[i]; const skill = cryp.skills[i];
@ -84,7 +84,7 @@ function Cryp(props) {
: (<span className="gray">+</span>); : (<span className="gray">+</span>);
function skillClick(e) { function skillClick(e) {
if (!skill && activeVar !== null) return sendVboxApply(cryp.id, activeVar); if (!skill && activeItem !== null) return sendVboxApply(cryp.id, activeItem);
if (!skill) setHighlight('skill'); if (!skill) setHighlight('skill');
else setInfo('skill', { skill: skill.skill, cryp }); else setInfo('skill', { skill: skill.skill, cryp });
e.stopPropagation(); e.stopPropagation();
@ -92,7 +92,7 @@ function Cryp(props) {
} }
const action = skill ? '' : 'action'; const action = skill ? '' : 'action';
const equip = skillList.includes(vbox.bound[activeVar]) && !skill ? 'equip' : ''; const equip = skillList.includes(vbox.bound[activeItem]) && !skill ? 'equip' : '';
const classes = `right ${action} ${equip}`; const classes = `right ${action} ${equip}`;
return ( return (
<button key={i} className={classes} onClick={skillClick} >{s}</button> <button key={i} className={classes} onClick={skillClick} >{s}</button>
@ -104,13 +104,13 @@ function Cryp(props) {
function blankSpecClick(e) { function blankSpecClick(e) {
e.stopPropagation(); e.stopPropagation();
if (activeVar !== null) return sendVboxApply(cryp.id, activeVar); if (activeItem !== null) return sendVboxApply(cryp.id, activeItem);
setHighlight('spec'); setHighlight('spec');
return setActiveCryp(cryp); return setActiveCryp(cryp);
} }
if (!s) { if (!s) {
const equip = specList.includes(vbox.bound[activeVar]) ? 'equip-spec' : 'gray'; const equip = specList.includes(vbox.bound[activeItem]) ? 'equip-spec' : 'gray';
return ( return (
<figure key={i} onClick={blankSpecClick} className={equip} > <figure key={i} onClick={blankSpecClick} className={equip} >
{shapes.diamond(`stat-icon ${equip}`)} {shapes.diamond(`stat-icon ${equip}`)}
@ -185,7 +185,7 @@ function Cryp(props) {
function InstanceCryps(props) { function InstanceCryps(props) {
const { const {
activeCryp, activeCryp,
activeVar, activeItem,
player, player,
instance, instance,
// clearInfo, // clearInfo,
@ -202,7 +202,7 @@ function InstanceCryps(props) {
if (instance.phase === 'Lobby') return false; if (instance.phase === 'Lobby') return false;
const cryps = player.cryps.map((c, i) => Cryp({ const cryps = player.cryps.map((c, i) => Cryp({
activeCryp, activeVar, cryp: c, player, sendVboxApply, setInfo, setActiveCryp, vboxInfo, setVboxHighlight, activeCryp, activeItem, cryp: c, player, sendVboxApply, setInfo, setActiveCryp, vboxInfo, setVboxHighlight,
})); }));
const classes = `cryp-list ${vboxHidden ? '' : 'hidden'}`; const classes = `cryp-list ${vboxHidden ? '' : 'hidden'}`;

20
client/src/components/instance.equip.jsx
View File

@ -3,7 +3,7 @@ const preact = require('preact');
const range = require('lodash/range'); const range = require('lodash/range');
const actions = require('../actions'); const actions = require('../actions');
const { convertVar, SPECS } = require('./../utils'); const { convertItem, SPECS } = require('./../utils');
const addState = connect( const addState = connect(
function receiveState(state) { function receiveState(state) {
@ -25,11 +25,11 @@ const addState = connect(
return dispatch(actions.setInfo([])); return dispatch(actions.setInfo([]));
} }
function setActiveVar(v) { function setActiveItem(v) {
return dispatch(actions.setActiveVar(v)); return dispatch(actions.setActiveItem(v));
} }
return { setInfo, setActiveVar, clearInfo }; return { setInfo, setActiveItem, clearInfo };
} }
); );
@ -41,7 +41,7 @@ function Equipment(props) {
vboxInfo, vboxInfo,
sendUnequip, sendUnequip,
setInfo, setInfo,
setActiveVar, setActiveItem,
} = props; } = props;
const { vbox } = player; const { vbox } = player;
@ -51,7 +51,7 @@ function Equipment(props) {
function boundClick(e, i) { function boundClick(e, i) {
const value = vbox.bound[i]; const value = vbox.bound[i];
setInfo('item', value); setInfo('item', value);
setActiveVar(i); setActiveItem(i);
return false; return false;
} }
@ -70,12 +70,12 @@ function Equipment(props) {
const specClass = infoType === 'spec' ? 'specs highlight' : 'specs'; const specClass = infoType === 'spec' ? 'specs highlight' : 'specs';
// const classes = `right ${skill ? '' : 'action'}`; // const classes = `right ${skill ? '' : 'action'}`;
const skillList = vboxInfo.vars.filter(v => v.skill).map(v => v.v); const skillList = vboxInfo.items.filter(v => v.skill).map(v => v.v);
const specList = vboxInfo.vars.filter(v => v.spec).map(v => v.v); const specList = vboxInfo.items.filter(v => v.spec).map(v => v.v);
const skills = range(0, 9).map(i => { const skills = range(0, 9).map(i => {
const item = convertVar(vbox.bound[i]); const item = convertItem(vbox.bound[i]);
if (skillList.includes(item)) { if (skillList.includes(item)) {
return ( return (
<button key={i} className={''} onClick={e => boundClick(e, i)}> <button key={i} className={''} onClick={e => boundClick(e, i)}>
@ -86,7 +86,7 @@ function Equipment(props) {
}); });
const specs = range(0, 9).map(i => { const specs = range(0, 9).map(i => {
const item = convertVar(vbox.bound[i]); const item = convertItem(vbox.bound[i]);
if (specList.includes(item)) { if (specList.includes(item)) {
return ( return (
<figure key={i} onClick={e => boundClick(e, i)}> <figure key={i} onClick={e => boundClick(e, i)}>

14
client/src/components/vbox.component.jsx
View File

@ -3,7 +3,7 @@ const range = require('lodash/range');
const shapes = require('./shapes'); const shapes = require('./shapes');
const { convertVar } = require('./../utils'); const { convertItem } = require('./../utils');
function Vbox(args) { function Vbox(args) {
const { const {
@ -42,7 +42,7 @@ function Vbox(args) {
const filteredCombos = vboxInfo.combos const filteredCombos = vboxInfo.combos
.filter(combo => combinerValues.every(u => combo.units.includes(u))); .filter(combo => combinerValues.every(u => combo.units.includes(u)));
const comboValues = vboxInfo.vars.filter(v => { const comboValues = vboxInfo.items.filter(v => {
if (!filteredCombos.some(c => c.units.includes(v.v))) return false; if (!filteredCombos.some(c => c.units.includes(v.v))) return false;
if (!['Red', 'Green', 'Blue'].includes(v.v) && combinerValues.includes(v.v)) return false; if (!['Red', 'Green', 'Blue'].includes(v.v) && combinerValues.includes(v.v)) return false;
return true; return true;
@ -104,7 +104,7 @@ function Vbox(args) {
onClick={freeClick} onClick={freeClick}
onDblClick={() => sendVboxAccept(j, i) } onDblClick={() => sendVboxAccept(j, i) }
> >
{convertVar(c)} {convertItem(c)}
</td>; </td>;
}); });
@ -154,7 +154,7 @@ function Vbox(args) {
key={i} key={i}
className={`${highlighted ? 'highlight' : ''}`} className={`${highlighted ? 'highlight' : ''}`}
onClick={e => boundClick(e, i, highlighted) }> onClick={e => boundClick(e, i, highlighted) }>
{convertVar(value)} {convertItem(value)}
</td> </td>
); );
}); });
@ -189,13 +189,13 @@ function Vbox(args) {
<tbody> <tbody>
<tr> <tr>
<td onClick={() => combinerRmv(0)}> <td onClick={() => combinerRmv(0)}>
{combiner[0] !== null ? convertVar(vbox.bound[combiner[0]]) : shapes.vboxColour('gray')} {combiner[0] !== null ? convertItem(vbox.bound[combiner[0]]) : shapes.vboxColour('gray')}
</td> </td>
<td onClick={() => combinerRmv(1)}> <td onClick={() => combinerRmv(1)}>
{combiner[1] !== null ? convertVar(vbox.bound[combiner[1]]) : shapes.vboxColour('gray')} {combiner[1] !== null ? convertItem(vbox.bound[combiner[1]]) : shapes.vboxColour('gray')}
</td> </td>
<td onClick={() => combinerRmv(2)}> <td onClick={() => combinerRmv(2)}>
{convertVar(vbox.bound[combiner[2]])} {convertItem(vbox.bound[combiner[2]])}
</td> </td>
</tr> </tr>
</tbody> </tbody>

4
client/src/components/vbox.container.jsx
View File

@ -12,7 +12,7 @@ const addState = connect(
player, player,
combiner, combiner,
reclaiming, reclaiming,
activeVar, activeItem,
activeCryp, activeCryp,
info, info,
vboxHidden, vboxHidden,
@ -45,7 +45,7 @@ const addState = connect(
player, player,
combiner, combiner,
reclaiming, reclaiming,
activeVar, activeItem,
activeCryp, activeCryp,
info, info,
vboxInfo, vboxInfo,

6
client/src/events.jsx
View File

@ -112,8 +112,8 @@ function registerEvents(store) {
store.dispatch(actions.setActiveSkill(skill)); store.dispatch(actions.setActiveSkill(skill));
} }
function setActiveVar(v) { function setActiveItem(v) {
store.dispatch(actions.setActiveVar(v)); store.dispatch(actions.setActiveItem(v));
} }
function clearInfo(info) { function clearInfo(info) {
@ -206,7 +206,7 @@ function registerEvents(store) {
clearCombiner, clearCombiner,
setAccount, setAccount,
setActiveSkill, setActiveSkill,
setActiveVar, setActiveItem,
setCryps, setCryps,
setCrypList, setCrypList,
setGame, setGame,

4
client/src/reducers.jsx
View File

@ -16,7 +16,7 @@ module.exports = {
account: createReducer(null, actions.SET_ACCOUNT), account: createReducer(null, actions.SET_ACCOUNT),
activeCryp: createReducer(null, actions.SET_ACTIVE_CRYP), activeCryp: createReducer(null, actions.SET_ACTIVE_CRYP),
activeSkill: createReducer(null, actions.SET_ACTIVE_SKILL), activeSkill: createReducer(null, actions.SET_ACTIVE_SKILL),
activeVar: createReducer(null, actions.SET_ACTIVE_VAR), activeItem: createReducer(null, actions.SET_ACTIVE_VAR),
combiner: createReducer([null, null, null], actions.SET_COMBINER), combiner: createReducer([null, null, null], actions.SET_COMBINER),
cryps: createReducer([], actions.SET_CRYPS), cryps: createReducer([], actions.SET_CRYPS),
game: createReducer(null, actions.SET_GAME), game: createReducer(null, actions.SET_GAME),
@ -33,6 +33,6 @@ module.exports = {
showLog: createReducer(false, actions.SET_SHOW_LOG), showLog: createReducer(false, actions.SET_SHOW_LOG),
vboxHidden: createReducer(false, actions.SET_VBOX_HIDDEN), vboxHidden: createReducer(false, actions.SET_VBOX_HIDDEN),
vboxHighlight: createReducer([], actions.SET_VBOX_HIGHLIGHT), vboxHighlight: createReducer([], actions.SET_VBOX_HIGHLIGHT),
vboxInfo: createReducer({ combos: [], vars: [] }, actions.SET_VBOX_INFO), vboxInfo: createReducer({ combos: [], items: [] }, actions.SET_VBOX_INFO),
ws: createReducer(null, actions.SET_WS), ws: createReducer(null, actions.SET_WS),
}; };

2
client/src/socket.jsx
View File

@ -93,7 +93,7 @@ function createSocket(events) {
function sendVboxApply(instanceId, crypId, index) { function sendVboxApply(instanceId, crypId, index) {
send({ method: 'player_vbox_apply', params: { instance_id: instanceId, cryp_id: crypId, index } }); send({ method: 'player_vbox_apply', params: { instance_id: instanceId, cryp_id: crypId, index } });
events.setActiveVar(null); events.setActiveItem(null);
} }
function sendVboxUnequip(instanceId, crypId, target) { function sendVboxUnequip(instanceId, crypId, target) {

4
client/src/utils.jsx
View File

@ -374,7 +374,7 @@ function getCombatText(cryp, resolution) {
return ''; return '';
} }
function convertVar(v) { function convertItem(v) {
if (['Red', 'Green', 'Blue'].includes(v)) { if (['Red', 'Green', 'Blue'].includes(v)) {
return ( return (
shapes.vboxColour(v.toLowerCase()) shapes.vboxColour(v.toLowerCase())
@ -390,7 +390,7 @@ function convertVar(v) {
module.exports = { module.exports = {
stringSort, stringSort,
convertVar, convertItem,
numSort, numSort,
genAvatar, genAvatar,
crypAvatar, crypAvatar,