From a08a05a5753d8a8db0eb91326f49d3b700fb19f7 Mon Sep 17 00:00:00 2001 From: ntr Date: Wed, 3 Apr 2019 22:19:54 +1100 Subject: [PATCH 1/6] log panel --- client/cryps.css | 7 +-- client/src/actions.jsx | 3 ++ client/src/components/cryp.list.component.jsx | 39 ++------------- client/src/components/game.component.jsx | 47 +++++++++++++------ client/src/components/game.container.jsx | 11 +++-- client/src/components/info.component.jsx | 1 + client/src/main.jsx | 1 + client/src/reducers.jsx | 11 +++++ client/src/socket.jsx | 2 +- client/src/utils.jsx | 2 +- 10 files changed, 64 insertions(+), 60 deletions(-) diff --git a/client/cryps.css b/client/cryps.css index acefcd0a..3d2b7fde 100644 --- a/client/cryps.css +++ b/client/cryps.css @@ -153,7 +153,7 @@ header { } .header-username { - letter-spacing: 0.25em; + letter-spacing: 0.05em; font-size: 2em; display: inline; } @@ -485,10 +485,7 @@ header { } .logs { - padding-left: 2em; - display: flex; - flex-flow: row wrap; - flex: 0 0 20%; + flex: 0 0 100%; } .selected-skills { diff --git a/client/src/actions.jsx b/client/src/actions.jsx index d952ba54..40a16475 100644 --- a/client/src/actions.jsx +++ b/client/src/actions.jsx @@ -13,6 +13,9 @@ export const setInstance = value => ({ type: SET_INSTANCE, value }); export const SET_GAME = 'SET_GAME'; export const setGame = value => ({ type: SET_GAME, 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/cryp.list.component.jsx b/client/src/components/cryp.list.component.jsx index fb15834c..867912b8 100644 --- a/client/src/components/cryp.list.component.jsx +++ b/client/src/components/cryp.list.component.jsx @@ -1,9 +1,9 @@ const preact = require('preact'); -const { Component } = require('preact'); const range = require('lodash/range'); const { stringSort } = require('./../utils'); const molecule = require('./molecule'); +const SpawnButton = require('./spawn.button'); const idSort = stringSort('id'); @@ -13,40 +13,6 @@ const COLOURS = [ '#3498db', ]; -class SpawnButton extends Component { - toggle(e) { - this.setState({ enabled: e }); - } - - render({ spawn }, { enabled }) { - let spawnName = null; - return ( -
-
this.toggle(!this.enabled)} > -

+

- spawnName = e.target.value} - /> - -
-
- ); - } -} - function CrypList(args) { const { cryps, @@ -79,6 +45,7 @@ function CrypList(args) { const instanceJoin = ( @@ -113,7 +80,7 @@ function CrypList(args) { : 1; const spawnButtons = range(spawnButtonsNum) - .map(() => sendCrypSpawn(name)} />); + .map(i => sendCrypSpawn(name)} />); return (
diff --git a/client/src/components/game.component.jsx b/client/src/components/game.component.jsx index cb9bc886..c8b8175d 100644 --- a/client/src/components/game.component.jsx +++ b/client/src/components/game.component.jsx @@ -16,11 +16,43 @@ function GamePanel(props) { setActiveSkill, selectSkillTarget, account, + showLog, + toggleLog, quit, } = props; if (!game) return
...
; + const header = ( +
+ +
+
 
+
+ +
+ ); + + if (showLog) { + const logs = game.log.map((l, i) => (
{l}
)).reverse(); + return ( +
+ {header} +
+ {logs} +
+
+ ); + } + function findCryp(id) { const team = game.teams.find(t => t.cryps.find(c => c.id === id)); if (team) return team.cryps.find(c => c.id === id); @@ -166,20 +198,10 @@ function GamePanel(props) { const selectedSkills = playerTeam.cryps.map((c, i) => stackElement(c, i)); - const logs = game.log.map((l, i) => (
{l}
)).reverse(); return (
-
- -
-
 
-
-
+ {header} {PlayerTeam(playerTeam, setActiveSkill)}
{selectedSkills} @@ -187,9 +209,6 @@ function GamePanel(props) {
{otherTeams.map(OpponentTeam)}
-
- {logs} -
); } diff --git a/client/src/components/game.container.jsx b/client/src/components/game.container.jsx index 2691043c..6fc2f45e 100644 --- a/client/src/components/game.container.jsx +++ b/client/src/components/game.container.jsx @@ -11,7 +11,7 @@ const particlesJS = window.particlesJS; const addState = connect( function receiveState(state) { - const { ws, game, account, activeSkill, activeIncoming } = state; + const { ws, game, account, showLog, activeSkill, activeIncoming } = state; function selectSkillTarget(targetCrypId) { if (activeSkill) { @@ -32,7 +32,7 @@ const addState = connect( return false; } - return { game, account, activeSkill, activeIncoming, selectSkillTarget, selectIncomingTarget }; + return { game, showLog, account, activeSkill, activeIncoming, selectSkillTarget, selectIncomingTarget }; }, function receiveDispatch(dispatch) { @@ -49,7 +49,12 @@ const addState = connect( dispatch(actions.setGame(null)); } - return { setActiveSkill, setActiveIncoming, quit }; + function toggleLog(v) { + dispatch(actions.setShowLog(v)); + } + + + return { setActiveSkill, setActiveIncoming, quit, toggleLog }; } ); diff --git a/client/src/components/info.component.jsx b/client/src/components/info.component.jsx index 4eb9db82..532b8369 100644 --- a/client/src/components/info.component.jsx +++ b/client/src/components/info.component.jsx @@ -22,6 +22,7 @@ function Info(args) {
); } + if (info.type === 'cryp') { const stats = [ { stat: 'hp', disp: 'Hp', colour: '#1FF01F' }, diff --git a/client/src/main.jsx b/client/src/main.jsx index 73eb97ad..23c7f507 100644 --- a/client/src/main.jsx +++ b/client/src/main.jsx @@ -21,6 +21,7 @@ const store = createStore( combiner: reducers.combinerReducer, cryps: reducers.crypsReducer, game: reducers.gameReducer, + showLog: reducers.showLogReducer, info: reducers.infoReducer, instance: reducers.instanceReducer, instances: reducers.instancesReducer, diff --git a/client/src/reducers.jsx b/client/src/reducers.jsx index e54c41a1..12eebe8f 100644 --- a/client/src/reducers.jsx +++ b/client/src/reducers.jsx @@ -80,6 +80,16 @@ function gameReducer(state = defaultGame, action) { } } +const defaultShowLog = false; +function showLogReducer(state = defaultShowLog, action) { + switch (action.type) { + case actions.SET_SHOW_LOG: + return action.value; + default: + return state; + } +} + const defaultReclaiming = false; function reclaimingReducer(state = defaultReclaiming, action) { switch (action.type) { @@ -116,6 +126,7 @@ module.exports = { combinerReducer, crypsReducer, gameReducer, + showLogReducer, instanceReducer, instancesReducer, reclaimingReducer, diff --git a/client/src/socket.jsx b/client/src/socket.jsx index bd9583a0..b1499f7c 100644 --- a/client/src/socket.jsx +++ b/client/src/socket.jsx @@ -260,7 +260,7 @@ function createSocket(events) { // if (!account) events.loginPrompt(); if (process.env.NODE_ENV !== 'production') { - send({ method: 'account_login', params: { name: 'grepking', password: 'grepgrepgrep' } }); + send({ method: 'account_login', params: { name: 'ntr', password: 'grepgrepgrep' } }); } return true; diff --git a/client/src/utils.jsx b/client/src/utils.jsx index 2a4cf361..4ea633bf 100644 --- a/client/src/utils.jsx +++ b/client/src/utils.jsx @@ -61,7 +61,7 @@ const STATS = { redDamage: { stat: 'red_damage', colour: 'red', svg: shapes.pentagon }, blueShield: { stat: 'blue_shield', colour: 'blue', svg: shapes.squircle }, blueDamage: { stat: 'blue_damage', colour: 'blue', svg: shapes.circle }, - speed: { stat: 'speed', colour: 'yellow', svg: shapes.triangle }, + speed: { stat: 'speed', colour: '', svg: shapes.triangle }, }; module.exports = { From 3329dc59c2a37b50add46864bda9f2c8e4a8eb04 Mon Sep 17 00:00:00 2001 From: ntr Date: Wed, 3 Apr 2019 23:10:46 +1100 Subject: [PATCH 2/6] fix weird map bug thing in info --- client/src/actions.jsx | 2 +- client/src/components/info.component.jsx | 41 +++++++++++--------- client/src/components/instance.container.jsx | 4 +- 3 files changed, 26 insertions(+), 21 deletions(-) diff --git a/client/src/actions.jsx b/client/src/actions.jsx index 40a16475..9beb8700 100644 --- a/client/src/actions.jsx +++ b/client/src/actions.jsx @@ -29,7 +29,7 @@ export const SET_ACTIVE_SKILL = 'SET_ACTIVE_SKILL'; export const setActiveSkill = (crypId, skill) => ({ type: SET_ACTIVE_SKILL, value: crypId ? { crypId, skill } : null }); export const SET_INFO = 'SET_INFO'; -export const setInfo = (type, value) => ({ type: SET_INFO, value: type ? { type, value } : null }); +export const setInfo = value => ({ type: SET_INFO, value: Array.from(value) }); export const SET_RECLAIMING = 'SET_RECLAIMING'; export const setReclaiming = value => ({ type: SET_RECLAIMING, value }); diff --git a/client/src/components/info.component.jsx b/client/src/components/info.component.jsx index 532b8369..283f6766 100644 --- a/client/src/components/info.component.jsx +++ b/client/src/components/info.component.jsx @@ -8,22 +8,27 @@ function Info(args) { } = args; if (!info) return (
 
); - if (info.type === 'skill') { + console.log(info); + + const [type, value] = info; + + if (type === 'skill') { return (
-
{info.value.skill}
-
{SKILLS[info.value.skill].description}
-
{SKILLS[info.value.skill].upgrades}
+
{value.skill}
+
{SKILLS[value.skill].description}
+
{SKILLS[value.skill].upgrades}
-
); } - if (info.type === 'cryp') { + if (type === 'cryp') { + const cryp = value; const stats = [ { stat: 'hp', disp: 'Hp', colour: '#1FF01F' }, { stat: 'red_shield', disp: 'Red Shield', colour: '#a52a2a' }, @@ -33,32 +38,32 @@ function Info(args) { { stat: 'green_damage', disp: 'Green Damage', colour: '#1FF01F' }, { stat: 'speed', disp: 'Speed', colour: '#FFD123' }, ].map((s, i) => ( -
{s.disp}: {info.value[s.stat].max}
+
{s.disp}: {cryp[s.stat].max}
)); - const skills = info.value.skills.map((s, i) => ); + const skills = cryp.skills.map((s, i) => ); return (
-
{info.value.name}
+
{cryp.name}
{stats} {skills}
); } - /*if (info.item) { - if (SKILLS[info.item]) { - itemDetails = SKILLS[info.item]; - } else if (SPECS[info.item]) { - itemDetails = SPECS[info.item]; - } else if (COLOURS[info.item]) { - itemDetails = COLOURS[info.item]; + /*if (item) { + if (SKILLS[item]) { + itemDetails = SKILLS[item]; + } else if (SPECS[item]) { + itemDetails = SPECS[item]; + } else if (COLOURS[item]) { + itemDetails = COLOURS[item]; } }*/ -/* const unequip = (itemDetails && info.cryp) - ? +/* const unequip = (itemDetails && cryp) + ? : null; */ diff --git a/client/src/components/instance.container.jsx b/client/src/components/instance.container.jsx index 4ae4e971..054c8573 100644 --- a/client/src/components/instance.container.jsx +++ b/client/src/components/instance.container.jsx @@ -24,8 +24,8 @@ const addState = connect( dispatch(actions.setInstance(null)); } - function setInfo(item, cryp) { - dispatch(actions.setInfo(item, cryp)); + function setInfo(item, value) { + dispatch(actions.setInfo([item, value])); } return { quit, setInfo }; From b664396ddf6930df6f9006ec397cae6bb7b2234c Mon Sep 17 00:00:00 2001 From: ntr Date: Wed, 3 Apr 2019 23:15:51 +1100 Subject: [PATCH 3/6] specs in info --- client/src/components/info.component.jsx | 34 +++++++------- client/src/components/spawn.button.jsx | 59 ++++++++++++++++++++++++ client/src/reducers.jsx | 2 +- client/src/socket.jsx | 2 +- 4 files changed, 77 insertions(+), 20 deletions(-) create mode 100644 client/src/components/spawn.button.jsx diff --git a/client/src/components/info.component.jsx b/client/src/components/info.component.jsx index 283f6766..fac21c21 100644 --- a/client/src/components/info.component.jsx +++ b/client/src/components/info.component.jsx @@ -6,9 +6,7 @@ function Info(args) { info, sendUnequip, } = args; - if (!info) return (
 
); - - console.log(info); + if (!info.length) return (
 
); const [type, value] = info; @@ -29,24 +27,24 @@ function Info(args) { if (type === 'cryp') { const cryp = value; - const stats = [ - { stat: 'hp', disp: 'Hp', colour: '#1FF01F' }, - { stat: 'red_shield', disp: 'Red Shield', colour: '#a52a2a' }, - { stat: 'blue_shield', disp: 'Blue Shield', colour: '#3498db' }, - { stat: 'red_damage', disp: 'Red Damage', colour: '#a52a2a' }, - { stat: 'blue_damage', disp: 'Blue Damage', colour: '#3498db' }, - { stat: 'green_damage', disp: 'Green Damage', colour: '#1FF01F' }, - { stat: 'speed', disp: 'Speed', colour: '#FFD123' }, - ].map((s, i) => ( -
{s.disp}: {cryp[s.stat].max}
- )); - const skills = cryp.skills.map((s, i) => ); + const skills = cryp.skills.map((s, i) => + + ); + + const specs = cryp.specs.map((s, i) => + + ); return (
-
{cryp.name}
- {stats} - {skills} +
{cryp.name}
+
+ {skills} +
+
+ {specs} +
+
); } diff --git a/client/src/components/spawn.button.jsx b/client/src/components/spawn.button.jsx new file mode 100644 index 00000000..b81b2e45 --- /dev/null +++ b/client/src/components/spawn.button.jsx @@ -0,0 +1,59 @@ +const preact = require('preact'); +const { Component } = require('preact'); + +class SpawnButton extends Component { + constructor(props) { + super(props); + + this.state = { value: null, enabled: false }; + + this.handleChange = this.handleChange.bind(this); + this.handleSubmit = this.handleSubmit.bind(this); + this.enable = this.enable.bind(this); + } + + handleChange(event) { + this.setState({ value: event.target.value }); + } + + handleSubmit(event) { + event.preventDefault(); + this.props.spawn(this.state.value); + this.setState({ value: null, enabled: false }); + } + + enable() { + this.setState({ enabled: true }); + } + + render() { + return ( +
+
this.enable()} > +

+

+ + +
+
+ ); + } +} + +module.exports = SpawnButton; \ No newline at end of file diff --git a/client/src/reducers.jsx b/client/src/reducers.jsx index 12eebe8f..d48b18ad 100644 --- a/client/src/reducers.jsx +++ b/client/src/reducers.jsx @@ -110,7 +110,7 @@ function wsReducer(state = defaultWs, action) { } } -const defaultInfo = null; +const defaultInfo = []; function infoReducer(state = defaultInfo, action) { switch (action.type) { case actions.SET_INFO: diff --git a/client/src/socket.jsx b/client/src/socket.jsx index b1499f7c..e7f08ba3 100644 --- a/client/src/socket.jsx +++ b/client/src/socket.jsx @@ -95,7 +95,7 @@ function createSocket(events) { function sendVboxUnequip(instanceId, crypId, target) { send({ method: 'player_vbox_unequip', params: { instance_id: instanceId, cryp_id: crypId, target } }); - events.setInfo(null); + events.setInfo([]); } function sendVboxDiscard(instanceId) { From 13cd21c9259853569994bb9e2382fdce8f45d336 Mon Sep 17 00:00:00 2001 From: ntr Date: Wed, 3 Apr 2019 23:44:02 +1100 Subject: [PATCH 4/6] fix vbox not recalculating on spec remove --- client/src/components/instance.component.jsx | 2 +- client/src/events.jsx | 2 ++ client/src/reducers.jsx | 2 +- server/src/vbox.rs | 14 ++++++++++++++ 4 files changed, 18 insertions(+), 2 deletions(-) diff --git a/client/src/components/instance.component.jsx b/client/src/components/instance.component.jsx index e8340934..7c4f2e70 100644 --- a/client/src/components/instance.component.jsx +++ b/client/src/components/instance.component.jsx @@ -72,7 +72,7 @@ function InstanceComponent(args) { if (!instance) return
...
; - const cryps = instance.cryps.map(c => Cryp(c, sendVboxApply, setInfo)); + const cryps = instance.cryps.map((c, i) => Cryp(c, sendVboxApply, setInfo)); return (
diff --git a/client/src/events.jsx b/client/src/events.jsx index cbc3a632..6d178ad7 100644 --- a/client/src/events.jsx +++ b/client/src/events.jsx @@ -54,6 +54,8 @@ function registerEvents(store) { } function setPlayer(v) { + const { instance } = store.getState(); + console.log(instance === v); return store.dispatch(actions.setInstance(v)); } diff --git a/client/src/reducers.jsx b/client/src/reducers.jsx index d48b18ad..ce1f20da 100644 --- a/client/src/reducers.jsx +++ b/client/src/reducers.jsx @@ -44,7 +44,7 @@ const defaultInstance = null; function instanceReducer(state = defaultInstance, action) { switch (action.type) { case actions.SET_INSTANCE: - return action.value; + return Object.assign({}, action.value); default: return state; } diff --git a/server/src/vbox.rs b/server/src/vbox.rs index 26b8e18b..21a9de06 100644 --- a/server/src/vbox.rs +++ b/server/src/vbox.rs @@ -638,6 +638,20 @@ pub fn vbox_unequip(params: VboxUnequipParams, tx: &mut Transaction, account: &A None => return Err(err_msg("var has no effect on cryps")), } + // now the var has been applied + // recalculate the stats of the whole team + let team_colours = player.cryps.iter().fold(Colours::new(), |tc, c| { + Colours { + red: tc.red + c.colours.red, + green: tc.green + c.colours.green, + blue: tc.blue + c.colours.blue + } + }); + + for cryp in player.cryps.iter_mut() { + cryp.apply_modifiers(&team_colours); + } + player.vbox.bound.push(params.target); return player_update(tx, player, false); } From 6ca0ed86f4349dd229797ed895f40daebe8f4079 Mon Sep 17 00:00:00 2001 From: ntr Date: Wed, 3 Apr 2019 23:59:00 +1100 Subject: [PATCH 5/6] info stuff --- client/src/actions.jsx | 2 +- client/src/components/info.component.jsx | 29 ++++++++++++------------ client/src/components/vbox.container.jsx | 2 +- client/src/events.jsx | 6 ++--- client/src/socket.jsx | 2 +- 5 files changed, 20 insertions(+), 21 deletions(-) diff --git a/client/src/actions.jsx b/client/src/actions.jsx index 9beb8700..0c17da7d 100644 --- a/client/src/actions.jsx +++ b/client/src/actions.jsx @@ -29,7 +29,7 @@ export const SET_ACTIVE_SKILL = 'SET_ACTIVE_SKILL'; export const setActiveSkill = (crypId, skill) => ({ type: SET_ACTIVE_SKILL, value: crypId ? { crypId, skill } : null }); export const SET_INFO = 'SET_INFO'; -export const setInfo = value => ({ type: SET_INFO, value: Array.from(value) }); +export const setInfo = value => ({ type: SET_INFO, value }); export const SET_RECLAIMING = 'SET_RECLAIMING'; export const setReclaiming = value => ({ type: SET_RECLAIMING, value }); diff --git a/client/src/components/info.component.jsx b/client/src/components/info.component.jsx index fac21c21..9d3851f5 100644 --- a/client/src/components/info.component.jsx +++ b/client/src/components/info.component.jsx @@ -44,27 +44,26 @@ function Info(args) {
{specs}
- ); } - /*if (item) { - if (SKILLS[item]) { - itemDetails = SKILLS[item]; - } else if (SPECS[item]) { - itemDetails = SPECS[item]; - } else if (COLOURS[item]) { - itemDetails = COLOURS[item]; + if (type === 'item') { + let itemDetails; + if (SKILLS[value]) { + itemDetails = SKILLS[value]; + } else if (SPECS[value]) { + itemDetails = SPECS[value]; + } else if (COLOURS[value]) { + itemDetails = COLOURS[value]; } - }*/ - - -/* const unequip = (itemDetails && cryp) - ? - : null; -*/ + return ( +
+ {itemDetails} +
+ ); + } } module.exports = Info; diff --git a/client/src/components/vbox.container.jsx b/client/src/components/vbox.container.jsx index cbd9a473..943db4f6 100644 --- a/client/src/components/vbox.container.jsx +++ b/client/src/components/vbox.container.jsx @@ -45,7 +45,7 @@ const addState = connect( } function setInfo(type, info) { - return dispatch(actions.setInfo(type, info)); + return dispatch(actions.setInfo([type, info])); } diff --git a/client/src/events.jsx b/client/src/events.jsx index 6d178ad7..800402ba 100644 --- a/client/src/events.jsx +++ b/client/src/events.jsx @@ -32,8 +32,8 @@ function registerEvents(store) { store.dispatch(actions.setActiveSkill(skill)); } - function setInfo(info) { - store.dispatch(actions.setInfo(info)); + function clearInfo(info) { + store.dispatch(actions.setInfo([])); console.log('event clear item'); } @@ -204,7 +204,7 @@ function registerEvents(store) { setCryps, setCrypList, setGame, - setInfo, + clearInfo, setMenu, setPlayer, setInstanceList, diff --git a/client/src/socket.jsx b/client/src/socket.jsx index e7f08ba3..f5fd90d5 100644 --- a/client/src/socket.jsx +++ b/client/src/socket.jsx @@ -95,7 +95,7 @@ function createSocket(events) { function sendVboxUnequip(instanceId, crypId, target) { send({ method: 'player_vbox_unequip', params: { instance_id: instanceId, cryp_id: crypId, target } }); - events.setInfo([]); + events.clearInfo(); } function sendVboxDiscard(instanceId) { From fc97a89ff63767f59c623a9e1a7b5357c4dda153 Mon Sep 17 00:00:00 2001 From: ntr Date: Thu, 4 Apr 2019 00:09:07 +1100 Subject: [PATCH 6/6] focker --- client/src/components/instance.container.jsx | 2 ++ client/src/events.jsx | 2 -- client/src/reducers.jsx | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/client/src/components/instance.container.jsx b/client/src/components/instance.container.jsx index 054c8573..1802b1fc 100644 --- a/client/src/components/instance.container.jsx +++ b/client/src/components/instance.container.jsx @@ -16,6 +16,8 @@ const addState = connect( return ws.sendVboxApply(instance.instance, crypId, i); } + console.log(instance, 'instaince') + return { instance, account, sendInstanceReady, sendVboxApply }; }, diff --git a/client/src/events.jsx b/client/src/events.jsx index 800402ba..e7601def 100644 --- a/client/src/events.jsx +++ b/client/src/events.jsx @@ -54,8 +54,6 @@ function registerEvents(store) { } function setPlayer(v) { - const { instance } = store.getState(); - console.log(instance === v); return store.dispatch(actions.setInstance(v)); } diff --git a/client/src/reducers.jsx b/client/src/reducers.jsx index ce1f20da..d48b18ad 100644 --- a/client/src/reducers.jsx +++ b/client/src/reducers.jsx @@ -44,7 +44,7 @@ const defaultInstance = null; function instanceReducer(state = defaultInstance, action) { switch (action.type) { case actions.SET_INSTANCE: - return Object.assign({}, action.value); + return action.value; default: return state; }