From f658290566f0b4f34744692f188f7b494a72b619 Mon Sep 17 00:00:00 2001 From: ntr Date: Mon, 6 May 2019 18:58:38 +1000 Subject: [PATCH] wip --- client/src/actions.jsx | 4 +- client/src/components/game.component.jsx | 8 ++-- client/src/components/game.container.jsx | 6 +-- client/src/components/info.container.jsx | 1 - client/src/components/instance.component.jsx | 25 +++-------- client/src/components/instance.container.jsx | 10 ++--- client/src/components/instance.cryps.jsx | 46 +++----------------- client/src/main.jsx | 2 +- client/src/reducers.jsx | 8 ++-- 9 files changed, 33 insertions(+), 77 deletions(-) diff --git a/client/src/actions.jsx b/client/src/actions.jsx index 0ed25f3e..cf4690cc 100644 --- a/client/src/actions.jsx +++ b/client/src/actions.jsx @@ -25,8 +25,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_LOG = 'SET_SHOW_LOG'; -export const setShowLog = value => ({ type: SET_SHOW_LOG, value }); +export const SET_SHOW_ALT = 'SET_SHOW_ALT'; +export const setShowAlt = value => ({ type: SET_SHOW_ALT, 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.component.jsx b/client/src/components/game.component.jsx index 74c1aa15..f44a447a 100644 --- a/client/src/components/game.component.jsx +++ b/client/src/components/game.component.jsx @@ -21,20 +21,20 @@ function GamePanel(props) { sendGameReady, activeCryp, account, - showLog, + showAlt, toggleLog, quit, } = props; if (!game) return
...
; - if (showLog) { + if (showAlt) { const logs = game.log.map((l, i) => (
{l}
)).reverse(); return (
@@ -62,7 +62,7 @@ function GamePanel(props) {
diff --git a/client/src/components/game.container.jsx b/client/src/components/game.container.jsx index 473782f5..bb1eee2d 100644 --- a/client/src/components/game.container.jsx +++ b/client/src/components/game.container.jsx @@ -11,7 +11,7 @@ const addState = connect( game, account, resolution, - showLog, + showAlt, activeSkill, activeCryp, } = state; @@ -39,7 +39,7 @@ const addState = connect( return { game, - showLog, + showAlt, account, resolution, activeSkill, @@ -66,7 +66,7 @@ const addState = connect( } function toggleLog(v) { - dispatch(actions.setShowLog(v)); + dispatch(actions.setShowAlt(v)); } diff --git a/client/src/components/info.container.jsx b/client/src/components/info.container.jsx index e30110ef..cf540930 100644 --- a/client/src/components/info.container.jsx +++ b/client/src/components/info.container.jsx @@ -37,7 +37,6 @@ const addState = connect( dispatch(actions.setActiveVar(value)); } - return { setInfo, setActiveVar, diff --git a/client/src/components/instance.component.jsx b/client/src/components/instance.component.jsx index ebc57b18..f1335704 100644 --- a/client/src/components/instance.component.jsx +++ b/client/src/components/instance.component.jsx @@ -9,31 +9,22 @@ function InstanceComponent(args) { instance, player, quit, - // clearInfo, sendInstanceReady, - activeVar, - activeCryp, - setActiveVar, - setActiveCryp, + showAlt, + toggleAlt, } = args; if (!instance) return
...
; - function showVbox(e) { - setActiveVar(null); - setActiveCryp(null); - e.stopPropagation(); - } - - function showTeam(e) { - setActiveCryp(player.cryps[0]); + function swapPane(e) { + toggleAlt(!showAlt); e.stopPropagation(); } const vboxBtn = ( ); @@ -41,14 +32,12 @@ function InstanceComponent(args) { const teamBtn = ( ); - const infoSelected = activeVar !== null || activeCryp; - - const navBtn = infoSelected + const navBtn = showAlt ? vboxBtn : teamBtn; diff --git a/client/src/components/instance.container.jsx b/client/src/components/instance.container.jsx index efa889fd..1d39e014 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, activeCryp } = state; + const { ws, instance, player, account, activeVar, showAlt } = 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, activeCryp }; + return { instance, player, account, sendInstanceReady, sendVboxApply, activeVar, showAlt }; }, function receiveDispatch(dispatch) { @@ -28,8 +28,8 @@ const addState = connect( dispatch(actions.setInfo([item, value])); } - function setActiveVar(value) { - dispatch(actions.setActiveVar(value)); + function toggleAlt(v) { + dispatch(actions.setShowAlt(v)); } function setActiveCryp(value) { @@ -40,7 +40,7 @@ const addState = connect( return dispatch(actions.setInfo([])); } - return { quit, clearInfo, setInfo, setActiveVar, setActiveCryp }; + return { quit, clearInfo, setInfo, toggleAlt, setActiveCryp }; } ); diff --git a/client/src/components/instance.cryps.jsx b/client/src/components/instance.cryps.jsx index a785baba..d2568b66 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, activeVar, activeCryp } = state; + const { ws, instance, player, account } = 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, activeVar, activeCryp }; + return { instance, player, account, sendInstanceReady, sendVboxApply }; }, function receiveDispatch(dispatch) { @@ -30,10 +30,6 @@ const addState = connect( dispatch(actions.setInfo([item, value])); } - function setActiveVar(value) { - dispatch(actions.setActiveVar(value)); - } - function setActiveCryp(value) { dispatch(actions.setActiveCryp(value)); } @@ -42,7 +38,7 @@ const addState = connect( return dispatch(actions.setInfo([])); } - return { quit, clearInfo, setInfo, setActiveVar, setActiveCryp }; + return { quit, clearInfo, setInfo, setActiveCryp }; } ); @@ -50,9 +46,7 @@ const addState = connect( function Cryp(props) { const { cryp, - sendVboxApply, setInfo, - activeVar, setActiveCryp, } = props; @@ -73,25 +67,9 @@ function Cryp(props) { return ; }); - // needed for ondrop to fire - function onDragOver(e) { - e.preventDefault(); - return false; - } - - function onDrop(e) { - e.stopPropagation(); - e.preventDefault(); - const item = parseInt(e.dataTransfer.getData('text'), 10); - return sendVboxApply(cryp.id, item); - } - function onClick(e) { e.stopPropagation(); e.preventDefault(); - - if (activeVar !== null) return sendVboxApply(cryp.id, activeVar); - setInfo(null); return setActiveCryp(cryp); } @@ -101,7 +79,7 @@ function Cryp(props) { function blankSpecClick(e) { e.stopPropagation(); setActiveCryp(cryp); - setInfo('highlight', 'spec') + setInfo('highlight', 'spec'); } if (!s) { @@ -142,12 +120,7 @@ function Cryp(props) { // const border = { border: `${thickness(cTotal)}px solid rgba(${colours.red}, ${colours.green}, ${colours.blue}, ${alpha})` }; return ( -
+
{crypAvatar(cryp.name)} @@ -168,8 +141,6 @@ function InstanceCryps(props) { const { player, instance, - activeCryp, - activeVar, // clearInfo, setInfo, @@ -181,15 +152,12 @@ function InstanceCryps(props) { if (!player) return false; if (instance.phase === 'Lobby') return false; - const infoSelected = activeVar !== null || activeCryp; - const crypListClass = `cryp-list`; - const cryps = player.cryps.map((c, i) => Cryp({ - cryp: c, sendVboxApply, setInfo, activeVar, setActiveCryp, + cryp: c, sendVboxApply, setInfo, setActiveCryp, })); return ( -
setActiveCryp(null)}> +
setActiveCryp(null)}> {cryps}
); diff --git a/client/src/main.jsx b/client/src/main.jsx index 22cf3550..e9bde943 100644 --- a/client/src/main.jsx +++ b/client/src/main.jsx @@ -27,7 +27,7 @@ const store = createStoreWithMiddleware( cryps: reducers.crypsReducer, game: reducers.gameReducer, resolution: reducers.resolutionReducer, - showLog: reducers.showLogReducer, + showAlt: reducers.showAltReducer, info: reducers.infoReducer, vboxInfo: reducers.vboxInfoReducer, instance: reducers.instanceReducer, diff --git a/client/src/reducers.jsx b/client/src/reducers.jsx index c9c69a70..a0a6831f 100644 --- a/client/src/reducers.jsx +++ b/client/src/reducers.jsx @@ -140,10 +140,10 @@ function resolutionReducer(state = defaultResolution, action) { } } -const defaultShowLog = false; -function showLogReducer(state = defaultShowLog, action) { +const defaultShowAlt = false; +function showAltReducer(state = defaultShowAlt, action) { switch (action.type) { - case actions.SET_SHOW_LOG: + case actions.SET_SHOW_ALT: return action.value; default: return state; @@ -188,7 +188,7 @@ module.exports = { combinerReducer, crypsReducer, gameReducer, - showLogReducer, + showAltReducer, instanceReducer, instancesReducer, playerReducer,