wip getting client prep for changes
This commit is contained in:
Mashy
@@ -5,7 +5,7 @@ const range = require('lodash/range');
|
||||
|
||||
const buttons = require('./buttons');
|
||||
const shapes = require('./shapes');
|
||||
const { STATS } = require('../utils');
|
||||
const { OFFENSE, DEFENSE } = require('../utils');
|
||||
const { ConstructAvatar } = require('./construct');
|
||||
const actions = require('../actions');
|
||||
const { removeTier } = require('../utils');
|
||||
@@ -125,7 +125,7 @@ function Construct(props) {
|
||||
const skillList = itemInfo.items.filter(v => v.skill).map(v => v.item);
|
||||
const specList = itemInfo.items.filter(v => v.spec).map(v => v.item);
|
||||
|
||||
const skills = range(0, 3).map(i => {
|
||||
const skills = range(0, 1).map(i => {
|
||||
const skill = construct.skills[i];
|
||||
const s = skill
|
||||
? skill.skill
|
||||
@@ -169,7 +169,7 @@ function Construct(props) {
|
||||
);
|
||||
});
|
||||
|
||||
const specs = range(0, 3).map(i => {
|
||||
const specs = range(0, 0).map(i => {
|
||||
const s = construct.specs[i];
|
||||
|
||||
if (!s) {
|
||||
@@ -207,12 +207,24 @@ function Construct(props) {
|
||||
);
|
||||
});
|
||||
|
||||
const stats = Object.keys(STATS).map(s => {
|
||||
const stat = STATS[s];
|
||||
const offensiveStats = Object.keys(OFFENSE).map(s => {
|
||||
const stat = OFFENSE[s];
|
||||
|
||||
const info = (s === 'SpeedStat' && 'speedStat')
|
||||
|| (s.includes('Power') && 'powerStat')
|
||||
|| (s.includes('Life') && 'lifeStat');
|
||||
|| (s.includes('Power') && 'powerStat');
|
||||
return <div key={stat.stat}
|
||||
alt={stat.stat}
|
||||
class={stat.stat}
|
||||
onMouseOver={e => hoverInfo(e, info)} >
|
||||
{shapes[s]()}
|
||||
<div>{construct[stat.stat].value}</div>
|
||||
</div>;
|
||||
});
|
||||
|
||||
const defensiveStats = Object.keys(DEFENSE).map(s => {
|
||||
const stat = DEFENSE[s];
|
||||
|
||||
const info = (s.includes('Life') && 'lifeStat');
|
||||
return <div key={stat.stat}
|
||||
alt={stat.stat}
|
||||
class={stat.stat}
|
||||
@@ -234,8 +246,11 @@ function Construct(props) {
|
||||
<div class="specs" onMouseOver={e => hoverInfo(e, 'constructSpecs')} >
|
||||
{specs}
|
||||
</div>
|
||||
<div class="stats">
|
||||
{stats}
|
||||
<div class="offStats">
|
||||
{offensiveStats}
|
||||
</div>
|
||||
<div class="defStats">
|
||||
{defensiveStats}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
@@ -45,10 +45,6 @@ const addState = connect(
|
||||
return ws.sendVboxRefund(instance.id, i);
|
||||
}
|
||||
|
||||
function sendItemUnequip([constructId, item]) {
|
||||
return ws.sendVboxUnequip(instance.id, constructId, item);
|
||||
}
|
||||
|
||||
return {
|
||||
itemUnequip,
|
||||
instance,
|
||||
@@ -59,7 +55,6 @@ const addState = connect(
|
||||
itemInfo,
|
||||
|
||||
sendInstance,
|
||||
sendItemUnequip,
|
||||
sendVboxBuy,
|
||||
sendVboxCombine,
|
||||
sendVboxRefill,
|
||||
@@ -112,7 +107,6 @@ class Vbox extends preact.Component {
|
||||
itemInfo,
|
||||
// Function Calls
|
||||
dispatchVboxSelect,
|
||||
sendItemUnequip,
|
||||
sendInstance,
|
||||
sendVboxBuy,
|
||||
sendVboxCombine,
|
||||
@@ -128,7 +122,6 @@ class Vbox extends preact.Component {
|
||||
|
||||
const setVboxSelected = v => dispatchVboxSelect(v, { itemInfo, itemUnequip, vbox });
|
||||
const clearVboxSelected = () => setVboxSelected({ storeSelect: [], stashSelect: [] });
|
||||
const vboxBuySelected = () => sendVboxBuy(storeSelect[0][0], storeSelect[0][1]);
|
||||
const clearTutorial = () => {
|
||||
setTutorial(null);
|
||||
sendInstance();
|
||||
@@ -147,7 +140,7 @@ class Vbox extends preact.Component {
|
||||
<div class="store-hdr">
|
||||
<h2
|
||||
onTouchStart={e => e.target.scrollIntoView(true)}
|
||||
onMouseOver={e => vboxHover(e, 'store')}> STORE
|
||||
onMouseOver={e => vboxHover(e, 'store')}> VBOX
|
||||
</h2>
|
||||
<h1 class={`bits ${vbox.bits < 3 ? 'red' : false}`} onMouseOver={e => vboxHover(e, 'bits')}>
|
||||
{vbox.bits}b
|
||||
@@ -168,41 +161,10 @@ class Vbox extends preact.Component {
|
||||
);
|
||||
}
|
||||
|
||||
function stashHdr() {
|
||||
const refund = storeSelect.length === 0 && stashSelect.length === 1
|
||||
? itemInfo.items.find(i => i.item === vbox.stash[stashSelect[0]]).cost
|
||||
: 0;
|
||||
const tutorialDisabled = tutorial && tutorial < 8
|
||||
&& instance.time_control === 'Practice' && instance.rounds.length === 1;
|
||||
const refundBtn = (
|
||||
<button
|
||||
disabled={tutorialDisabled || !refund}
|
||||
class='vbox-btn'
|
||||
onClick={e => e.stopPropagation()}
|
||||
onMouseDown={e => {
|
||||
e.stopPropagation();
|
||||
sendVboxRefund(vboxSelected.stashSelect[0]);
|
||||
}}>
|
||||
refund <br />
|
||||
{refund}b
|
||||
</button>
|
||||
);
|
||||
|
||||
return (
|
||||
<div class='stash-hdr'>
|
||||
<h2 onTouchStart={e => e.target.scrollIntoView(true)}
|
||||
onMouseOver={e => vboxHover(e, 'stash')}> STASH
|
||||
</h2>
|
||||
{refundBtn}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
// EVERYTHING
|
||||
return (
|
||||
<div class='vbox'>
|
||||
{storeHdr()}
|
||||
{stashHdr()}
|
||||
<StoreElement
|
||||
clearVboxSelected={clearVboxSelected}
|
||||
setVboxSelected={setVboxSelected}
|
||||
@@ -210,26 +172,11 @@ class Vbox extends preact.Component {
|
||||
vboxSelected={vboxSelected}
|
||||
vboxHover = {vboxHover}
|
||||
/>
|
||||
<StashElement
|
||||
sendItemUnequip={sendItemUnequip}
|
||||
setInfo={setInfo}
|
||||
setVboxSelected={setVboxSelected}
|
||||
vbox={vbox}
|
||||
vboxBuySelected={vboxBuySelected}
|
||||
vboxHover={vboxHover}
|
||||
/>
|
||||
<div class='info-combiner'>
|
||||
<InfoContainer
|
||||
clearTutorial={clearTutorial}
|
||||
/>
|
||||
<Combiner
|
||||
vbox={vbox}
|
||||
vboxSelected={vboxSelected}
|
||||
vboxBuySelected={vboxBuySelected}
|
||||
sendVboxCombine={sendVboxCombine}
|
||||
/>
|
||||
</div>
|
||||
<Combos />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -80,11 +80,8 @@ class storeElement extends preact.Component {
|
||||
return (
|
||||
<div class='store'
|
||||
onClick={e => e.stopPropagation()}>
|
||||
<div class="vbox-colours">
|
||||
{range(0, 6).map(i => availableBtn(vbox.store['Colours'][i], 'Colours', i.toString()))}
|
||||
</div>
|
||||
<div class="vbox-items">
|
||||
{range(0, 3).map(i => availableBtn(vbox.store['Skills'][i], 'Skills', i.toString()))}
|
||||
{range(0, 2).map(i => availableBtn(vbox.store['Skills'][i], 'Skills', i.toString()))}
|
||||
{range(0, 3).map(i => availableBtn(vbox.store['Specs'][i], 'Specs', i.toString()))}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -47,7 +47,7 @@ const numSort = (k, desc) => {
|
||||
|
||||
const NULL_UUID = '00000000-0000-0000-0000-000000000000';
|
||||
|
||||
const STATS = {
|
||||
const OFFENSE = {
|
||||
RedPower: {
|
||||
stat: 'red_power',
|
||||
colour: 'red',
|
||||
@@ -68,6 +68,8 @@ const STATS = {
|
||||
colour: 'white',
|
||||
svg: shapes.triangle,
|
||||
},
|
||||
};
|
||||
const DEFENSE = {
|
||||
RedLife: {
|
||||
stat: 'red_life',
|
||||
colour: 'red',
|
||||
@@ -83,7 +85,7 @@ const STATS = {
|
||||
colour: 'blue',
|
||||
svg: shapes.square,
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
const COLOURS = [
|
||||
'#a52a2a',
|
||||
@@ -294,7 +296,8 @@ module.exports = {
|
||||
errorToast,
|
||||
infoToast,
|
||||
NULL_UUID,
|
||||
STATS,
|
||||
OFFENSE,
|
||||
DEFENSE,
|
||||
COLOURS,
|
||||
TARGET_COLOURS,
|
||||
randomPoints,
|
||||
|
||||
Reference in New Issue
Block a user