This commit is contained in:
ntr 2019-05-06 19:29:08 +10:00
parent f658290566
commit 87e97d3fba
11 changed files with 73 additions and 44 deletions

View File

@ -7,6 +7,9 @@ export const setCryps = value => ({ type: SET_CRYPS, value });
export const SET_VBOX_INFO = 'SET_VBOX_INFO';
export const setVboxInfo = value => ({ type: SET_VBOX_INFO, value });
export const SET_VBOX_HIDDEN = 'SET_VBOX_HIDDEN';
export const setVboxHidden = value => ({ type: SET_VBOX_HIDDEN, value });
export const SET_INSTANCES = 'SET_INSTANCES';
export const setInstances = value => ({ type: SET_INSTANCES, value });
@ -25,8 +28,8 @@ export const setGame = value => ({ type: SET_GAME, value });
export const SET_RESOLUTION = 'SET_RESOLUTION';
export const setResolution = value => ({ type: SET_RESOLUTION, value });
export const SET_SHOW_ALT = 'SET_SHOW_ALT';
export const setShowAlt = value => ({ type: SET_SHOW_ALT, value });
export const SET_SHOW_LOG = 'SET_SHOW_LOG';
export const setShowLog = value => ({ type: SET_SHOW_LOG, value });
export const SET_COMBINER = 'SET_COMBINER';
export const setCombiner = value => ({ type: SET_COMBINER, value: Array.from(value) });

View File

@ -66,7 +66,7 @@ const addState = connect(
}
function toggleLog(v) {
dispatch(actions.setShowAlt(v));
dispatch(actions.setShowLog(v));
}

View File

