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

Merge branch 'vbox-combine' into develop

Browse Source
This commit is contained in:
Mashy 2019-11-20 18:47:55 +10:00
commit eb35bea7c6
19 changed files with 223 additions and 257 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

56
WORKLOG.md
View File

@ -17,10 +17,28 @@
- Speed (e.g. boots)
- Life (e.g. heart)
* audio
* background music
* animation effects
* vbox combine / buy / equip etc
* reclaim change colour from red (clashes with red items)
* represent construct colours during game phase (coloured border?)
* supporter gold name in instance (anyone whos put any money into game)
* Give the bots some ai / make stronger so its a challenge for new people to beat
- train a few games of with some round losses to get them into the game
* Speed up animations slightly (3s per normal event too long)
- Improve combat text to start at the opposite end of construct and float towards health stats
- Show combat text for skill cast possibly? Watch some pokemans etc for modern combat smoothing
## SOON
* supporter gold name in instance (anyone whos put any money into game)
* vbox + inventory smart combine select
- rework combine button to universal buy
- becomes combine with buy cost when valid combo selected
* buy from preview if you have the required bases in vbox / inventory
- a "buy" becomes available under the current info / preview section
@ -29,12 +47,29 @@
- e.g. an equipped white power spec could be upgraded by clicking under preview
- if this was added we could reduce inventory size to 3 and rearrange vbox (see mockup img)
* reduce inventory size and consolidate vbox and inventory on left side
* change cooldowns to delay & recharge
- delay is cooldown before skill can first be used
- recharge is cooldown after using skill
- every x speed reduces delay of skills
* audio
* combo rework
- reduce number of items for creating t2/t3 items from 3 -> 2
- add lost complexity by adding skill spec items
- Created by combining a skill with corresponding spec
e.g.
- Strike + PowerRR -> StrikePower (Will be the power symbol with strike text under)
- Construct does Y% more damage with Strike
- Strike + SpeedRR -> StrikeSpeed (strike has Y% more speed)
- Strike + LifeRR -> StrikeLife (Strike recharges X% of damage as red life)
- Can also work as module style passive keystones
* troll life -> dmg -> Invert life spec?
* prince of peace
* bonus healing / no damage -> Heal power spec?
* fuck magic -> Some sort of reflect spec?
* empower on ko -> Amplify + Power spec
* elo + leaderboards
* reconnect based on time delta
@ -57,16 +92,6 @@
* remove names so games/instances are copy
* consolidate game and instance
* combo rework
- reduce number of items for creating t2/t3 items from 3 -> 2
- add lost complexity by adding skill spec items
- Created by combining a skill with corresponding spec
e.g.
- Strike + PowerRR -> StrikePower (Will be the power symbol with strike text under)
- Construct does Y% more damage with Strike
- Strike + SpeedRR -> StrikeSpeed (strike has Y% more speed)
- Strike + LifeRR -> StrikeLife (Strike recharges X% of damage as red life)
* Energy generators / spenders
- Current skills generate team wide red / blue / green energy
- New special skill base consumes team energy to do "special" powerful moves
@ -78,12 +103,7 @@
* mnml tv
* modules
* troll life -> dmg
* prince of peace
* bonus healing / no damage
* fuck magic
* empower on ko
## $$$
* Items

17
client/assets/styles/instance.less
View File

