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

Combine vboxselect and combiner. Remove itemEquip and dblclick.

Browse Source
This commit is contained in:
Mashy 2019-11-20 13:24:57 +10:00
parent 10d3f821e3
commit e35c688cff
10 changed files with 43 additions and 96 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
client/src/actions.jsx
View File

@ -30,7 +30,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 });

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

@ -37,7 +37,6 @@ const addState = connect(
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'));

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

@ -36,7 +36,6 @@ const addState = connect(
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));

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

@ -29,10 +29,9 @@ 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({ vbox: [], combiner: [] }));
return true;
}

57
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][0], vboxSelected[0][1], constructId);
return ws.sendVboxAcceptEquip(instance.id, vboxSelected.vbox[0][0], vboxSelected.vbox[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,17 +59,13 @@ const addState = connect(
dispatch(actions.setInfo(item));
}
function setItemEquip(v) {
return dispatch(actions.setItemEquip(v));
}
function setItemUnequip(v) {
dispatch(actions.setVboxSelected([]));
dispatch(actions.setVboxSelected({ vbox: [], combiner: [] }));
dispatch(actions.setCombiner([]));
return dispatch(actions.setItemUnequip(v));
}
return { quit, setInfo, setItemUnequip, setItemEquip };
return { quit, setInfo, setItemUnequip };
}
);
@ -86,7 +75,6 @@ function Construct(props) {
// Changing state variables
construct,
iter,
itemEquip,
itemUnequip,
instance,
player,
@ -98,13 +86,16 @@ function Construct(props) {
sendVboxApply,
sendVboxAcceptEquip,
sendVboxUnequipApply,
sendUnequip,
setItemUnequip,
setItemEquip,
setInfo,
} = props;
const { vbox } = player;
const itemEquip = vboxSelected.vbox.length === 0 && vboxSelected.combiner.length === 1
? vboxSelected.combiner[0]
: -1;
const duplicateSkill = construct.skills.length !== 0 && construct.skills.every(sk => {
if (!itemEquip && itemEquip !== 0) return false;
if (!sk) return false;
@ -115,17 +106,16 @@ function Construct(props) {
e.stopPropagation();
e.preventDefault();
if (duplicateSkill || tutorialDisableEquip) return true;
if (itemEquip !== null) return sendVboxApply(construct.id, itemEquip);
if (vboxSelected.length === 1) return sendVboxAcceptEquip(construct.id);
if (itemEquip !== -1) return sendVboxApply(construct.id, itemEquip);
if (vboxSelected.vbox.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.length || itemEquip > -1) return false;
if (vboxSelected.vbox.length || itemEquip > -1) return false;
return setInfo(info);
}
@ -145,15 +135,6 @@ function Construct(props) {
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 = () => {
@ -176,7 +157,6 @@ function Construct(props) {
disabled={!skill && !equipping}
class={classes}
onClick={skillClick}
onDblClick={skillDblClick}
onMouseOver={e => hoverInfo(e, skill && skill.skill)} >
{s}
</button>
@ -202,13 +182,6 @@ function Construct(props) {
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 => {
@ -219,7 +192,6 @@ function Construct(props) {
key={i}
class={`${highlight ? 'highlight' : ''}`}
onClick={specClick}
onDblClick={specDblClick}
onMouseOver={e => hoverInfo(e, s)} >
{shapes[s]()}
</button>
@ -263,7 +235,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
@ -276,7 +247,6 @@ class InstanceConstructs extends preact.Component {
render(props) {
const {
// Changing state variables
itemEquip,
itemUnequip,
instance,
player,
@ -291,8 +261,6 @@ class InstanceConstructs extends preact.Component {
sendVboxUnequipApply,
setVboxHighlight,
setItemUnequip,
setItemEquip,
sendUnequip,
} = props;
if (!player) return false;
@ -305,11 +273,9 @@ class InstanceConstructs extends preact.Component {
return Construct({
iter: i,
construct: player.constructs[i],
itemEquip,
itemUnequip,
instance,
setItemUnequip,
setItemEquip,
player,
sendVboxApply,
sendVboxAcceptEquip,
@ -317,7 +283,6 @@ class InstanceConstructs extends preact.Component {
setInfo,
itemInfo,
setVboxHighlight,
sendUnequip,
vboxSelected,
tutorial,
});

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

@ -37,7 +37,6 @@ const addState = connect(
dispatch(actions.setReclaiming(false));
dispatch(actions.setActiveSkill(null));
dispatch(actions.setInfo(null));
dispatch(actions.setItemEquip(null));
dispatch(actions.setItemUnequip([]));
dispatch(actions.setVboxHighlight([]));

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

@ -33,7 +33,7 @@ const addState = connect(
}
function sendVboxCombine() {
return ws.sendVboxCombine(instance.id, combiner, vboxSelected);
return ws.sendVboxCombine(instance.id, vboxSelected.combiner, vboxSelected.vbox);
}
function sendVboxReclaim(i) {
@ -70,7 +70,7 @@ const addState = connect(
function setReclaiming(v) {
dispatch(actions.setItemUnequip([]));
dispatch(actions.setCombiner([]));
dispatch(actions.setVboxSelected([]));
dispatch(actions.setVboxSelected({ vbox: [], combiner: [] }));
return dispatch(actions.setReclaiming(v));
}
@ -80,19 +80,15 @@ 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,
};
}
@ -114,7 +110,6 @@ class Vbox extends preact.Component {
render(args) {
const {
// Changing state variables
combiner,
itemUnequip,
player,
reclaiming,
@ -131,26 +126,17 @@ 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 { combiner } = vboxSelected;
const vboxSelecting = vboxSelected.vbox.length;
function combinerChange(newCombiner) {
setCombiner(newCombiner);
if (newCombiner.length === 1) {
setItemEquip(newCombiner[0]);
} else {
setItemEquip(null);
}
return true;
return setVboxSelected({ vbox: vboxSelected.vbox, combiner: newCombiner });
}
//
@ -159,7 +145,7 @@ class Vbox extends preact.Component {
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 (vboxSelected.vbox[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 (base || base === 0) return true;
@ -170,36 +156,26 @@ class Vbox extends preact.Component {
}
function clearVboxSelected() {
setVboxSelected([]);
setVboxSelected({ vbox: [], combiner });
}
function vboxBuySelected() {
if (!vboxSelecting) return false;
document.activeElement.blur();
clearVboxSelected();
sendVboxAccept(vboxSelected[0][0], vboxSelected[0][1]);
sendVboxAccept(vboxSelected.vbox[0][0], vboxSelected.vbox[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.length && vboxSelected.some(vs => vs[0] === group && vs[1] === index);
const selected = vboxSelected.vbox.length && vboxSelected.vbox.some(vs => vs[0] === group && vs[1] === index);
// state not yet set in double click handler
function onDblClick(e) {
/*function onDblClick(e) {
clearVboxSelected();
sendVboxAccept(group, index);
e.stopPropagation();
}
function onClick(e) {
e.stopPropagation();
setItemEquip(null);
setInfo(vbox.free[group][index]);
if (vboxSelected.length && vboxSelected.some(vs => vs[0] === group && vs[1] === index)) {
return setVboxSelected(vboxSelected.filter(vs => !(vs[0] === group && vs[1] === index)));
}
return setVboxSelected([...vboxSelected, [group, index]]);
}
}*/
const combinerItems = combiner.map(j => vbox.bound[j]);
const combinerCount = countBy(combinerItems, co => co);
@ -216,6 +192,21 @@ class Vbox extends preact.Component {
} return false;
}) ? 'combo-border' : '';
function onClick(e) {
e.stopPropagation();
setInfo(vbox.free[group][index]);
if (vboxSelected.vbox.length && vboxSelected.vbox.some(vs => vs[0] === group && vs[1] === index)) {
return setVboxSelected({ vbox: vboxSelected.vbox.filter(vs => !(vs[0] === group && vs[1] === index)), combiner });
}
if (!vboxSelected.vbox.length && !combiner.length) return setVboxSelected({ vbox: [[group, index]], combiner });
if (comboHighlight !== 'combo-border') {
return setVboxSelected({ vbox: [[group, index]], combiner: [] });
}
return setVboxSelected({ vbox: [...vboxSelected.vbox, [group, index]], combiner });
}
const classes = `${v.toLowerCase()} ${selected ? 'highlight' : ''} ${comboHighlight}`;
const vboxObject = shapes[v] ? shapes[v]() : v;
@ -231,7 +222,6 @@ class Vbox extends preact.Component {
onMouseOver={e => vboxHover(e, v)}
onMouseDown={onClick}
onClick={e => e.stopPropagation()}
onDblClick={onDblClick}
> {vboxObject}
</button>
</label>
@ -439,7 +429,7 @@ class Vbox extends preact.Component {
function hoverInfo(e, newInfo) {
e.stopPropagation();
if (vboxSelected[0]) return true;
if (vboxSelected.vbox[0]) return true;
if (combiner.length !== 0) {
const base = combiner.find(c => !['Red', 'Blue', 'Green'].includes(vbox.bound[c]));
if (base || base === 0) return true;

3
client/src/events.jsx
View File

@ -188,10 +188,9 @@ function registerEvents(store) {
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({ vbox: [], combiner: [] }));
}
function setAccountInstances(v) {

3
client/src/keyboard.jsx
View File

@ -10,10 +10,9 @@ function setupKeys(store) {
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({ vbox: [], combiner: [] })));
key('esc', () => store.dispatch(actions.setMtxActive(null)));
}

3
client/src/reducers.jsx
View File

@ -39,7 +39,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 +58,7 @@ module.exports = {
tutorial: createReducer(1, 'SET_TUTORIAL'),
tutorialGame: createReducer(1, 'SET_TUTORIAL_GAME'),
vboxSelected: createReducer([], 'SET_VBOX_SELECTED'),
vboxSelected: createReducer({ vbox: [], combiner: [] }, 'SET_VBOX_SELECTED'),
ws: createReducer(null, 'SET_WS'),
};