From 87e97d3fbac5be2eb2460fcc127a16f4ba20bf15 Mon Sep 17 00:00:00 2001 From: ntr Date: Mon, 6 May 2019 19:29:08 +1000 Subject: [PATCH] wip --- client/src/actions.jsx | 7 +++++-- client/src/components/game.container.jsx | 2 +- client/src/components/info.component.jsx | 14 +++++++++---- client/src/components/info.container.jsx | 7 +++++++ client/src/components/instance.component.jsx | 15 +++++++------- client/src/components/instance.container.jsx | 10 +++++----- client/src/components/instance.cryps.jsx | 8 +++++--- client/src/components/vbox.component.jsx | 21 +++++++++----------- client/src/components/vbox.container.jsx | 2 ++ client/src/main.jsx | 12 +++++------ client/src/reducers.jsx | 19 ++++++++++++++---- 11 files changed, 73 insertions(+), 44 deletions(-) diff --git a/client/src/actions.jsx b/client/src/actions.jsx index cf4690cc..2fd7138f 100644 --- a/client/src/actions.jsx +++ b/client/src/actions.jsx @@ -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) }); diff --git a/client/src/components/game.container.jsx b/client/src/components/game.container.jsx index bb1eee2d..bed2a16f 100644 --- a/client/src/components/game.container.jsx +++ b/client/src/components/game.container.jsx @@ -66,7 +66,7 @@ const addState = connect( } function toggleLog(v) { - dispatch(actions.setShowAlt(v)); + dispatch(actions.setShowLog(v)); } diff --git a/client/src/components/info.component.jsx b/client/src/components/info.component.jsx index b2f3259c..6d6f7ab5 100644 --- a/client/src/components/info.component.jsx +++ b/client/src/components/info.component.jsx @@ -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) { // ?

game beginning...

// : null; + const classes = `instance-info ${vboxHidden ? '' : 'hidden'}`; + return ( -
+
diff --git a/client/src/components/info.container.jsx b/client/src/components/info.container.jsx index cf540930..c0a8da80 100644 --- a/client/src/components/info.container.jsx +++ b/client/src/components/info.container.jsx @@ -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, }; } diff --git a/client/src/components/instance.component.jsx b/client/src/components/instance.component.jsx index f1335704..7632d7ac 100644 --- a/client/src/components/instance.component.jsx +++ b/client/src/components/instance.component.jsx @@ -10,21 +10,22 @@ function InstanceComponent(args) { player, quit, sendInstanceReady, - showAlt, - toggleAlt, + + vboxHidden, + setVboxHidden, } = args; if (!instance) return
...
; - function swapPane(e) { - toggleAlt(!showAlt); + function toggleVbox(e) { + setVboxHidden(!vboxHidden); e.stopPropagation(); } const vboxBtn = ( ); @@ -32,12 +33,12 @@ function InstanceComponent(args) { const teamBtn = ( ); - const navBtn = showAlt + const navBtn = vboxHidden ? vboxBtn : teamBtn; diff --git a/client/src/components/instance.container.jsx b/client/src/components/instance.container.jsx index 1d39e014..d7e32140 100644 --- a/client/src/components/instance.container.jsx +++ b/client/src/components/instance.container.jsx @@ -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 }; } ); diff --git a/client/src/components/instance.cryps.jsx b/client/src/components/instance.cryps.jsx index d2568b66..4a29dc61 100644 --- a/client/src/components/instance.cryps.jsx +++ b/client/src/components/instance.cryps.jsx @@ -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 ( -
setActiveCryp(null)}> +
setActiveCryp(null)}> {cryps}
); diff --git a/client/src/components/vbox.component.jsx b/client/src/components/vbox.component.jsx index f982e129..6f29bb49 100644 --- a/client/src/components/vbox.component.jsx +++ b/client/src/components/vbox.component.jsx @@ -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 ( 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 ( diff --git a/client/src/components/vbox.container.jsx b/client/src/components/vbox.container.jsx index a6a6bb39..53425f86 100644 --- a/client/src/components/vbox.container.jsx +++ b/client/src/components/vbox.container.jsx @@ -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, diff --git a/client/src/main.jsx b/client/src/main.jsx index e9bde943..45a443f0 100644 --- a/client/src/main.jsx +++ b/client/src/main.jsx @@ -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, }) ); diff --git a/client/src/reducers.jsx b/client/src/reducers.jsx index a0a6831f..b2e6f373 100644 --- a/client/src/reducers.jsx +++ b/client/src/reducers.jsx @@ -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,