@ -162,6 +162,23 @@
}
.construct-list {
button {
&.highlight {
color: black;
background: @white;
// border: 1px solid @white; (this bangs around the vbox)
// overwrite the classes on white svg elements
svg {
stroke-width: 0.75em;
}
.white {
stroke: black;
}
}
}
.name {
grid-area: name;
margin-bottom: 0.5em;

2
client/src/actions.jsx
View File

@ -16,7 +16,6 @@ export const setInstanceChat = value => ({ type: 'SET_INSTANCE_CHAT', value });
export const setActiveItem = value => ({ type: 'SET_ACTIVE_VAR', value });
export const setActiveSkill = (constructId, skill) => ({ type: 'SET_ACTIVE_SKILL', value: constructId ? { constructId, skill } : null });
export const setCombiner = value => ({ type: 'SET_COMBINER', value: Array.from(value) });
export const setConstructEditId = value => ({ type: 'SET_CONSTRUCT_EDIT_ID', value });
export const setConstructs = value => ({ type: 'SET_CONSTRUCTS', value });
export const setConstructRename = value => ({ type: 'SET_CONSTRUCT_RENAME', value });
@ -30,7 +29,6 @@ export const setEmail = value => ({ type: 'SET_EMAIL', value });
export const setInvite = value => ({ type: 'SET_INVITE', value });
export const setInstance = value => ({ type: 'SET_INSTANCE', value });
export const setInstances = value => ({ type: 'SET_INSTANCES', value });
export const setItemEquip = value => ({ type: 'SET_ITEM_EQUIP', value });
export const setItemInfo = value => ({ type: 'SET_ITEM_INFO', value });
export const setItemUnequip = value => ({ type: 'SET_ITEM_UNEQUIP', value });
export const setMtxActive = value => ({ type: 'SET_MTX_ACTIVE', value });

2
client/src/components/account.status.jsx
View File

@ -33,11 +33,9 @@ const addState = connect(
function accountPage() {
dispatch(actions.setGame(null));
dispatch(actions.setInstance(null));
dispatch(actions.setCombiner([]));
dispatch(actions.setReclaiming(false));
dispatch(actions.setActiveSkill(null));
dispatch(actions.setInfo(null));
dispatch(actions.setItemEquip(null));
dispatch(actions.setItemUnequip([]));
dispatch(actions.setVboxHighlight([]));
return dispatch(actions.setNav('account'));

2
client/src/components/header.jsx
View File

@ -32,11 +32,9 @@ const addState = connect(
function setNav(place) {
dispatch(actions.setGame(null));
dispatch(actions.setInstance(null));
dispatch(actions.setCombiner([]));
dispatch(actions.setReclaiming(false));
dispatch(actions.setActiveSkill(null));
dispatch(actions.setInfo(null));
dispatch(actions.setItemEquip(null));
dispatch(actions.setItemUnequip([]));
dispatch(actions.setVboxHighlight([]));
dispatch(actions.setMtxActive(null));

2
client/src/components/info.container.jsx
View File

@ -7,7 +7,6 @@ const addState = connect(
function receiveState(state) {
const {
ws,
combiner,
info,
itemInfo,
instance,
@ -18,7 +17,6 @@ const addState = connect(
return {
ws,
combiner,
info,
itemInfo,
instance,

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

@ -27,12 +27,10 @@ const addState = connect(
function clearItems() {
dispatch(actions.setCombiner([]));
dispatch(actions.setReclaiming(false));
dispatch(actions.setItemEquip(null));
dispatch(actions.setItemUnequip([]));
dispatch(actions.setVboxHighlight([]));
dispatch(actions.setVboxSelected([]));
dispatch(actions.setVboxSelected({ shopSelect: [], stashSelect: [] }));
return true;
}

68
client/src/components/instance.constructs.jsx
View File

@ -19,24 +19,19 @@ const addState = connect(
player,
account,
itemInfo,
itemEquip,
itemUnequip,
vboxSelected,
tutorial,
} = state;
function sendVboxAcceptEquip(constructId) {
return ws.sendVboxAcceptEquip(instance.id, vboxSelected[0], vboxSelected[1], constructId);
return ws.sendVboxAcceptEquip(instance.id, vboxSelected.shopSelect[0][0], vboxSelected.shopSelect[0][1], constructId);
}
function sendVboxApply(constructId, i) {
return ws.sendVboxApply(instance.id, constructId, i);
}
function sendUnequip(constructId, item) {
return ws.sendVboxUnequip(instance.id, constructId, item);
}
function sendVboxUnequipApply(targetConstructId) {
return ws.sendVboxUnequipApply(instance.id, itemUnequip[0], itemUnequip[1], targetConstructId);
}
@ -49,9 +44,7 @@ const addState = connect(
sendVboxUnequipApply,
sendVboxApply,
itemInfo,
itemEquip,
itemUnequip,
sendUnequip,
vboxSelected,
tutorial,
};
@ -66,15 +59,12 @@ const addState = connect(
dispatch(actions.setInfo(item));
}
function setItemEquip(v) {
return dispatch(actions.setItemEquip(v));
}
function setItemUnequip(v) {
dispatch(actions.setVboxSelected({ shopSelect: [], stashSelect: [] }));
return dispatch(actions.setItemUnequip(v));
}
return { quit, setInfo, setItemUnequip, setItemEquip };
return { quit, setInfo, setItemUnequip };
}
);
@ -84,7 +74,6 @@ function Construct(props) {
// Changing state variables
construct,
iter,
itemEquip,
itemUnequip,
instance,
player,
@ -96,13 +85,16 @@ function Construct(props) {
sendVboxApply,
sendVboxAcceptEquip,
sendVboxUnequipApply,
sendUnequip,
setItemUnequip,
setItemEquip,
setInfo,
} = props;
const { vbox } = player;
const itemEquip = vboxSelected.shopSelect.length === 0 && vboxSelected.stashSelect.length === 1
? vboxSelected.stashSelect[0]
: -1;
const duplicateSkill = construct.skills.length !== 0 && construct.skills.every(sk => {
if (!itemEquip && itemEquip !== 0) return false;
if (!sk) return false;
@ -113,17 +105,16 @@ function Construct(props) {
e.stopPropagation();
e.preventDefault();
if (duplicateSkill || tutorialDisableEquip) return true;
if (itemEquip !== null) return sendVboxApply(construct.id, itemEquip);
if (vboxSelected[0]) return sendVboxAcceptEquip(construct.id);
if (itemEquip !== -1) return sendVboxApply(construct.id, itemEquip);
if (vboxSelected.shopSelect.length === 1) return sendVboxAcceptEquip(construct.id);
if (itemUnequip.length && itemUnequip[0] !== construct.id) return sendVboxUnequipApply(construct.id);
setItemEquip(null);
setItemUnequip([]);
return true;
}
function hoverInfo(e, info) {
e.stopPropagation();
if (!info) return false;
if (vboxSelected[0] || itemEquip > -1) return false;
if (vboxSelected.shopSelect.length || vboxSelected.stashSelect.length) return false;
return setInfo(info);
}
@ -138,20 +129,11 @@ function Construct(props) {
function skillClick(e) {
if (!skill) return false;
setItemUnequip([construct.id, skill.skill]);
setItemUnequip([construct.id, skill.skill, i]);
e.stopPropagation();
return true;
}
function skillDblClick(e) {
if (!skill) return false;
sendUnequip(construct.id, skill.skill);
setItemUnequip([]);
e.stopPropagation();
e.preventDefault();
return true;
}
const equipping = skillList.includes(vbox.bound[itemEquip]) && !skill
&& !tutorialDisableEquip && !duplicateSkill && i === construct.skills.length;
const border = () => {
@ -161,7 +143,9 @@ function Construct(props) {
return borderFn();
};
const classes = `${equipping ? 'equipping' : ''} ${!skill ? 'empty' : ''} ${border()}`;
const highlight = itemUnequip[0] === construct.id && itemUnequip[1] === s ? 'highlight' : '';
const classes = `${highlight} ${equipping ? 'equipping' : ''} ${!skill ? 'empty' : ''} ${border()}`;
return (
<label onDragStart={ev => {
ev.dataTransfer.setData('text', '');
@ -172,7 +156,6 @@ function Construct(props) {
disabled={!skill && !equipping}
class={classes}
onClick={skillClick}
onDblClick={skillDblClick}
onMouseOver={e => hoverInfo(e, skill && skill.skill)} >
{s}
</button>
@ -195,18 +178,10 @@ function Construct(props) {
function specClick(e) {
e.stopPropagation();
setItemUnequip([construct.id, s]);
setItemUnequip([construct.id, s, i]);
}
function specDblClick(e) {
sendUnequip(construct.id, s);
setItemUnequip([]);
e.stopPropagation();
e.preventDefault();
return true;
}
const highlight = itemUnequip[0] === construct.id && itemUnequip[1] === s && i === itemUnequip[2];
return (
<label onDragStart={ev => {
ev.dataTransfer.setData('text', '');
@ -214,8 +189,8 @@ function Construct(props) {
}} key={i} draggable="true" onDragEnd={() => setItemUnequip([])}>
<button
key={i}
class={`${highlight ? 'highlight' : ''}`}
onClick={specClick}
onDblClick={specDblClick}
onMouseOver={e => hoverInfo(e, s)} >
{shapes[s]()}
</button>
@ -259,7 +234,6 @@ function Construct(props) {
class InstanceConstructs extends preact.Component {
shouldComponentUpdate(newProps) {
if (newProps.itemEquip !== this.props.itemEquip) return true;
if (newProps.itemUnequip !== this.props.itemUnequip) return true;
if (newProps.tutorial !== this.props.tutorial) return true;
// JSON or Array objects
@ -272,7 +246,6 @@ class InstanceConstructs extends preact.Component {
render(props) {
const {
// Changing state variables
itemEquip,
itemUnequip,
instance,
player,
@ -287,8 +260,6 @@ class InstanceConstructs extends preact.Component {
sendVboxUnequipApply,
setVboxHighlight,
setItemUnequip,
setItemEquip,
sendUnequip,
} = props;
if (!player) return false;
@ -301,11 +272,9 @@ class InstanceConstructs extends preact.Component {
return Construct({
iter: i,
construct: player.constructs[i],
itemEquip,
itemUnequip,
instance,
setItemUnequip,
setItemEquip,
player,
sendVboxApply,
sendVboxAcceptEquip,
@ -313,7 +282,6 @@ class InstanceConstructs extends preact.Component {
setInfo,
itemInfo,
setVboxHighlight,
sendUnequip,
vboxSelected,
tutorial,
});

2
client/src/components/nav.jsx
View File

@ -33,11 +33,9 @@ const addState = connect(
function setNav(place) {
dispatch(actions.setGame(null));
dispatch(actions.setInstance(null));
dispatch(actions.setCombiner([]));
dispatch(actions.setReclaiming(false));
dispatch(actions.setActiveSkill(null));
dispatch(actions.setInfo(null));
dispatch(actions.setItemEquip(null));
dispatch(actions.setItemUnequip([]));
dispatch(actions.setVboxHighlight([]));

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

@ -3,6 +3,7 @@ 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');
@ -15,7 +16,6 @@ const addState = connect(
ws,
instance,
player,
combiner,
reclaiming,
vboxSelected,
itemInfo,
@ -33,7 +33,7 @@ const addState = connect(
}
function sendVboxCombine() {
return ws.sendVboxCombine(instance.id, combiner);
return ws.sendVboxCombine(instance.id, vboxSelected.stashSelect, vboxSelected.shopSelect);
}
function sendVboxReclaim(i) {
@ -45,7 +45,6 @@ const addState = connect(
}
return {
combiner,
instance,
player,
reclaiming,
@ -62,11 +61,9 @@ const addState = connect(
},
function receiveDispatch(dispatch) {
function setCombiner(c) {
return dispatch(actions.setCombiner(c));
}
function setReclaiming(v) {
dispatch(actions.setItemUnequip([]));
dispatch(actions.setVboxSelected({ shopSelect: [], stashSelect: [] }));
return dispatch(actions.setReclaiming(v));
}
@ -75,28 +72,52 @@ const addState = connect(
}
function setVboxSelected(v) {
dispatch(actions.setItemUnequip([]));
dispatch(actions.setVboxSelected(v));
return dispatch(actions.setVboxSelected(v));
}
function setItemEquip(v) {
return dispatch(actions.setItemEquip(v));
}
return {
setCombiner,
setReclaiming,
setInfo,
setVboxSelected,
setItemEquip,
};
}
);
function validVboxSelect(vbox, itemInfo, shopSelect, stashSelect) {
if (shopSelect.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 selectedItems = stashItems.concat(shopItems);
const itemCount = countBy(selectedItems, co => co);
itemInfo.combos.forEach(combo => {
const comboCount = countBy(combo.components, co => co);
const buyCount = countBy(combo.components, co => co);
const valid = selectedItems.every(c => {
if (!combo.components.includes(c)) return false;
if (itemCount[c] > comboCount[c]) return false;
buyCount[c] -= itemCount[c];
return true;
});
if (valid) {
forEach(buyCount, (value, key) => {
if (value > 0 && !validSelects.includes(key)) validSelects.push(key);
});
}
});
return validSelects;
}
class Vbox extends preact.Component {
shouldComponentUpdate(newProps) {
// Single variable props
if (newProps.combiner !== this.props.combiner) return true;
if (newProps.itemUnequip !== this.props.itemUnequip) return true;
if (newProps.reclaiming !== this.props.reclaiming) return true;
if (newProps.tutorial !== this.props.tutorial) return true;
@ -109,7 +130,6 @@ class Vbox extends preact.Component {
render(args) {
const {
// Changing state variables
combiner,
itemUnequip,
player,
reclaiming,
@ -126,37 +146,29 @@ class Vbox extends preact.Component {
sendVboxDiscard,
sendVboxReclaim,
setVboxSelected,
setItemEquip,
setInfo,
setCombiner,
setReclaiming,
} = args;
if (!player) return false;
const { vbox } = player;
const vboxSelecting = vboxSelected.length;
const { shopSelect, stashSelect } = vboxSelected;
const vboxSelecting = shopSelect.length === 1 && stashSelect.length === 0;
function combinerChange(newCombiner) {
setCombiner(newCombiner);
if (newCombiner.length === 1) {
setItemEquip(newCombiner[0]);
} else {
setItemEquip(null);
}
return true;
function combinerChange(newStashSelect) {
return setVboxSelected({ shopSelect, stashSelect: newStashSelect });
}
const vboxHighlight = validVboxSelect(vbox, itemInfo, shopSelect, stashSelect);
//
// VBOX
//
function vboxHover(e, v) {
if (v) {
e.stopPropagation();
if (vboxSelected[0]) return true; // There is a base skill or spec selected in the vbox
if (combiner.length !== 0) {
const base = combiner.find(c => !['Red', 'Blue', 'Green'].includes(vbox.bound[c]));
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;
}
setInfo(v);
@ -165,51 +177,36 @@ class Vbox extends preact.Component {
}
function clearVboxSelected() {
setVboxSelected([]);
setVboxSelected({ shopSelect: [], stashSelect: [] });
}
function vboxBuySelected() {
if (!vboxSelecting) return false;
document.activeElement.blur();
clearVboxSelected();
sendVboxAccept(vboxSelected[0], vboxSelected[1]);
sendVboxAccept(shopSelect[0][0], shopSelect[0][1]);
return true;
}
function availableBtn(v, group, index) {
if (!v) return <button disabled class='empty' key={(group * 10) + index} >&nbsp;</button>;
const selected = vboxSelected[0] === group && vboxSelected[1] === index;
const selected = shopSelect.length && shopSelect.some(vs => vs[0] === group && vs[1] === index);
// state not yet set in double click handler
function onDblClick(e) {
clearVboxSelected();
sendVboxAccept(group, index);
e.stopPropagation();
}
const comboHighlight = vboxHighlight && vboxHighlight.includes(v) ? 'combo-border' : '';
function onClick(e) {
e.stopPropagation();
setItemEquip(null);
setCombiner([]);
setInfo(vbox.free[group][index]);
if (vboxSelected[0] === group && vboxSelected[1] === index) return clearVboxSelected();
return setVboxSelected([group, index]);
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 });
}
const combinerItems = combiner.map(j => vbox.bound[j]);
const combinerCount = countBy(combinerItems, co => co);
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 comboHighlight = combinerItems.length > 0 && itemInfo.combos.some(combo => {
if (combo.components.includes(v)) {
return combinerItems.every(c => {
if (!combo.components.includes(c)) return false;
const comboCount = countBy(combo.components, co => co);
if (combinerCount[c] > comboCount[c]) return false;
if (c === v && combinerCount[c] + 1 > comboCount[c]) return false;
return true;
});
} return false;
}) ? 'combo-border' : '';
const classes = `${v.toLowerCase()} ${selected ? 'highlight' : ''} ${comboHighlight}`;
@ -217,10 +214,7 @@ class Vbox extends preact.Component {
const disabled = vbox.bits <= group;
return (
<label draggable='true'
onDragStart={ev => {
onClick(ev);
ev.dataTransfer.setData('text', '')
}}
onDragStart={ev => ev.dataTransfer.setData('text', '')}
key={group * 10 + index}
onDragEnd={clearVboxSelected}>
<button
@ -229,7 +223,6 @@ class Vbox extends preact.Component {
onMouseOver={e => vboxHover(e, v)}
onMouseDown={onClick}
onClick={e => e.stopPropagation()}
onDblClick={onDblClick}
> {vboxObject}
</button>
</label>
@ -240,7 +233,6 @@ class Vbox extends preact.Component {
function vboxElement() {
return (
<div class='vbox-vbox'
onMouseDown={() => setReclaiming(false)}
onClick={e => e.stopPropagation()}>
<div class="vbox-hdr">
<h3
@ -259,7 +251,9 @@ class Vbox extends preact.Component {
<button
class='vbox-btn'
onMouseOver={e => hoverInfo(e, 'refill')}
disabled={tutorial && tutorial < 7 && instance.time_control === 'Practice' && instance.rounds.length === 1}
disabled={vbox.bits < 2
|| (tutorial && tutorial < 7 && instance.time_control === 'Practice' && instance.rounds.length === 1)
}
onClick={e => e.stopPropagation()}
onMouseDown={() => sendVboxDiscard()}>
refill - 2b
@ -276,60 +270,42 @@ class Vbox extends preact.Component {
return setReclaiming(!reclaiming);
}
const inventoryClass = `vbox-section ${reclaiming ? 'reclaiming' : ''}`;
function inventoryBtn(v, i) {
const inventoryHighlight = vboxSelecting || itemUnequip.length;
if (!v && v !== 0) {
return <button key={i} disabled={!inventoryHighlight} class={inventoryHighlight ? 'receiving' : 'empty'} >&nbsp;</button>;
const emptyInvClick = () => {
if (vboxSelecting) return vboxBuySelected();
return false;
};
return <button key={i} onClick={emptyInvClick} disabled={!inventoryHighlight} class={inventoryHighlight ? 'receiving' : 'empty'} >&nbsp;</button>;
}
const combinerItems = combiner.map(j => vbox.bound[j]);
const combinerCount = countBy(combinerItems, co => co);
const comboItem = itemInfo.combos.find(combo => {
if (combo.components.includes(v)) {
return combinerItems.every(c => {
if (!combo.components.includes(c)) return false;
const comboCount = countBy(combo.components, co => co);
if (combinerCount[c] > comboCount[c]) return false;
if (c === v && combinerCount[c] + 1 > comboCount[c]) return false;
return true;
});
} return false;
});
const comboHighlight = combinerItems.length > 0 && comboItem ? 'combo-border' : '';
const comboHighlight = vboxHighlight && vboxHighlight.includes(v) ? 'combo-border' : '';
function onClick(type) {
if (vboxSelecting) clearVboxSelected();
if (reclaiming) return sendVboxReclaim(i);
const combinerContainsIndex = combiner.indexOf(i) > -1;
// 4 things selected
if (combiner.length > 2 && !combinerContainsIndex) {
setInfo(vbox.bound[i]);
return combinerChange([i]);
}
const combinerContainsIndex = stashSelect.indexOf(i) > -1;
// removing
if (combinerContainsIndex) {
if (type === 'click') {
return combinerChange(without(combiner, i));
return combinerChange(without(stashSelect, i));
}
return true;
}
if (!comboHighlight && !combinerContainsIndex) {
if (!comboHighlight) {
setInfo(vbox.bound[i]);
return combinerChange([i]);
return setVboxSelected({ shopSelect: [], stashSelect: [i] });
}
combiner.push(i);
if (combiner.length === 3) setInfo(comboItem.item);
return combinerChange(combiner);
stashSelect.push(i);
// if (stashSelect.length === 3) setInfo(comboItem.item);
return combinerChange(stashSelect);
}
const highlighted = combiner.indexOf(i) > -1;
const highlighted = stashSelect.indexOf(i) > -1;
const border = buttons[removeTier(v)] ? buttons[removeTier(v)]() : '';
const classes = `${highlighted ? 'highlight' : border} ${comboHighlight}`;
@ -356,37 +332,49 @@ class Vbox extends preact.Component {
function combinerBtn() {
let text = '';
let comboItem = '';
if (combiner.length < 3) {
for (let i = 0; i < 3; i++) {
if (combiner.length > i) {
text += '■ ';
} else {
text += '▫ ';
}
}
} else {
// Since theres 3 items in combiner and you can't have invalid combos we can preview it
const combinerItems = combiner.map(j => vbox.bound[j]);
const combinerCount = countBy(combinerItems, co => co);
const comboItemObj = itemInfo.combos.find(combo => combinerItems.every(c => {
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;
}));
comboItem = comboItemObj ? comboItemObj.item : 'refine';
let comboItem = comboItemObj ? comboItemObj.item : 'refine';
setInfo(comboItem);
comboItem = comboItem.replace('Plus', '+');
text = `Combine - ${comboItem}`;
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 (
<button
class='vbox-btn'
disabled={combiner.length !== 3}
onMouseOver={e => hoverInfo(e, comboItem)}
disabled={!mouseEvent}
onClick={e => e.stopPropagation()}
onMouseDown={() => sendVboxCombine()}>
onMouseDown={() => mouseEvent()}>
{text}
</button>
);
@ -395,21 +383,18 @@ class Vbox extends preact.Component {
function inventoryElement() {
function inventoryClick(e) {
e.stopPropagation();
setReclaiming(false);
if (vboxSelecting) return vboxBuySelected();
if (itemUnequip.length) return sendItemUnequip(itemUnequip);
return true;
}
return (
<div class={inventoryClass}
<div
onMouseDown={inventoryClick}
onClick={e => e.stopPropagation()}
style={vboxSelecting || (itemUnequip.length) ? { cursor: 'pointer' } : null}
onDragOver={ev => ev.preventDefault()}
onDrop={inventoryClick}
>
<div class="vbox-hdr">
<div class={`vbox-hdr ${reclaiming ? 'reclaiming' : ''}`}>
<h3
onTouchStart={e => e.target.scrollIntoView(true)}
onMouseOver={e => hoverInfo(e, 'inventory')}> INVENTORY
@ -423,7 +408,8 @@ class Vbox extends preact.Component {
reclaim
</button>
</div>
<div class='vbox-items'>
<div class={`vbox-items ${reclaiming ? 'reclaiming' : ''}`}>
{range(0, 9).map(i => inventoryBtn(vbox.bound[i], i))}
</div>
{combinerBtn()}
@ -435,11 +421,9 @@ class Vbox extends preact.Component {
// EVERYTHING
//
function hoverInfo(e, newInfo) {
e.stopPropagation();
if (vboxSelected[0]) return true;
if (combiner.length !== 0) {
const base = combiner.find(c => !['Red', 'Blue', 'Green'].includes(vbox.bound[c]));
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);

10
client/src/events.jsx
View File

@ -157,11 +157,6 @@ function registerEvents(store) {
store.dispatch(actions.setShop(v));
}
function clearCombiner() {
store.dispatch(actions.setInfo([]));
store.dispatch(actions.setCombiner([]));
}
function clearConstructRename() {
store.dispatch(actions.setConstructRename(null));
}
@ -184,14 +179,12 @@ function registerEvents(store) {
}
function clearInstance() {
store.dispatch(actions.setCombiner([]));
store.dispatch(actions.setReclaiming(false));
store.dispatch(actions.setActiveSkill(null));
store.dispatch(actions.setInfo(null));
store.dispatch(actions.setItemEquip(null));
store.dispatch(actions.setItemUnequip([]));
store.dispatch(actions.setVboxHighlight([]));
store.dispatch(actions.setVboxSelected([]));
store.dispatch(actions.setVboxSelected({ shopSelect: [], stashSelect: [] }));
}
function setAccountInstances(v) {
@ -345,7 +338,6 @@ function registerEvents(store) {
window.addEventListener('hashchange', urlHashChange, false);
return {
clearCombiner,
clearConstructRename,
clearInfo,
clearInstance,

4
client/src/keyboard.jsx
View File

@ -6,14 +6,12 @@ function setupKeys(store) {
key.unbind('esc');
key('esc', () => document.activeElement.blur());
key('esc', () => store.dispatch(actions.setCombiner([])));
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.setItemEquip(null)));
key('esc', () => store.dispatch(actions.setItemUnequip([])));
key('esc', () => store.dispatch(actions.setVboxHighlight([])));
key('esc', () => store.dispatch(actions.setVboxSelected([])));
key('esc', () => store.dispatch(actions.setVboxSelected({ shopSelect: [], stashSelect: [] })));
key('esc', () => store.dispatch(actions.setMtxActive(null)));
}

4
client/src/reducers.jsx
View File

@ -26,7 +26,6 @@ module.exports = {
chatShow: createReducer(null, 'SET_CHAT_SHOW'),
chatWheel: createReducer([], 'SET_CHAT_WHEEL'),
combiner: createReducer([], 'SET_COMBINER'),
constructs: createReducer([], 'SET_CONSTRUCTS'),
constructEditId: createReducer(null, 'SET_CONSTRUCT_EDIT_ID'),
constructRename: createReducer(null, 'SET_CONSTRUCT_RENAME'),
@ -39,7 +38,6 @@ module.exports = {
instance: createReducer(null, 'SET_INSTANCE'),
instanceChat: createReducer(null, 'SET_INSTANCE_CHAT'),
instances: createReducer([], 'SET_INSTANCES'),
itemEquip: createReducer(null, 'SET_ITEM_EQUIP'),
itemInfo: createReducer({ combos: [], items: [] }, 'SET_ITEM_INFO'),
itemUnequip: createReducer([], 'SET_ITEM_UNEQUIP'),
mtxActive: createReducer(null, 'SET_MTX_ACTIVE'),
@ -59,7 +57,7 @@ module.exports = {
tutorial: createReducer(1, 'SET_TUTORIAL'),
tutorialGame: createReducer(1, 'SET_TUTORIAL_GAME'),
vboxSelected: createReducer([], 'SET_VBOX_SELECTED'),
vboxSelected: createReducer({ shopSelect: [], stashSelect: [] }, 'SET_VBOX_SELECTED'),
ws: createReducer(null, 'SET_WS'),
};

4
client/src/socket.jsx
View File

@ -107,8 +107,8 @@ function createSocket(events) {
events.clearInstance();
}
function sendVboxCombine(instanceId, indices) {
send(['VboxCombine', { instance_id: instanceId, indices }]);
function sendVboxCombine(instanceId, invIndicies, vboxIndicies) {
send(['VboxCombine', { instance_id: instanceId, inv_indices: invIndicies, vbox_indices: vboxIndicies }]);
events.clearInstance();
}

10
client/src/tutorial.utils.jsx
View File

@ -4,7 +4,7 @@ const actions = require('./actions');
function tutorialConstructDisplay(player, instance, tutorial, i) {
if (instance.time_control === 'Practice' && instance.rounds.length === 1 && tutorial && tutorial < 6) {
if (tutorial <= 2 || (tutorial > 2 && i > 0)) {
const classes = `instance-construct`;
const classes = 'instance-construct';
return (<div key={player.constructs[i].id} class={classes}></div>);
}
}
@ -112,9 +112,8 @@ function tutorialStage(tutorial, ws, clearTutorial, instance) {
<div class='info-item'>
<h2>Tutorial</h2>
<p> Welcome to the vbox phase tutorial.</p>
<p> Colours are used to create powerful combinations. </p>
<p> Buy two colours from the vbox by double clicking. <br />
You can also click the colour once and then click the inventory. </p>
<p> Colours are used to create powerful combinations with base items. </p>
<p> Buy the two colours from the vbox to continue. </p>
</div>
);
}
@ -151,8 +150,7 @@ function tutorialStage(tutorial, ws, clearTutorial, instance) {
<h2>Tutorial</h2>
<p> You can also buy specialisation items for your constructs. <br />
Specialisation items increase stats including power, speed and life. </p>
<p> Buy the specialisation item from the vbox by double clicking. <br />
You can also click the specialisation once and then click the inventory. </p>
<p> Buy the specialisation item from the vbox to continue. </p>
</div>
);
}

4
server/src/instance.rs
View File

@ -480,10 +480,10 @@ impl Instance {
Ok(self)
}
pub fn vbox_combine(mut self, account: Uuid, indices: Vec<usize>) -> Result<Instance, Error> {
pub fn vbox_combine(mut self, account: Uuid, inv_indices: Vec<usize>, vbox_indices: Vec<Vec<usize>>) -> Result<Instance, Error> {
self.vbox_action_allowed(account)?;
self.account_player(account)?
.vbox_combine(indices)?;
.vbox_combine(inv_indices, vbox_indices)?;
Ok(self)
}

6
server/src/player.rs
View File

@ -229,7 +229,7 @@ impl Player {
};
// first 2 colours can be whatever
self.vbox_combine(vec![0, 1, combo_i]).ok();
self.vbox_combine(vec![0, 1, combo_i], vec![]).ok();
let item_i = self.vbox.bound.len() - 1;
self.vbox_apply(item_i, target_construct_id).ok();
}
@ -257,8 +257,8 @@ impl Player {
Ok(self)
}
pub fn vbox_combine(&mut self, indices: Vec<usize>) -> Result<&mut Player, Error> {
self.vbox.combine(indices)?;
pub fn vbox_combine(&mut self, inv_indices: Vec<usize>, vbox_indices: Vec<Vec<usize>>) -> Result<&mut Player, Error> {
self.vbox.combine(inv_indices, vbox_indices)?;
Ok(self)
}

6
server/src/rpc.rs
View File

@ -117,7 +117,7 @@ pub enum RpcRequest {
VboxAccept { instance_id: Uuid, group: usize, index: usize },
VboxAcceptEquip { instance_id: Uuid, group: usize, index: usize, construct_id: Uuid },
VboxDiscard { instance_id: Uuid },
VboxCombine { instance_id: Uuid, indices: Vec<usize> },
VboxCombine { instance_id: Uuid, inv_indices: Vec<usize>, vbox_indices: Vec<Vec<usize>> },
VboxApply { instance_id: Uuid, construct_id: Uuid, index: usize },
VboxUnequip { instance_id: Uuid, construct_id: Uuid, target: Item },
VboxUnequipApply { instance_id: Uuid, construct_id: Uuid, target: Item, target_construct_id: Uuid },
@ -254,8 +254,8 @@ impl Connection {
RpcRequest::VboxApply { instance_id, construct_id, index } =>
Ok(RpcMessage::InstanceState(vbox_apply(&mut tx, account, instance_id, construct_id, index)?)),
RpcRequest::VboxCombine { instance_id, indices } =>
Ok(RpcMessage::InstanceState(vbox_combine(&mut tx, account, instance_id, indices)?)),
RpcRequest::VboxCombine { instance_id, inv_indices, vbox_indices } =>
Ok(RpcMessage::InstanceState(vbox_combine(&mut tx, account, instance_id, inv_indices, vbox_indices)?)),
RpcRequest::VboxDiscard { instance_id } =>
Ok(RpcMessage::InstanceState(vbox_discard(&mut tx, account, instance_id)?)),

29
server/src/vbox.rs
View File

@ -142,19 +142,20 @@ impl Vbox {
Ok(self)
}
pub fn combine(&mut self, mut indices: Vec<usize>) -> Result<&mut Vbox, Error> {
if indices.len() != 3 {
return Err(err_msg("exactly 3 indices required"));
}
if !indices.iter().all(|i| self.bound.get(*i).is_some()) {
pub fn combine(&mut self, mut inv_indices: Vec<usize>, vbox_indicies: Vec<Vec<usize>>) -> Result<&mut Vbox, Error> {
if !inv_indices.iter().all(|i| self.bound.get(*i).is_some()) {
return Err(err_msg("item missing index"));
}
// try to buy up the vbox indicies and add them to the inventory indicies for combining
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
indices.sort_unstable();
let mut input = indices
inv_indices.sort_unstable();
let mut input = inv_indices
.iter()
.enumerate()
.map(|(i, index)| {
@ -170,7 +171,9 @@ impl Vbox {
self.bound.push(combo.item);
// self.bound.sort_unstable();
if self.bound.len() >= 10 {
return Err(err_msg("too many items bound"));
}
Ok(self)
}
}
@ -187,9 +190,9 @@ pub fn vbox_accept(tx: &mut Transaction, account: &Account, instance_id: Uuid, g
return instance_update(tx, instance);
}
pub fn vbox_combine(tx: &mut Transaction, account: &Account, instance_id: Uuid, indices: Vec<usize>) -> Result<Instance, Error> {
pub fn vbox_combine(tx: &mut Transaction, account: &Account, instance_id: Uuid, inv_indices: Vec<usize>, vbox_indices: Vec<Vec<usize>>) -> Result<Instance, Error> {
let instance = instance_get(tx, instance_id)?
.vbox_combine(account.id, indices)?;
.vbox_combine(account.id, inv_indices, vbox_indices)?;
return instance_update(tx, instance);
}
@ -219,7 +222,7 @@ mod tests {
fn combine_test() {
let mut vbox = Vbox::new();
vbox.bound = vec![Item::Attack, Item::Green, Item::Green];
vbox.combine(vec![1,2,0]).unwrap();
vbox.combine(vec![1,2,0], vec![]).unwrap();
assert_eq!(vbox.bound[0], Item::Heal);
}
@ -240,7 +243,7 @@ mod tests {
let mut vbox = Vbox::new();
vbox.bound = vec![Item::Strike];
vbox.reclaim(0).unwrap();
assert_eq!(vbox.bits, 20);
assert_eq!(vbox.bits, 32);
}
#[test]