@ -7,12 +7,14 @@ const { COLOUR_ICONS, STATS, SPECS, convertVar, crypAvatar } = require('../utils
function Info(args) {
const {
activeCryp,
setActiveCryp,
info,
sendUnequip,
instance,
player,
setInfo,
vboxInfo,
vboxHidden,
} = args;
function CrypVar() {
@ -116,9 +118,11 @@ function Info(args) {
const skills = range(0, 3).map(i => {
const skill = cryp.skills[i];
function skillClick() {
if (!skill) return false;
return setInfo('skill', { skill: skill.skill, cryp });
function skillClick(e) {
if (!skill) setInfo('highlight', 'skill');
else setInfo('skill', { skill: skill.skill, cryp });
e.stopPropagation();
return setActiveCryp(cryp);
}
const s = cryp.skills[i]
@ -229,8 +233,10 @@ function Info(args) {
// ? <h2>game beginning...</h2>
// : null;
const classes = `instance-info ${vboxHidden ? '' : 'hidden'}`;
return (
<div className="instance-info" >
<div className={classes} >
<ScoreBoard />
<CrypInfo />
<Combos />

View File

@ -11,6 +11,7 @@ const addState = connect(
ws,
instance,
vboxInfo,
vboxHidden,
player,
} = state;
@ -25,6 +26,7 @@ const addState = connect(
instance,
player,
vboxInfo,
vboxHidden,
};
},
@ -33,6 +35,10 @@ const addState = connect(
dispatch(actions.setInfo([item, value]));
}
function setActiveCryp(value) {
dispatch(actions.setActiveCryp(value));
}
function setActiveVar(value) {
dispatch(actions.setActiveVar(value));
}
@ -40,6 +46,7 @@ const addState = connect(
return {
setInfo,
setActiveVar,
setActiveCryp,
};
}

View File

@ -10,21 +10,22 @@ function InstanceComponent(args) {
player,
quit,
sendInstanceReady,
showAlt,
toggleAlt,
vboxHidden,
setVboxHidden,
} = args;
if (!instance) return <div>...</div>;
function swapPane(e) {
toggleAlt(!showAlt);
function toggleVbox(e) {
setVboxHidden(!vboxHidden);
e.stopPropagation();
}
const vboxBtn = (
<button
className="instance-btn instance-ui-btn nav-btn left"
onClick={swapPane}>
onClick={toggleVbox}>
vBox
</button>
);
@ -32,12 +33,12 @@ function InstanceComponent(args) {
const teamBtn = (
<button
className="instance-btn instance-ui-btn nav-btn right"
onClick={swapPane}>
onClick={toggleVbox}>
team
</button>
);
const navBtn = showAlt
const navBtn = vboxHidden
? vboxBtn
: teamBtn;

View File

@ -6,7 +6,7 @@ const Instance = require('./instance.component');
const addState = connect(
function receiveState(state) {
const { ws, instance, player, account, activeVar, showAlt } = state;
const { ws, instance, player, account, activeVar, vboxHidden } = state;
function sendInstanceReady() {
return ws.sendInstanceReady(instance.id);
@ -16,7 +16,7 @@ const addState = connect(
return ws.sendVboxApply(instance.id, crypId, i);
}
return { instance, player, account, sendInstanceReady, sendVboxApply, activeVar, showAlt };
return { instance, player, account, sendInstanceReady, sendVboxApply, activeVar, vboxHidden };
},
function receiveDispatch(dispatch) {
@ -28,8 +28,8 @@ const addState = connect(
dispatch(actions.setInfo([item, value]));
}
function toggleAlt(v) {
dispatch(actions.setShowAlt(v));
function setVboxHidden(v) {
dispatch(actions.setVboxHidden(v));
}
function setActiveCryp(value) {
@ -40,7 +40,7 @@ const addState = connect(
return dispatch(actions.setInfo([]));
}
return { quit, clearInfo, setInfo, toggleAlt, setActiveCryp };
return { quit, clearInfo, setInfo, setVboxHidden, setActiveCryp };
}
);

View File

@ -8,7 +8,7 @@ const actions = require('../actions');
const addState = connect(
function receiveState(state) {
const { ws, instance, player, account } = state;
const { ws, instance, player, account, vboxHidden } = state;
function sendInstanceReady() {
return ws.sendInstanceReady(instance.id);
@ -18,7 +18,7 @@ const addState = connect(
return ws.sendVboxApply(instance.id, crypId, i);
}
return { instance, player, account, sendInstanceReady, sendVboxApply };
return { instance, player, account, sendInstanceReady, sendVboxApply, vboxHidden };
},
function receiveDispatch(dispatch) {
@ -147,6 +147,7 @@ function InstanceCryps(props) {
setActiveCryp,
sendVboxApply,
vboxHidden,
} = props;
if (!player) return false;
@ -156,8 +157,9 @@ function InstanceCryps(props) {
cryp: c, sendVboxApply, setInfo, setActiveCryp,
}));
const classes = `cryp-list ${vboxHidden ? '' : 'hidden'}`;
return (
<div className="cryp-list" onClick={() => setActiveCryp(null)}>
<div className={classes} onClick={() => setActiveCryp(null)}>
{cryps}
</div>
);

View File

@ -7,22 +7,22 @@ const { convertVar } = require('./../utils');
function Vbox(args) {
const {
activeVar,
activeCryp,
player,
instance,
info,
vboxInfo,
combiner,
info,
instance,
player,
reclaiming,
sendVboxAccept,
sendVboxApply,
sendVboxCombine,
sendVboxDiscard,
sendVboxReclaim,
sendVboxCombine,
sendVboxApply,
setCombiner,
setReclaiming,
setInfo,
setReclaiming,
vboxHidden,
vboxInfo,
} = args;
if (!player) return false;
@ -111,7 +111,6 @@ function Vbox(args) {
const highlighted = () => {
if (!value || !info[0] || info[0] !== 'highlight') return false;
const v = vboxInfo.vars.find(vi => vi.v === value);
console.log(v);
if (info[1] === 'skill') return v.skill;
if (info[1] === 'spec') return v.spec;
return false;
@ -122,8 +121,6 @@ function Vbox(args) {
return (
<td
key={i}
draggable="true"
onDragStart={e => e.dataTransfer.setData('text', i)}
className={`${highlight ? 'highlight' : ''}`}
onClick={e => boundClick(e, i, highlight) }>
{convertVar(value)}
@ -183,7 +180,7 @@ function Vbox(args) {
return setReclaiming(!reclaiming);
}
const classes = `vbox`;
const classes = `vbox ${vboxHidden ? 'hidden' : ''}`;
const reclaimClass = `instance-btn instance-ui-btn vbox-btn ${reclaiming ? 'reclaiming' : ''}`;
return (

View File

@ -15,6 +15,7 @@ const addState = connect(
activeVar,
activeCryp,
info,
vboxHidden,
vboxInfo,
} = state;
@ -47,6 +48,7 @@ const addState = connect(
activeCryp,
info,
vboxInfo,
vboxHidden,
sendVboxAccept,
sendVboxDiscard,
sendVboxReclaim,

View File

@ -20,22 +20,22 @@ const createStoreWithMiddleware = applyMiddleware(logger)(createStore);
const store = createStoreWithMiddleware(
combineReducers({
account: reducers.accountReducer,
activeSkill: reducers.activeSkillReducer,
activeCryp: reducers.activeCrypReducer,
activeSkill: reducers.activeSkillReducer,
activeVar: reducers.activeVarReducer,
combiner: reducers.combinerReducer,
cryps: reducers.crypsReducer,
game: reducers.gameReducer,
resolution: reducers.resolutionReducer,
showAlt: reducers.showAltReducer,
info: reducers.infoReducer,
vboxInfo: reducers.vboxInfoReducer,
instance: reducers.instanceReducer,
player: reducers.playerReducer,
ping: reducers.pingReducer,
instances: reducers.instancesReducer,
ping: reducers.pingReducer,
player: reducers.playerReducer,
reclaiming: reducers.reclaimingReducer,
resolution: reducers.resolutionReducer,
selectedCryps: reducers.selectedCrypsReducer,
vboxInfo: reducers.vboxInfoReducer,
vboxHidden: reducers.vboxHiddenReducer,
ws: reducers.wsReducer,
})
);

View File

@ -140,10 +140,20 @@ function resolutionReducer(state = defaultResolution, action) {
}
}
const defaultShowAlt = false;
function showAltReducer(state = defaultShowAlt, action) {
const defaultShowLog = false;
function showLogReducer(state = defaultShowLog, action) {
switch (action.type) {
case actions.SET_SHOW_ALT:
case actions.SET_SHOW_LOG:
return action.value;
default:
return state;
}
}
const defaultVboxHidden = false;
function vboxHiddenReducer(state = defaultVboxHidden, action) {
switch (action.type) {
case actions.SET_VBOX_HIDDEN:
return action.value;
default:
return state;
@ -188,7 +198,8 @@ module.exports = {
combinerReducer,
crypsReducer,
gameReducer,
showAltReducer,
showLogReducer,
vboxHiddenReducer,
instanceReducer,
instancesReducer,
playerReducer,