@@ -96,7 +96,7 @@ function Demo(args) {
- {items.map((i, j) => inventoryBtn(i, j))}
+ {items.map((i, j) => stashBtn(i, j))}
{combinerBtn()}
@@ -106,7 +106,7 @@ function Demo(args) {
return (
- {inventoryElement()}
+ {stashElement()}
);
};
diff --git a/client/src/components/header.jsx b/client/src/components/header.jsx
index b591afe0..734b1761 100644
--- a/client/src/components/header.jsx
+++ b/client/src/components/header.jsx
@@ -32,11 +32,9 @@ const addState = connect(
function setNav(place) {
dispatch(actions.setGame(null));
dispatch(actions.setInstance(null));
- dispatch(actions.setReclaiming(false));
dispatch(actions.setActiveSkill(null));
dispatch(actions.setInfo(null));
dispatch(actions.setItemUnequip([]));
- dispatch(actions.setVboxHighlight([]));
dispatch(actions.setMtxActive(null));
return dispatch(actions.setNav(place));
}
diff --git a/client/src/components/info.component.jsx b/client/src/components/info.component.jsx
deleted file mode 100644
index 71360599..00000000
--- a/client/src/components/info.component.jsx
+++ /dev/null
@@ -1,184 +0,0 @@
-const preact = require('preact');
-const reactStringReplace = require('react-string-replace');
-
-const specThresholds = require('./info.thresholds');
-const { INFO } = require('./../constants');
-const { convertItem, removeTier } = require('../utils');
-const { tutorialStage } = require('../tutorial.utils');
-const shapes = require('./shapes');
-
-
-class InfoComponent extends preact.Component {
- shouldComponentUpdate(newProps, newState) {
- if (newProps.tutorial !== this.props.tutorial) return true;
- // We don't care about info during tutorial
- if (newProps.tutorial && this.props.instance.time_control === 'Practice'
- && this.props.instance.rounds.length === 1) return false;
- if (newProps.info !== this.props.info) return true;
- if (newState.comboItem !== this.state.comboItem) return true;
-
- return false;
- }
-
- componentDidUpdate(prevProps) {
- // Catch case where mouse events don't properly clear state and info changed
- if (prevProps.info !== this.props.info && this.state.comboItem) this.setState({ comboItem: null });
- }
-
- render(args) {
- const {
- // Variables that will change
- info,
- tutorial,
-
- // Static
- player, // Only used for colour calcs which will be update if info changes
- ws,
- itemInfo,
- instance, // Only used for instance id
- // functions
- setInfo,
- setTutorialNull,
- } = args;
- const { comboItem } = this.state;
- function Info() {
- if (tutorial) {
- const tutorialStageInfo = tutorialStage(tutorial, ws, setTutorialNull, instance);
- if (tutorialStageInfo) return tutorialStageInfo;
- }
- if (!info) return false;
- if (info.includes('constructName')) {
- return (
-
-
{info.replace('constructName ', '')}
-
This is the name of your construct. RESHAPE tab outside of games.
-
-
- );
- }
-
- if (info.includes('constructAvatar')) {
- return (
-
-
{info.replace('constructAvatar ', '')}
-
This is your construct avatar. RESHAPE tab outside of games.
-
-
- );
- }
- const fullInfo = comboItem
- ? itemInfo.items.find(i => i.item === comboItem) || INFO[comboItem]
- : itemInfo.items.find(i => i.item === info) || INFO[info];
- if (!fullInfo) return false;
- const isSkill = fullInfo.skill;
- const isSpec = fullInfo.spec;
-
- const itemDescription = () => {
- const regEx = /(RedPower|BluePower|GreenPower|RedLife|BlueLife|GreenLife|SpeedStat|LIFE|SPEED|POWER)/;
- const infoDescription = reactStringReplace(fullInfo.description, regEx, m => shapes[m]());
- return
{reactStringReplace(infoDescription, '\n', () =>
;
- };
-
- if (isSkill || isSpec) {
- let infoName = fullInfo.item;
- while (infoName.includes('Plus')) infoName = infoName.replace('Plus', '+');
-
- const itemSource = itemInfo.combos.filter(c => c.item === removeTier(fullInfo.item));
-
- let itemSourceInfo = itemSource.length && !isSpec
- ? `${itemSource[0].components[0]} ${itemSource[0].components[1]} ${itemSource[0].components[2]}`
- : false;
-
- let header = null;
- if (!itemSource.length) header = isSkill ?
SKILL :
SPEC ;
- if (itemSourceInfo) {
- while (itemSourceInfo.includes('Plus')) itemSourceInfo = itemSourceInfo.replace('Plus', '+');
- const itemRegEx = /(Red|Blue|Green)/;
- itemSourceInfo = reactStringReplace(itemSourceInfo, itemRegEx, match => shapes[match]());
- }
-
- const cooldown = isSkill && fullInfo.cooldown ?
{fullInfo.cooldown} Turn delay
: null;
-
- const speed = isSkill
- ?
Speed {shapes.SpeedStat()} multiplier {fullInfo.speed * 4}%
- : null;
-
- const thresholds = isSpec ? specThresholds(player, fullInfo, info) : null;
-
- return (
-
-
{infoName} {fullInfo.cost}b
- {header}
- {itemSourceInfo}
- {cooldown}
- {itemDescription()}
- {speed}
- {thresholds}
-
- );
- }
- const cost = fullInfo.cost ? `- ${fullInfo.cost}b` : false;
- return (
-
-
{fullInfo.item} {cost}
- {itemDescription()}
-
- );
- }
-
- const Combos = () => {
- if (tutorial && instance.time_control === 'Practice' && instance.rounds.length === 1) return false;
- const generalNotes = (
-
-
General
-
- You can preview combos by clicking the combined item when it appears in this section. READY button to start the GAME PHASE .
-
-
- );
- if (!player) return generalNotes;
- if (!info) return generalNotes;
-
- const vboxCombos = itemInfo.combos.filter(c => c.components.includes(info));
- if (vboxCombos.length > 6 || vboxCombos.length === 0) return generalNotes;
-
- const comboTable = vboxCombos.map((c, i) => {
- const mouseOver = e => {
- e.stopPropagation();
- this.setState({ comboItem: c.item });
- };
- const componentTable = (c.components.some(ci => ['Red', 'Blue', 'Green'].includes(ci)))
- ? [
{convertItem(c.components[0])} {convertItem(c.components[1])}
,
-
{convertItem(c.components[2])}
]
- : c.components.map((u, j) =>
{convertItem(u)}
);
- return (
-
- );
- });
- return (
-
- {comboTable}
-
- );
- };
-
- return (
-
this.setState({ comboItem: null })}>
-
- );
- }
-}
-
-module.exports = InfoComponent;
diff --git a/client/src/components/info.container.jsx b/client/src/components/info.container.jsx
deleted file mode 100644
index 8a8dbb6f..00000000
--- a/client/src/components/info.container.jsx
+++ /dev/null
@@ -1,43 +0,0 @@
-const { connect } = require('preact-redux');
-
-const actions = require('../actions');
-const Info = require('./info.component');
-
-const addState = connect(
- function receiveState(state) {
- const {
- ws,
- info,
- itemInfo,
- instance,
- player,
- account,
- tutorial,
- } = state;
-
- return {
- ws,
- info,
- itemInfo,
- instance,
- player,
- account,
- tutorial,
- };
- },
-
- function receiveDispatch(dispatch) {
- function setTutorialNull() {
- dispatch(actions.setTutorial(null));
- }
-
- function setInfo(info) {
- dispatch(actions.setInfo(info));
- }
- return { setTutorialNull, setInfo };
- }
-
-
-);
-
-module.exports = addState(Info);
diff --git a/client/src/components/instance.component.jsx b/client/src/components/instance.component.jsx
index 8b6c2377..c59b5833 100644
--- a/client/src/components/instance.component.jsx
+++ b/client/src/components/instance.component.jsx
@@ -2,7 +2,6 @@ const preact = require('preact');
const { connect } = require('preact-redux');
const Vbox = require('./vbox.component');
-const InfoContainer = require('./info.container');
const InstanceConstructsContainer = require('./instance.constructs');
const Faceoff = require('./faceoff');
@@ -27,10 +26,8 @@ const addState = connect(
function clearItems() {
- dispatch(actions.setReclaiming(false));
dispatch(actions.setItemUnequip([]));
- dispatch(actions.setVboxHighlight([]));
- dispatch(actions.setVboxSelected({ shopSelect: [], stashSelect: [] }));
+ dispatch(actions.setVboxSelected({ storeSelect: [], stashSelect: [] }));
return true;
}
@@ -58,14 +55,9 @@ function Instance(args) {
clearItems();
}
- function onTouchMove(e) {
- e.preventDefault();
- }
-
return (
);
diff --git a/client/src/components/instance.constructs.jsx b/client/src/components/instance.constructs.jsx
index 59e77b10..c0a0b36d 100644
--- a/client/src/components/instance.constructs.jsx
+++ b/client/src/components/instance.constructs.jsx
@@ -25,7 +25,7 @@ const addState = connect(
} = state;
function sendVboxAcceptEquip(constructId) {
- return ws.sendVboxAcceptEquip(instance.id, vboxSelected.shopSelect[0][0], vboxSelected.shopSelect[0][1], constructId);
+ return ws.sendVboxAcceptEquip(instance.id, vboxSelected.storeSelect[0][0], vboxSelected.storeSelect[0][1], constructId);
}
function sendVboxApply(constructId, i) {
@@ -60,7 +60,7 @@ const addState = connect(
}
function setItemUnequip(v) {
- dispatch(actions.setVboxSelected({ shopSelect: [], stashSelect: [] }));
+ dispatch(actions.setVboxSelected({ storeSelect: [], stashSelect: [] }));
return dispatch(actions.setItemUnequip(v));
}
@@ -91,7 +91,7 @@ function Construct(props) {
const { vbox } = player;
- const itemEquip = vboxSelected.shopSelect.length === 0 && vboxSelected.stashSelect.length === 1
+ const itemEquip = vboxSelected.storeSelect.length === 0 && vboxSelected.stashSelect.length === 1
? vboxSelected.stashSelect[0]
: -1;
@@ -106,7 +106,7 @@ function Construct(props) {
e.preventDefault();
if (duplicateSkill || tutorialDisableEquip) return true;
if (itemEquip !== -1) return sendVboxApply(construct.id, itemEquip);
- if (vboxSelected.shopSelect.length === 1) return sendVboxAcceptEquip(construct.id);
+ if (vboxSelected.storeSelect.length === 1) return sendVboxAcceptEquip(construct.id);
if (itemUnequip.length && itemUnequip[0] !== construct.id) return sendVboxUnequipApply(construct.id);
setItemUnequip([]);
return true;
@@ -114,7 +114,7 @@ function Construct(props) {
function hoverInfo(e, info) {
e.stopPropagation();
if (!info) return false;
- if (vboxSelected.shopSelect.length || vboxSelected.stashSelect.length) return false;
+ if (vboxSelected.storeSelect.length || vboxSelected.stashSelect.length) return false;
return setInfo(info);
}
@@ -129,8 +129,10 @@ function Construct(props) {
function skillClick(e) {
if (!skill) return false;
- setItemUnequip([construct.id, skill.skill, i]);
e.stopPropagation();
+ if (itemUnequip.length && itemUnequip[0] === construct.id && skill.skill === itemUnequip[1]
+ && i === itemUnequip[2]) return setItemUnequip([]);
+ setItemUnequip([construct.id, skill.skill, i]);
return true;
}
@@ -177,8 +179,11 @@ function Construct(props) {
}
function specClick(e) {
+ if (!s) return false;
e.stopPropagation();
- setItemUnequip([construct.id, s, i]);
+ if (itemUnequip.length && itemUnequip[0] === construct.id && itemUnequip[1] === s
+ && i === itemUnequip[2]) return setItemUnequip([]);
+ return setItemUnequip([construct.id, s, i]);
}
const highlight = itemUnequip[0] === construct.id && itemUnequip[1] === s && i === itemUnequip[2];
@@ -258,7 +263,6 @@ class InstanceConstructs extends preact.Component {
sendVboxApply,
sendVboxAcceptEquip,
sendVboxUnequipApply,
- setVboxHighlight,
setItemUnequip,
} = props;
@@ -281,7 +285,6 @@ class InstanceConstructs extends preact.Component {
sendVboxUnequipApply,
setInfo,
itemInfo,
- setVboxHighlight,
vboxSelected,
tutorial,
});
diff --git a/client/src/components/instance.ctrl.top.btns.jsx b/client/src/components/instance.ctrl.top.btns.jsx
index 108485f7..7fc4f018 100644
--- a/client/src/components/instance.ctrl.top.btns.jsx
+++ b/client/src/components/instance.ctrl.top.btns.jsx
@@ -26,6 +26,9 @@ const addState = connect(
dispatch(actions.setNav('play'));
dispatch(actions.setGame(null));
dispatch(actions.setInstance(null));
+ dispatch(actions.setVboxSelected({ storeSelect: [], stashSelect: [] }));
+ dispatch(actions.setInfo(null));
+ dispatch(actions.setItemUnequip([]));
if (tutorial) dispatch(actions.setTutorial(1));
}
diff --git a/client/src/components/mnml.jsx b/client/src/components/mnml.jsx
index 7a5e94e0..d1a632ce 100644
--- a/client/src/components/mnml.jsx
+++ b/client/src/components/mnml.jsx
@@ -15,7 +15,7 @@ function Mnml(args) {
instance,
} = args;
- const rotateClass = (game || instance) && window.innerWidth < window.innerHeight
+ const rotateClass = (game || instance) && window.innerHeight < 900 && window.innerWidth < window.innerHeight
? 'show'
: '';
diff --git a/client/src/components/nav.jsx b/client/src/components/nav.jsx
index 0c845c8f..505c41c3 100644
--- a/client/src/components/nav.jsx
+++ b/client/src/components/nav.jsx
@@ -33,11 +33,9 @@ const addState = connect(
function setNav(place) {
dispatch(actions.setGame(null));
dispatch(actions.setInstance(null));
- dispatch(actions.setReclaiming(false));
dispatch(actions.setActiveSkill(null));
dispatch(actions.setInfo(null));
dispatch(actions.setItemUnequip([]));
- dispatch(actions.setVboxHighlight([]));
return dispatch(actions.setNav(place));
}
diff --git a/client/src/components/skill.btn.jsx b/client/src/components/skill.btn.jsx
index 6f96e410..d7be22be 100644
--- a/client/src/components/skill.btn.jsx
+++ b/client/src/components/skill.btn.jsx
@@ -69,7 +69,7 @@ function Skill(props) {
// return false;
// }
const cdText = construct.skills[i].cd > 0
- ? `- ${s.cd}T`
+ ? `${s.cd}T`
: '';
const highlight = activeSkill
@@ -91,7 +91,7 @@ function Skill(props) {
onMouseOut={e => hoverInfo(e, null)}
type="submit"
onClick={onClick}>
-
{s.skill} {cdText}
+
{s.skill}
);
}
diff --git a/client/src/components/targeting.arrows.jsx b/client/src/components/targeting.arrows.jsx
index f93966c5..a7a7e4b3 100644
--- a/client/src/components/targeting.arrows.jsx
+++ b/client/src/components/targeting.arrows.jsx
@@ -110,8 +110,11 @@ class TargetSvg extends Component {
? playerTeam.constructs.findIndex(c => c.id === cast.target_construct_id)
: otherTeam.constructs.findIndex(c => c.id === cast.target_construct_id);
+ const skillNumber = window.innerWidth <= 800 // mobile styling trigger
+ ? playerTeam.constructs[source].skills.findIndex(s => s.skill === cast.skill)
+ : 0;
const sourceY = height;
- const sourceX = (source * width / 3) + width / 24;
+ const sourceX = (source * width / 3) + width / 18 + skillNumber * (width / 9);
const targetX = (target * width / 3) + width / 6
+ (defensive ? width / 64 : 0)
+ (source * width / 18);
diff --git a/client/src/components/vbox.combiner.jsx b/client/src/components/vbox.combiner.jsx
new file mode 100644
index 00000000..93051a33
--- /dev/null
+++ b/client/src/components/vbox.combiner.jsx
@@ -0,0 +1,104 @@
+const preact = require('preact');
+const { connect } = require('preact-redux');
+const countBy = require('lodash/countBy');
+
+const addState = connect(
+ function receiveState(state) {
+ const {
+ ws,
+ itemInfo,
+ instance,
+ player,
+ vboxSelected,
+ } = state;
+
+ function sendVboxAccept(group, index) {
+ document.activeElement.blur();
+ return ws.sendVboxAccept(instance.id, group, index);
+ }
+
+ function sendVboxCombine() {
+ return ws.sendVboxCombine(instance.id, vboxSelected.stashSelect, vboxSelected.storeSelect);
+ }
+
+ return {
+ itemInfo,
+ player,
+ vboxSelected,
+ sendVboxAccept,
+ sendVboxCombine,
+ };
+ }
+);
+
+function Combiner(args) {
+ const {
+ // Variables that will change
+ vboxHighlight,
+ vboxSelected,
+ // Static
+ player,
+ itemInfo,
+ // functions
+ sendVboxAccept,
+ sendVboxCombine,
+ } = args;
+
+ const { vbox } = player;
+ const { stashSelect, storeSelect } = vboxSelected;
+
+ const vboxCombo = () => {
+ if (!(vboxHighlight && vboxHighlight.length === 0)) return false;
+ // The selected items can't be combined with additional items therefore valid combo
+ const stashItems = stashSelect.map(j => vbox.bound[j]);
+ const shopItems = storeSelect.map(j => vbox.free[j[0]][j[1]]);
+ const selectedItems = stashItems.concat(shopItems);
+ const combinerCount = countBy(selectedItems, co => co);
+
+ const comboItemObj = itemInfo.combos.find(combo => selectedItems.every(c => {
+ if (!combo.components.includes(c)) return false;
+ const comboCount = countBy(combo.components, co => co);
+ if (combinerCount[c] > comboCount[c]) return false;
+ return true;
+ }));
+ return comboItemObj.item;
+ };
+
+ const combinerCombo = vboxCombo();
+
+ function vboxBuySelected() {
+ if (!(storeSelect.length === 1 && stashSelect.length === 0)) return false;
+ document.activeElement.blur();
+ sendVboxAccept(storeSelect[0][0], storeSelect[0][1]);
+ return true;
+ }
+ let text = '';
+ let mouseEvent = false;
+ if (combinerCombo) {
+ const combinerComboText = combinerCombo.replace('Plus', '+');
+ let bits = 0;
+ storeSelect.forEach(item => bits += item[0] + 1);
+ text = bits
+ ? `Buy ${combinerComboText} ${bits}b`
+ : `Combine ${combinerComboText}`;
+ if (vbox.bits >= bits) mouseEvent = sendVboxCombine;
+ } else if (stashSelect.length === 0 && storeSelect.length === 1) {
+ const item = storeSelect[0];
+ text = `Buy ${vbox.free[item[0]][item[1]]} ${item[0] + 1}b`;
+ mouseEvent = vboxBuySelected;
+ } else {
+ return false;
+ }
+
+ return (
+
e.stopPropagation()}
+ onMouseDown={() => mouseEvent()}>
+ {text}
+
+ );
+}
+
+module.exports = addState(Combiner);
diff --git a/client/src/components/vbox.combos.jsx b/client/src/components/vbox.combos.jsx
new file mode 100644
index 00000000..410252d0
--- /dev/null
+++ b/client/src/components/vbox.combos.jsx
@@ -0,0 +1,141 @@
+const preact = require('preact');
+const { connect } = require('preact-redux');
+const reactStringReplace = require('react-string-replace');
+const countBy = require('lodash/countBy');
+
+const { convertItem, removeTier } = require('../utils');
+const shapes = require('./shapes');
+
+const actions = require('../actions');
+
+const addState = connect(
+ function receiveState(state) {
+ const {
+ ws,
+ info,
+ itemInfo,
+ itemUnequip,
+ instance,
+ player,
+ account,
+ tutorial,
+ vboxSelected,
+ } = state;
+
+ function sendVboxAccept(group, index) {
+ document.activeElement.blur();
+ return ws.sendVboxAccept(instance.id, group, index);
+ }
+
+ function sendVboxCombine() {
+ return ws.sendVboxCombine(instance.id, vboxSelected.stashSelect, vboxSelected.storeSelect);
+ }
+
+ return {
+ ws,
+ info,
+ itemInfo,
+ itemUnequip,
+ instance,
+ player,
+ account,
+ tutorial,
+ vboxSelected,
+ sendVboxAccept,
+ sendVboxCombine,
+ };
+ }
+);
+
+function Combos(args) {
+ const {
+ // Variables that will change
+ info,
+ itemUnequip,
+ tutorial,
+ vboxHighlight,
+ vboxSelected,
+ // Static
+ player, // Only used for colour calcs which will be update if info changes
+ ws,
+ itemInfo,
+ instance, // Only used for instance id
+ // functions
+ sendVboxAccept,
+ sendVboxCombine,
+ setTutorialNull,
+ } = args;
+ const { comboItem } = this.state;
+
+ const { vbox } = player;
+ const { stashSelect, storeSelect } = vboxSelected;
+
+ const vboxCombo = () => {
+ if (!(vboxHighlight && vboxHighlight.length === 0)) return false;
+ // The selected items can't be combined with additional items therefore valid combo
+ const stashItems = stashSelect.map(j => vbox.bound[j]);
+ const shopItems = storeSelect.map(j => vbox.free[j[0]][j[1]]);
+ const selectedItems = stashItems.concat(shopItems);
+ const combinerCount = countBy(selectedItems, co => co);
+
+ const comboItemObj = itemInfo.combos.find(combo => selectedItems.every(c => {
+ if (!combo.components.includes(c)) return false;
+ const comboCount = countBy(combo.components, co => co);
+ if (combinerCount[c] > comboCount[c]) return false;
+ return true;
+ }));
+ return comboItemObj.item;
+ };
+
+ const combinerCombo = vboxCombo();
+ const checkVboxInfo = () => {
+ if (combinerCombo) return combinerCombo;
+ const stashBase = stashSelect.find(i => !(['Red', 'Blue', 'Green'].includes(vbox.bound[i])));
+ if (stashBase > -1) return vbox.bound[stashBase];
+ const storeBase = storeSelect.find(j => !(['Red', 'Blue', 'Green'].includes(vbox.free[j[0]][j[1]])));
+ if (storeBase) return vbox.free[storeBase[0]][storeBase[1]];
+ if (stashSelect.length > 0) return vbox.bound[stashSelect[0]];
+ if (storeSelect.length > 0) return vbox.free[storeSelect[0][0]][storeSelect[0][1]];
+ return false;
+ };
+ let vboxInfo = false;
+ if (itemUnequip.length) [, vboxInfo] = itemUnequip;
+ else if (stashSelect.length > 0 || storeSelect.length > 0) vboxInfo = checkVboxInfo();
+
+ if (tutorial && instance.time_control === 'Practice' && instance.rounds.length === 1) return false;
+ if (!info && !vboxInfo) return false;
+ const comboInfo = vboxInfo || info;
+ const vboxCombos = itemInfo.combos.filter(c => c.components.includes(comboInfo));
+ if (vboxCombos.length > 6 || vboxCombos.length === 0) return false;
+
+ const comboTable = vboxCombos.map((c, i) => {
+ const mouseOver = e => {
+ e.stopPropagation();
+ this.setState({ comboItem: c.item });
+ };
+ const componentTable = (c.components.some(ci => ['Red', 'Blue', 'Green'].includes(ci)))
+ ? [
{convertItem(c.components[0])} {convertItem(c.components[1])}
,
+
{convertItem(c.components[2])}
]
+ : c.components.map((u, j) =>
{convertItem(u)}
);
+ return (
+
+ );
+ });
+ const comboList = comboTable.length > 0 ?
{comboTable}
: false;
+ return (
+
+
+ {comboList}
+
+ );
+}
+
+module.exports = addState(Combos);
diff --git a/client/src/components/vbox.component.jsx b/client/src/components/vbox.component.jsx
index a0329268..2f808f08 100644
--- a/client/src/components/vbox.component.jsx
+++ b/client/src/components/vbox.component.jsx
@@ -1,14 +1,15 @@
const preact = require('preact');
const { connect } = require('preact-redux');
-const range = require('lodash/range');
const countBy = require('lodash/countBy');
-const without = require('lodash/without');
const forEach = require('lodash/forEach');
-const { removeTier } = require('../utils');
-const shapes = require('./shapes');
const actions = require('../actions');
-const buttons = require('./buttons');
+
+const InfoContainer = require('./vbox.info');
+const StashElement = require('./vbox.stash');
+const StoreElement = require('./vbox.store');
+const Combiner = require('./vbox.combiner');
+const Combos = require('./vbox.combos');
const addState = connect(
function receiveState(state) {
@@ -16,8 +17,8 @@ const addState = connect(
ws,
instance,
player,
- reclaiming,
vboxSelected,
+ info,
itemInfo,
itemUnequip,
tutorial,
@@ -32,10 +33,6 @@ const addState = connect(
return ws.sendVboxAccept(instance.id, group, index);
}
- function sendVboxCombine() {
- return ws.sendVboxCombine(instance.id, vboxSelected.stashSelect, vboxSelected.shopSelect);
- }
-
function sendVboxReclaim(i) {
return ws.sendVboxReclaim(instance.id, i);
}
@@ -46,10 +43,9 @@ const addState = connect(
return {
instance,
+ info,
player,
- reclaiming,
sendVboxAccept,
- sendVboxCombine,
sendVboxDiscard,
sendVboxReclaim,
vboxSelected,
@@ -61,12 +57,6 @@ const addState = connect(
},
function receiveDispatch(dispatch) {
- function setReclaiming(v) {
- dispatch(actions.setItemUnequip([]));
- dispatch(actions.setVboxSelected({ shopSelect: [], stashSelect: [] }));
- return dispatch(actions.setReclaiming(v));
- }
-
function setInfo(item) {
return dispatch(actions.setInfo(item));
}
@@ -78,20 +68,19 @@ const addState = connect(
}
return {
- setReclaiming,
setInfo,
setVboxSelected,
};
}
);
-function validVboxSelect(vbox, itemInfo, shopSelect, stashSelect) {
- if (shopSelect.length === 0 && stashSelect.length === 0) return false;
+function validVboxSelect(vbox, itemInfo, storeSelect, stashSelect) {
+ if (storeSelect.length === 0 && stashSelect.length === 0) return false;
const validSelects = [];
const stashItems = stashSelect.map(j => vbox.bound[j]);
- const shopItems = shopSelect.map(j => vbox.free[j[0]][j[1]]);
+ const shopItems = storeSelect.map(j => vbox.free[j[0]][j[1]]);
const selectedItems = stashItems.concat(shopItems);
const itemCount = countBy(selectedItems, co => co);
@@ -119,7 +108,6 @@ class Vbox extends preact.Component {
shouldComponentUpdate(newProps) {
// Single variable props
if (newProps.itemUnequip !== this.props.itemUnequip) return true;
- if (newProps.reclaiming !== this.props.reclaiming) return true;
if (newProps.tutorial !== this.props.tutorial) return true;
if (newProps.vboxSelected !== this.props.vboxSelected) return true;
if (newProps.player !== this.props.player) return true;
@@ -132,7 +120,6 @@ class Vbox extends preact.Component {
// Changing state variables
itemUnequip,
player,
- reclaiming,
tutorial,
vboxSelected,
instance,
@@ -142,299 +129,141 @@ class Vbox extends preact.Component {
// Function Calls
sendItemUnequip,
sendVboxAccept,
- sendVboxCombine,
sendVboxDiscard,
sendVboxReclaim,
setVboxSelected,
setInfo,
- setReclaiming,
} = args;
if (!player) return false;
const { vbox } = player;
- const { shopSelect, stashSelect } = vboxSelected;
- const vboxSelecting = shopSelect.length === 1 && stashSelect.length === 0;
+ const { storeSelect, stashSelect } = vboxSelected;
+ const vboxSelecting = storeSelect.length === 1 && stashSelect.length === 0;
function combinerChange(newStashSelect) {
- return setVboxSelected({ shopSelect, stashSelect: newStashSelect });
+ return setVboxSelected({ storeSelect, stashSelect: newStashSelect });
}
- const vboxHighlight = validVboxSelect(vbox, itemInfo, shopSelect, stashSelect);
+ const vboxHighlight = validVboxSelect(vbox, itemInfo, storeSelect, stashSelect);
//
// VBOX
//
function vboxHover(e, v) {
if (v) {
e.stopPropagation();
- if (shopSelect.find(c => c[0])) return true; // There is a base skill or spec selected in the vbox
- if (stashSelect.length !== 0) {
- const base = stashSelect.find(c => !['Red', 'Blue', 'Green'].includes(vbox.bound[c]));
- if (base || base === 0) return true;
- }
+ if (stashSelect.length !== 0 || storeSelect.length !== 0) return true;
setInfo(v);
}
return true;
}
function clearVboxSelected() {
- setVboxSelected({ shopSelect: [], stashSelect: [] });
+ setVboxSelected({ storeSelect: [], stashSelect: [] });
}
function vboxBuySelected() {
if (!vboxSelecting) return false;
document.activeElement.blur();
- sendVboxAccept(shopSelect[0][0], shopSelect[0][1]);
+ sendVboxAccept(storeSelect[0][0], storeSelect[0][1]);
return true;
}
- function availableBtn(v, group, index) {
- if (!v) return
;
- const selected = shopSelect.length && shopSelect.some(vs => vs[0] === group && vs[1] === index);
-
- const comboHighlight = vboxHighlight && vboxHighlight.includes(v) ? 'combo-border' : '';
-
- function onClick(e) {
- e.stopPropagation();
- if (!comboHighlight) setInfo(vbox.free[group][index]);
- if (shopSelect.length && shopSelect.some(vs => vs[0] === group && vs[1] === index)) {
- return setVboxSelected({ shopSelect: shopSelect.filter(vs => !(vs[0] === group && vs[1] === index)), stashSelect });
- }
-
- if (!shopSelect.length && !stashSelect.length) return setVboxSelected({ shopSelect: [[group, index]], stashSelect });
- if (comboHighlight !== 'combo-border') {
- return setVboxSelected({ shopSelect: [[group, index]], stashSelect: [] });
- }
- return setVboxSelected({ shopSelect: [...shopSelect, [group, index]], stashSelect });
- }
-
-
- const classes = `${v.toLowerCase()} ${selected ? 'highlight' : ''} ${comboHighlight}`;
-
- const vboxObject = shapes[v] ? shapes[v]() : v;
- const disabled = vbox.bits <= group;
+ function storeHdr() {
return (
-
ev.dataTransfer.setData('text', '')}
- key={group * 10 + index}
- onDragEnd={clearVboxSelected}>
- vboxHover(e, v)}
- onMouseDown={onClick}
- onClick={e => e.stopPropagation()}
- > {vboxObject}
-
-
- );
- }
-
-
- function vboxElement() {
- return (
-
e.stopPropagation()}>
-
-
e.target.scrollIntoView(true)}
- onMouseOver={e => hoverInfo(e, 'vbox')}> VBOX
-
-
hoverInfo(e, 'bits')} >{vbox.bits}b
-
-
- {range(0, 6).map(i => availableBtn(vbox.free[0][i], 0, i))}
-
-
- {range(0, 3).map(i => availableBtn(vbox.free[1][i], 1, i))}
- {range(0, 3).map(i => availableBtn(vbox.free[2][i], 2, i))}
-
+
+
e.target.scrollIntoView(true)}
+ onMouseOver={e => vboxHover(e, 'store')}> STORE
+
+ vboxHover(e, 'bits')}>
+ {vbox.bits}b
+
hoverInfo(e, 'refill')}
+ onMouseOver={e => vboxHover(e, 'refill')}
disabled={vbox.bits < 2
- || (tutorial && tutorial < 7 && instance.time_control === 'Practice' && instance.rounds.length === 1)
+ || (tutorial && tutorial < 7
+ && instance.time_control === 'Practice' && instance.rounds.length === 1)
}
onClick={e => e.stopPropagation()}
onMouseDown={() => sendVboxDiscard()}>
- refill - 2b
+ refill
);
}
- //
- // INVENTORY
- //
- function reclaimClick(e) {
- e.stopPropagation();
- return setReclaiming(!reclaiming);
- }
-
- function inventoryBtn(v, i) {
- const inventoryHighlight = vboxSelecting || itemUnequip.length;
-
- if (!v && v !== 0) {
- const emptyInvClick = () => {
- if (vboxSelecting) return vboxBuySelected();
- return false;
- };
- return
;
- }
-
- const comboHighlight = vboxHighlight && vboxHighlight.includes(v) ? 'combo-border' : '';
-
- function onClick(type) {
- if (reclaiming) return sendVboxReclaim(i);
-
- const combinerContainsIndex = stashSelect.indexOf(i) > -1;
- // removing
- if (combinerContainsIndex) {
- if (type === 'click') {
- return combinerChange(without(stashSelect, i));
- }
- return true;
- }
-
- if (!comboHighlight) {
- setInfo(vbox.bound[i]);
- return setVboxSelected({ shopSelect: [], stashSelect: [i] });
- }
-
- stashSelect.push(i);
- // if (stashSelect.length === 3) setInfo(comboItem.item);
- return combinerChange(stashSelect);
- }
-
- const highlighted = stashSelect.indexOf(i) > -1;
- const border = buttons[removeTier(v)] ? buttons[removeTier(v)]() : '';
- const classes = `${highlighted ? 'highlight' : border} ${comboHighlight}`;
-
- const invObject = shapes[v] ? shapes[v]() : v;
-
- return (
-
{
- onClick('drag');
- ev.dataTransfer.setData('text', '');
- }}>
- vboxHover(e, v)}
- onClick={e => e.stopPropagation()}
- onMouseDown={() => onClick('click')}>
- {invObject}
-
-
- );
- }
-
- function combinerBtn() {
- let text = '';
- let mouseEvent = false;
- const combineLength = stashSelect.length + shopSelect.length;
- if (vboxHighlight && vboxHighlight.length === 0) {
- // The selected items can't be combined with additional items therefore valid combo
- const stashItems = stashSelect.map(j => vbox.bound[j]);
- const shopItems = shopSelect.map(j => vbox.free[j[0]][j[1]]);
- const selectedItems = stashItems.concat(shopItems);
- const combinerCount = countBy(selectedItems, co => co);
-
- const comboItemObj = itemInfo.combos.find(combo => selectedItems.every(c => {
- if (!combo.components.includes(c)) return false;
- const comboCount = countBy(combo.components, co => co);
- if (combinerCount[c] > comboCount[c]) return false;
- return true;
- }));
- let comboItem = comboItemObj ? comboItemObj.item : 'refine';
- setInfo(comboItem);
- comboItem = comboItem.replace('Plus', '+');
- let bits = 0;
- shopSelect.forEach(item => bits += item[0] + 1);
- text = bits
- ? `Buy ${comboItem} - ${bits}b`
- : `Combine - ${comboItem}`;
- if (vbox.bits >= bits) mouseEvent = sendVboxCombine;
- } else if (stashSelect.length === 0 && shopSelect.length === 1) {
- const item = shopSelect[0];
- text = `Buy ${vbox.free[item[0]][item[1]]} ${item[0] + 1}b`;
- mouseEvent = vboxBuySelected;
- } else {
- for (let i = 0; i < 3; i++) {
- if (combineLength > i) {
- text += '■ ';
- } else {
- text += '▫ ';
- }
- }
- }
- return (
+ function stashHdr() {
+ const refund = storeSelect.length === 0 && stashSelect.length === 1
+ ? itemInfo.items.find(i => i.item === vbox.bound[stashSelect[0]]).cost
+ : 0;
+ const tutorialDisabled = tutorial && tutorial < 8
+ && instance.time_control === 'Practice' && instance.rounds.length === 1;
+ const refundBtn = (
e.stopPropagation()}
- onMouseDown={() => mouseEvent()}>
- {text}
+ onMouseDown={e => {
+ e.stopPropagation();
+ sendVboxReclaim(vboxSelected.stashSelect[0]);
+ }}>
+ refund
);
- }
-
- function inventoryElement() {
- function inventoryClick(e) {
- e.stopPropagation();
- if (itemUnequip.length) return sendItemUnequip(itemUnequip);
- return true;
- }
return (
-
e.stopPropagation()}
- onDragOver={ev => ev.preventDefault()}
- onDrop={inventoryClick}
- >
-
-
e.target.scrollIntoView(true)}
- onMouseOver={e => hoverInfo(e, 'inventory')}> INVENTORY
-
- hoverInfo(e, 'reclaim')}
- onClick={e => e.stopPropagation()}
- onMouseDown={reclaimClick}>
- reclaim
-
-
-
-
- {range(0, 9).map(i => inventoryBtn(vbox.bound[i], i))}
-
- {combinerBtn()}
+
+
e.target.scrollIntoView(true)}
+ onMouseOver={e => vboxHover(e, 'stash')}> STASH
+
+ {refundBtn}
);
}
- //
// EVERYTHING
- //
- function hoverInfo(e, newInfo) {
- if (shopSelect.find(c => c[0])) return true;
- if (stashSelect.length !== 0) {
- const base = stashSelect.find(c => !['Red', 'Blue', 'Green'].includes(vbox.bound[c]));
- if (base || base === 0) return true;
- }
- return setInfo(newInfo);
- }
-
- const classes = 'vbox';
return (
-
- {vboxElement()}
-
⮞
- {inventoryElement()}
+
+ {storeHdr()}
+ {stashHdr()}
+
);
}
diff --git a/client/src/components/vbox.info.jsx b/client/src/components/vbox.info.jsx
new file mode 100644
index 00000000..452f268d
--- /dev/null
+++ b/client/src/components/vbox.info.jsx
@@ -0,0 +1,195 @@
+const preact = require('preact');
+const { connect } = require('preact-redux');
+const reactStringReplace = require('react-string-replace');
+const countBy = require('lodash/countBy');
+
+const specThresholds = require('./vbox.info.thresholds');
+const { INFO } = require('./../constants');
+const { convertItem, removeTier } = require('../utils');
+const { tutorialStage } = require('../tutorial.utils');
+const shapes = require('./shapes');
+
+const actions = require('../actions');
+
+const addState = connect(
+ function receiveState(state) {
+ const {
+ ws,
+ info,
+ itemInfo,
+ itemUnequip,
+ instance,
+ player,
+ account,
+ tutorial,
+ vboxSelected,
+ } = state;
+
+ return {
+ ws,
+ info,
+ itemInfo,
+ itemUnequip,
+ instance,
+ player,
+ account,
+ tutorial,
+ vboxSelected,
+ };
+ },
+
+ function receiveDispatch(dispatch) {
+ function setTutorialNull() {
+ dispatch(actions.setTutorial(null));
+ }
+
+ function setInfo(info) {
+ dispatch(actions.setInfo(info));
+ }
+ return { setTutorialNull, setInfo };
+ }
+);
+
+function Info(args) {
+ const {
+ // Variables that will change
+ info,
+ itemUnequip,
+ tutorial,
+ vboxHighlight,
+ vboxSelected,
+ // Static
+ player, // Only used for colour calcs which will be update if info changes
+ ws,
+ itemInfo,
+ instance, // Only used for instance id
+ // functions
+ setTutorialNull,
+ } = args;
+ const { comboItem } = this.state;
+
+ const { vbox } = player;
+ const { stashSelect, storeSelect } = vboxSelected;
+
+ const vboxCombo = () => {
+ if (!(vboxHighlight && vboxHighlight.length === 0)) return false;
+ // The selected items can't be combined with additional items therefore valid combo
+ const stashItems = stashSelect.map(j => vbox.bound[j]);
+ const shopItems = storeSelect.map(j => vbox.free[j[0]][j[1]]);
+ const selectedItems = stashItems.concat(shopItems);
+ const combinerCount = countBy(selectedItems, co => co);
+
+ const comboItemObj = itemInfo.combos.find(combo => selectedItems.every(c => {
+ if (!combo.components.includes(c)) return false;
+ const comboCount = countBy(combo.components, co => co);
+ if (combinerCount[c] > comboCount[c]) return false;
+ return true;
+ }));
+ return comboItemObj.item;
+ };
+
+ const combinerCombo = vboxCombo();
+ const checkVboxInfo = () => {
+ if (combinerCombo) return combinerCombo;
+ const stashBase = stashSelect.find(i => !(['Red', 'Blue', 'Green'].includes(vbox.bound[i])));
+ if (stashBase > -1) return vbox.bound[stashBase];
+ const storeBase = storeSelect.find(j => !(['Red', 'Blue', 'Green'].includes(vbox.free[j[0]][j[1]])));
+ if (storeBase) return vbox.free[storeBase[0]][storeBase[1]];
+ if (stashSelect.length > 0) return vbox.bound[stashSelect[0]];
+ if (storeSelect.length > 0) return vbox.free[storeSelect[0][0]][storeSelect[0][1]];
+ return false;
+ };
+ let vboxInfo = false;
+ if (itemUnequip.length) [, vboxInfo] = itemUnequip;
+ else if (stashSelect.length > 0 || storeSelect.length > 0) vboxInfo = checkVboxInfo();
+
+ if (tutorial) {
+ const tutorialStageInfo = tutorialStage(tutorial, ws, setTutorialNull, instance);
+ if (tutorialStageInfo) return tutorialStageInfo;
+ }
+
+ function genItemInfo(item) {
+ const fullInfo = itemInfo.items.find(i => i.item === item) || INFO[item];
+ const isSkill = fullInfo.skill;
+ const isSpec = fullInfo.spec;
+ const itemDescription = () => {
+ const regEx = /(RedPower|BluePower|GreenPower|RedLife|BlueLife|GreenLife|SpeedStat|LIFE|SPEED|POWER)/;
+ const infoDescription = reactStringReplace(fullInfo.description, regEx, m => shapes[m]());
+ return
{reactStringReplace(infoDescription, '\n', () =>
;
+ };
+ if (isSkill || isSpec) {
+ let infoName = fullInfo.item;
+ while (infoName.includes('Plus')) infoName = infoName.replace('Plus', '+');
+
+ const itemSource = itemInfo.combos.filter(c => c.item === removeTier(fullInfo.item));
+
+ let itemSourceInfo = itemSource.length && !isSpec
+ ? `${itemSource[0].components[0]} ${itemSource[0].components[1]} ${itemSource[0].components[2]}`
+ : false;
+
+ let header = null;
+ if (!itemSource.length) header = isSkill ?
SKILL :
SPEC ;
+ if (itemSourceInfo) {
+ while (itemSourceInfo.includes('Plus')) itemSourceInfo = itemSourceInfo.replace('Plus', '+');
+ const itemRegEx = /(Red|Blue|Green)/;
+ itemSourceInfo = reactStringReplace(itemSourceInfo, itemRegEx, match => shapes[match]());
+ }
+
+ const cooldown = isSkill && fullInfo.cooldown ?
{fullInfo.cooldown} Turn delay
: null;
+
+ const speed = isSkill
+ ?
Speed {shapes.SpeedStat()} multiplier {fullInfo.speed * 4}%
+ : null;
+
+ const thresholds = isSpec ? specThresholds(player, fullInfo, info) : null;
+
+ return (
+
+
{infoName}
+ {header}
+ {itemSourceInfo}
+ {cooldown}
+ {itemDescription()}
+ {speed}
+ {thresholds}
+
+ );
+ }
+ return (
+
+
{fullInfo.item}
+ {itemDescription()}
+
+ );
+ }
+ const stateFullInfo = comboItem || vboxInfo;
+ if (stateFullInfo) return genItemInfo(stateFullInfo);
+ if (!info) return false;
+ if (info.includes('constructName')) {
+ return (
+
+
{info.replace('constructName ', '')}
+
This is the name of your construct. RESHAPE tab outside of games.
+
+
+ );
+ }
+
+ if (info.includes('constructAvatar')) {
+ return (
+
+
{info.replace('constructAvatar ', '')}
+
This is your construct avatar. RESHAPE tab outside of games.
+
+
+ );
+ }
+
+ return genItemInfo(info);
+}
+
+module.exports = addState(Info);
diff --git a/client/src/components/info.thresholds.jsx b/client/src/components/vbox.info.thresholds.jsx
similarity index 95%
rename from client/src/components/info.thresholds.jsx
rename to client/src/components/vbox.info.thresholds.jsx
index 7136a855..9f259f0e 100644
--- a/client/src/components/info.thresholds.jsx
+++ b/client/src/components/vbox.info.thresholds.jsx
@@ -3,6 +3,7 @@ const range = require('lodash/range');
const shapes = require('./shapes');
function specThresholds(player, fullInfo, info) {
+ if (!info) return false;
let red = 0;
let blue = 0;
let green = 0;
@@ -87,9 +88,12 @@ function specThresholds(player, fullInfo, info) {
);
});
return (
-
- {thresholds}
+
+
);
}
diff --git a/client/src/components/vbox.stash.jsx b/client/src/components/vbox.stash.jsx
new file mode 100644
index 00000000..18dd6b78
--- /dev/null
+++ b/client/src/components/vbox.stash.jsx
@@ -0,0 +1,109 @@
+const preact = require('preact');
+const range = require('lodash/range');
+const without = require('lodash/without');
+
+const shapes = require('./shapes');
+const buttons = require('./buttons');
+const { removeTier } = require('../utils');
+
+function stashElement(props) {
+ const {
+ combinerChange,
+ itemUnequip,
+ vbox,
+ vboxBuySelected,
+ vboxHighlight,
+ vboxHover,
+ vboxSelecting,
+ stashSelect,
+
+ sendItemUnequip,
+ setInfo,
+ setVboxSelected,
+
+ } = props;
+ function stashClick(e) {
+ e.stopPropagation();
+ if (itemUnequip.length) return sendItemUnequip(itemUnequip);
+ if (vboxSelecting) return vboxBuySelected();
+ return true;
+ }
+
+ function stashBtn(v, i) {
+ const stashHighlight = vboxSelecting || itemUnequip.length;
+
+ if (!v && v !== 0) {
+ const emptyInvClick = () => {
+ if (vboxSelecting) return vboxBuySelected();
+ return false;
+ };
+ return
;
+ }
+
+ const notValidCombo = vboxHighlight && !vboxHighlight.includes(v);
+
+ function onClick(type) {
+ const combinerContainsIndex = stashSelect.indexOf(i) > -1;
+ // removing
+ if (combinerContainsIndex) {
+ if (type === 'click') {
+ return combinerChange(without(stashSelect, i));
+ }
+ return true;
+ }
+
+ if (notValidCombo) {
+ setInfo(vbox.bound[i]);
+ return setVboxSelected({ storeSelect: [], stashSelect: [i] });
+ }
+
+ stashSelect.push(i);
+ // if (stashSelect.length === 3) setInfo(comboItem.item);
+ return combinerChange(stashSelect);
+ }
+
+ const highlighted = stashSelect.indexOf(i) > -1;
+ const border = buttons[removeTier(v)] ? buttons[removeTier(v)]() : '';
+ const classes = highlighted
+ ? 'highlight'
+ : `${border} ${notValidCombo ? 'fade' : ''}`;
+
+ const invObject = shapes[v] ? shapes[v]() : v;
+
+ return (
+
{
+ onClick('drag');
+ ev.dataTransfer.setData('text', '');
+ }}>
+ vboxHover(e, v)}
+ onClick={e => e.stopPropagation()}
+ onMouseDown={() => onClick('click')}>
+ {invObject}
+
+
+ );
+ }
+
+ return (
+
e.stopPropagation()}
+ onDragOver={ev => ev.preventDefault()}
+ onDrop={stashClick}
+ >
+ {range(0, 6).map(i => stashBtn(vbox.bound[i], i))}
+
+ );
+}
+
+module.exports = stashElement;
diff --git a/client/src/components/vbox.store.jsx b/client/src/components/vbox.store.jsx
new file mode 100644
index 00000000..4dfda70a
--- /dev/null
+++ b/client/src/components/vbox.store.jsx
@@ -0,0 +1,78 @@
+const preact = require('preact');
+const range = require('lodash/range');
+
+const shapes = require('./shapes');
+
+
+function storeElement(props) {
+ const {
+ clearVboxSelected,
+ setVboxSelected,
+ storeSelect,
+ stashSelect,
+ vbox,
+ vboxHighlight,
+ vboxHover,
+ } = props;
+
+ function availableBtn(v, group, index) {
+ if (!v) return
;
+ const selected = storeSelect.length && storeSelect.some(vs => vs[0] === group && vs[1] === index);
+
+ const notValidCombo = vboxHighlight && !vboxHighlight.includes(v);
+
+ function onClick(e) {
+ e.stopPropagation();
+ if (storeSelect.length && storeSelect.some(vs => vs[0] === group && vs[1] === index)) {
+ return setVboxSelected(
+ { storeSelect: storeSelect.filter(vs => !(vs[0] === group && vs[1] === index)), stashSelect }
+ );
+ }
+
+ if (!storeSelect.length && !stashSelect.length) {
+ return setVboxSelected({ storeSelect: [[group, index]], stashSelect });
+ }
+ if (notValidCombo) {
+ return setVboxSelected({ storeSelect: [[group, index]], stashSelect: [] });
+ }
+ return setVboxSelected({ storeSelect: [...storeSelect, [group, index]], stashSelect });
+ }
+
+
+ const classes = selected
+ ? `${v.toLowerCase()} highlight`
+ : `${v.toLowerCase()} ${notValidCombo ? 'fade' : ''}`;
+
+ const vboxObject = shapes[v] ? shapes[v]() : v;
+ const disabled = vbox.bits <= group;
+ return (
+
+ vboxHover(e, v)}
+ onMouseDown={onClick}
+ onClick={e => e.stopPropagation()}
+ > {vboxObject}
+
+
+ );
+ }
+
+ return (
+
e.stopPropagation()}>
+
+ {range(0, 6).map(i => availableBtn(vbox.free[0][i], 0, i))}
+
+
+ {range(0, 3).map(i => availableBtn(vbox.free[1][i], 1, i))}
+ {range(0, 3).map(i => availableBtn(vbox.free[2][i], 2, i))}
+
+
+ );
+}
+
+module.exports = storeElement;
diff --git a/client/src/constants.jsx b/client/src/constants.jsx
index 5a7a24a3..f16b7f3b 100644
--- a/client/src/constants.jsx
+++ b/client/src/constants.jsx
@@ -24,22 +24,18 @@ module.exports = {
},
INFO: {
- vbox: {
- item: 'VBOX',
- description:
ITEMS that are available to buy.VBOX is refilled every round.REFILL at the bottom to purchase a refill.
,
+ store: {
+ item: 'STORE',
+ description:
Contains items that are available to buy.REFILL to purchase a refill for 2 bits.
,
},
- inventory: {
- item: 'INVENTORY',
+ stash: {
+ item: 'STASH',
description:
Holds ITEMS ITEMS carry over each round.
,
},
bits: {
item: 'BITS',
- description:
The VBOX currency.
,
+ description:
Currency to buy items.
,
},
ready: {
item: 'READY',
@@ -60,7 +56,7 @@ module.exports = {
},
constructSkills: {
item: 'SKILLS',
- description: 'Skills are used by constructs in the game phase.\nBase skills can be bought from the VBOX.\nEquip skills from the inventory. Double-click to unequip.',
+ description: 'Skills are used by constructs in the game phase.\nBase skills can be bought from the VBOX.\nEquip skills from the stash. Double-click to unequip.',
},
constructSpecs: {
item: 'SPECS',
diff --git a/client/src/events.jsx b/client/src/events.jsx
index 02c6af1e..f852313c 100644
--- a/client/src/events.jsx
+++ b/client/src/events.jsx
@@ -179,12 +179,10 @@ function registerEvents(store) {
}
function clearInstance() {
- store.dispatch(actions.setReclaiming(false));
store.dispatch(actions.setActiveSkill(null));
store.dispatch(actions.setInfo(null));
store.dispatch(actions.setItemUnequip([]));
- store.dispatch(actions.setVboxHighlight([]));
- store.dispatch(actions.setVboxSelected({ shopSelect: [], stashSelect: [] }));
+ store.dispatch(actions.setVboxSelected({ storeSelect: [], stashSelect: [] }));
}
function setAccountInstances(v) {
diff --git a/client/src/keyboard.jsx b/client/src/keyboard.jsx
index bb525d47..43d7343b 100644
--- a/client/src/keyboard.jsx
+++ b/client/src/keyboard.jsx
@@ -6,12 +6,10 @@ function setupKeys(store) {
key.unbind('esc');
key('esc', () => document.activeElement.blur());
- key('esc', () => store.dispatch(actions.setReclaiming(false)));
key('esc', () => store.dispatch(actions.setActiveSkill(null)));
key('esc', () => store.dispatch(actions.setInfo(null)));
key('esc', () => store.dispatch(actions.setItemUnequip([])));
- key('esc', () => store.dispatch(actions.setVboxHighlight([])));
- key('esc', () => store.dispatch(actions.setVboxSelected({ shopSelect: [], stashSelect: [] })));
+ key('esc', () => store.dispatch(actions.setVboxSelected({ storeSelect: [], stashSelect: [] })));
key('esc', () => store.dispatch(actions.setMtxActive(null)));
}
diff --git a/client/src/reducers.jsx b/client/src/reducers.jsx
index 1bda4dc7..3dcb0670 100644
--- a/client/src/reducers.jsx
+++ b/client/src/reducers.jsx
@@ -44,7 +44,6 @@ module.exports = {
nav: createReducer(null, 'SET_NAV'),
ping: createReducer(null, 'SET_PING'),
player: createReducer(null, 'SET_PLAYER'),
- reclaiming: createReducer(false, 'SET_RECLAIMING'),
shop: createReducer(false, 'SET_SHOP'),
pvp: createReducer(null, 'SET_PVP'),
@@ -57,7 +56,7 @@ module.exports = {
tutorial: createReducer(1, 'SET_TUTORIAL'),
tutorialGame: createReducer(1, 'SET_TUTORIAL_GAME'),
- vboxSelected: createReducer({ shopSelect: [], stashSelect: [] }, 'SET_VBOX_SELECTED'),
+ vboxSelected: createReducer({ storeSelect: [], stashSelect: [] }, 'SET_VBOX_SELECTED'),
ws: createReducer(null, 'SET_WS'),
};
diff --git a/client/src/tutorial.utils.jsx b/client/src/tutorial.utils.jsx
index a06cede2..8736bd72 100644
--- a/client/src/tutorial.utils.jsx
+++ b/client/src/tutorial.utils.jsx
@@ -138,7 +138,7 @@ function tutorialStage(tutorial, ws, clearTutorial, instance) {
Tutorial
The first construct on your team is {constructOne} .
Skill items can be equipped to your constructs to be used in the combat phase.
-
Click the newly combined skill item in the top right of the inventory.
Click the newly combined skill from the stash. SKILL slot to equip the skill.
);
@@ -161,7 +161,7 @@ function tutorialStage(tutorial, ws, clearTutorial, instance) {
Tutorial
Equipping specialisation items will increase the stats of your constructs.
These can also be combined with colours for further specialisation.
-
Click the specialisation item in the top right of the inventory.
Click the specialisation item from the stash.SPEC slot to equip the specialisation.
);
diff --git a/server/src/construct.rs b/server/src/construct.rs
index bce0d5c0..3c41ffd1 100644
--- a/server/src/construct.rs
+++ b/server/src/construct.rs
@@ -323,8 +323,6 @@ impl Construct {
}
pub fn apply_modifiers(&mut self, player_colours: &Colours) -> &mut Construct {
- self.specs.sort_unstable();
-
self.red_power.recalculate(&self.specs, player_colours);
self.red_life.recalculate(&self.specs, player_colours);
self.blue_power.recalculate(&self.specs, player_colours);
@@ -600,11 +598,11 @@ impl Construct {
self.reduce_green_life(red_remainder);
let red_damage_amount = red_current_green_life - self.green_life();
- events.push(Event::Damage {
+ events.push(Event::Damage {
skill,
amount: red_damage_amount,
mitigation: red_mitigation,
- colour: Colour::Red
+ colour: Colour::Red
});
}
@@ -629,11 +627,11 @@ impl Construct {
self.reduce_green_life(blue_remainder);
let blue_damage_amount = blue_current_green_life - self.green_life();
- events.push(Event::Damage {
+ events.push(Event::Damage {
skill,
amount: blue_damage_amount,
mitigation: blue_mitigation,
- colour: Colour::Blue
+ colour: Colour::Blue
});
}
}
diff --git a/server/src/vbox.rs b/server/src/vbox.rs
index 8df14c6d..faf93fdc 100644
--- a/server/src/vbox.rs
+++ b/server/src/vbox.rs
@@ -100,7 +100,7 @@ impl Vbox {
}
pub fn accept(&mut self, i: usize, j: usize, construct_id: Option
) -> Result<&mut Vbox, Error> {
- if self.bound.len() >= 9 && !construct_id.is_some() {
+ if self.bound.len() >= 6 && !construct_id.is_some() {
return Err(err_msg("too many items bound"));
}
@@ -150,7 +150,7 @@ impl Vbox {
for vi in vbox_indicies.iter() {
inv_indices.push(self.bound.len());
self.accept(vi[0], vi[1], Some(Uuid::nil()))?;
- }
+ }
// have to sort the indices and keep track of the iteration
// because when removing the elements the array shifts
@@ -171,7 +171,7 @@ impl Vbox {
self.bound.push(combo.item);
// self.bound.sort_unstable();
- if self.bound.len() >= 10 {
+ if self.bound.len() > 6 {
return Err(err_msg("too many items bound"));
}
Ok(self)