diff --git a/client/src/actions.jsx b/client/src/actions.jsx
index 0ea7db27..0c5db9ce 100644
--- a/client/src/actions.jsx
+++ b/client/src/actions.jsx
@@ -26,7 +26,7 @@ export const SET_ACTIVE_SKILL = 'SET_ACTIVE_SKILL';
export const setActiveSkill = (crypId, skill) => ({ type: SET_ACTIVE_SKILL, value: crypId ? { crypId, skill } : null });
export const SET_INFO = 'SET_INFO';
-export const setInfo = (type, info) => ({ type: SET_INFO, value: type ? { type, info } : null });
+export const setInfo = (item, cryp) => ({ type: SET_INFO, value: (item || cryp) ? { item, cryp } : null });
export const SET_RECLAIMING = 'SET_RECLAIMING';
export const setReclaiming = value => ({ type: SET_RECLAIMING, value });
diff --git a/client/src/components/info.component.jsx b/client/src/components/info.component.jsx
index 091ddc02..71ca942e 100644
--- a/client/src/components/info.component.jsx
+++ b/client/src/components/info.component.jsx
@@ -4,24 +4,49 @@ const { ITEMS: { SKILLS, SPECS, COLOURS } } = require('./constants');
function Info(args) {
const {
info,
+ sendUnequip,
} = args;
- let desc = null;
+ let itemDetails = null; let cryp = null;
+
if (info) {
- if (info.type === 'item') {
- if (SKILLS[info.info]) {
- desc = SKILLS[info.info];
- } else if (SPECS[info.info]) {
- desc = SPECS[info.info];
- } else if (COLOURS[info.info]) {
- desc = COLOURS[info.info];
+ if (info.item) {
+ if (SKILLS[info.item]) {
+ itemDetails = SKILLS[info.item];
+ } else if (SPECS[info.item]) {
+ itemDetails = SPECS[info.item];
+ } else if (COLOURS[info.item]) {
+ itemDetails = COLOURS[info.item];
}
}
+
+ if (info.cryp) {
+ ({ cryp } = info);
+ }
}
+ const crypHeader = cryp ?
{cryp.name}
: null;
+ const stats = cryp ? [
+ { stat: 'hp', disp: 'Hp', colour: '#1FF01F' },
+ { stat: 'red_shield', disp: 'Red Shield', colour: '#a52a2a' },
+ { stat: 'blue_shield', disp: 'Blue Shield', colour: '#3498db' },
+ { stat: 'red_damage', disp: 'Red Damage', colour: '#a52a2a' },
+ { stat: 'blue_damage', disp: 'Blue Damage', colour: '#3498db' },
+ { stat: 'green_damage', disp: 'Green Damage', colour: '#1FF01F' },
+ { stat: 'speed', disp: 'Speed', colour: '#FFD123' },
+ ].map((s, i) => (
+ {s.disp}: {cryp[s.stat].max}
+ )) : null;
+
+ const itemInfo = itemDetails ? {info.item} - {itemDetails.description}
: null;
+
+
+ const unequip = (itemDetails && cryp) ? : null;
return (
-
{JSON.stringify(info)}
-
{JSON.stringify(desc)}
+ {crypHeader}
+ {stats}
+ {itemInfo}
+ {unequip}
);
}
diff --git a/client/src/components/info.container.jsx b/client/src/components/info.container.jsx
index a45e921a..e98b7cc0 100644
--- a/client/src/components/info.container.jsx
+++ b/client/src/components/info.container.jsx
@@ -6,8 +6,12 @@ const Info = require('./info.component');
const addState = connect(
function receiveState(state) {
- const { info } = state;
- return { info };
+ const { info, ws, instance } = state;
+ function sendUnequip(crypId, item) {
+ return ws.sendVboxUnequip(instance.instance, crypId, item);
+ }
+
+ return { info, sendUnequip };
}
/*
function receiveDispatch(dispatch) {
diff --git a/client/src/components/instance.component.jsx b/client/src/components/instance.component.jsx
index cd272803..a997f2e9 100644
--- a/client/src/components/instance.component.jsx
+++ b/client/src/components/instance.component.jsx
@@ -13,7 +13,7 @@ function Cryp(cryp, sendVboxApply, setInfo) {
? cryp.skills[i].skill
: ( );
- return ;
+ return ;
});
// needed for ondrop to fire
@@ -52,7 +52,7 @@ function Cryp(cryp, sendVboxApply, setInfo) {
onDrop={onDrop}
>
-
+ setInfo(null, cryp)}>
{molecule}
{cryp.name}
diff --git a/client/src/components/instance.container.jsx b/client/src/components/instance.container.jsx
index 0554681d..4ae4e971 100644
--- a/client/src/components/instance.container.jsx
+++ b/client/src/components/instance.container.jsx
@@ -24,8 +24,8 @@ const addState = connect(
dispatch(actions.setInstance(null));
}
- function setInfo(type, info) {
- dispatch(actions.setInfo(type, info));
+ function setInfo(item, cryp) {
+ dispatch(actions.setInfo(item, cryp));
}
return { quit, setInfo };
diff --git a/client/src/components/vbox.component.jsx b/client/src/components/vbox.component.jsx
index 4c704646..14864406 100644
--- a/client/src/components/vbox.component.jsx
+++ b/client/src/components/vbox.component.jsx
@@ -56,7 +56,7 @@ function Vbox(args) {
onClick={() => {
if (c) {
sendVboxAccept(j, i);
- setInfo('item', c);
+ setInfo(c, null);
}
}} >
{convertVar(c)}
diff --git a/client/src/events.jsx b/client/src/events.jsx
index 5c5e0a99..cbc3a632 100644
--- a/client/src/events.jsx
+++ b/client/src/events.jsx
@@ -32,6 +32,11 @@ function registerEvents(store) {
store.dispatch(actions.setActiveSkill(skill));
}
+ function setInfo(info) {
+ store.dispatch(actions.setInfo(info));
+ console.log('event clear item');
+ }
+
function setMenu() {
console.log('EVENT ->', 'menu', true);
}
@@ -197,6 +202,7 @@ function registerEvents(store) {
setCryps,
setCrypList,
setGame,
+ setInfo,
setMenu,
setPlayer,
setInstanceList,
diff --git a/client/src/socket.jsx b/client/src/socket.jsx
index 01e666ef..9c2c6b27 100644
--- a/client/src/socket.jsx
+++ b/client/src/socket.jsx
@@ -95,6 +95,7 @@ function createSocket(events) {
function sendVboxUnequip(instanceId, crypId, target) {
send({ method: 'player_vbox_unequip', params: { instance_id: instanceId, cryp_id: crypId, target } });
+ events.setInfo(null);
}
function sendVboxDiscard(instanceId) {