From 2d16c8c91a96284b55fa2f519abe26885b102dbc Mon Sep 17 00:00:00 2001 From: Mashy Date: Thu, 12 Sep 2019 13:25:11 +1000 Subject: [PATCH 1/7] item base components for combo items --- client/src/components/info.component.jsx | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/client/src/components/info.component.jsx b/client/src/components/info.component.jsx index 5f7c262f..9b0d1c6d 100644 --- a/client/src/components/info.component.jsx +++ b/client/src/components/info.component.jsx @@ -40,11 +40,18 @@ function InfoComponent(args) { if (isSkill) { const regEx = /(RedPower|BluePower|GreenPower|RedLife|BlueLife|GreenLife|SpeedStat)/; const infoDescription = reactStringReplace(fullInfo.description, regEx, match => shapes[match]()); + const itemSource = itemInfo.combos.filter(c => c.item === info); + const itemSourceInfo = itemSource.length + ? `${itemSource[0].components[0]} ${itemSource[0].components[1]} ${itemSource[0].components[2]}` + : false; + const itemRegEx = /(Red|Blue|Green)/; + const itemSourceDescription = reactStringReplace(itemSourceInfo, itemRegEx, match => shapes[match]()); return (

{fullInfo.item}

SKILL

+ {itemSourceDescription}
{infoDescription}
); @@ -135,11 +142,18 @@ function InfoComponent(args) { }); const regEx = /(RedPower|BluePower|GreenPower|RedLife|BlueLife|GreenLife|SpeedStat)/; const infoDescription = reactStringReplace(fullInfo.description, regEx, match => shapes[match]()); + const itemSource = itemInfo.combos.filter(c => c.item === info); + const itemSourceInfo = itemSource.length + ? `${itemSource[0].components[0]} ${itemSource[0].components[1]} ${itemSource[0].components[2]}` + : false; + const itemRegEx = /(Red|Blue|Green)/; + const itemSourceDescription = reactStringReplace(itemSourceInfo, itemRegEx, match => shapes[match]()); return (

{info}

SPEC

+ {itemSourceDescription}
{infoDescription}
{thresholds} From e8e63e09435df6b81cd1030cb0e9a8074fc1db4f Mon Sep 17 00:00:00 2001 From: Mashy Date: Thu, 12 Sep 2019 14:05:36 +1000 Subject: [PATCH 2/7] confirm abandon --- client/assets/styles/controls.less | 15 +++++ client/src/components/player.box.jsx | 95 +++++++++++++++++----------- 2 files changed, 74 insertions(+), 36 deletions(-) diff --git a/client/assets/styles/controls.less b/client/assets/styles/controls.less index 4484d720..2410322e 100644 --- a/client/assets/styles/controls.less +++ b/client/assets/styles/controls.less @@ -1,3 +1,5 @@ +@import 'colours.less'; + aside { grid-area: ctrl; display: grid; @@ -93,3 +95,16 @@ aside { .team-page-ctrl h2 { padding: 0 0.75em 0 0.75em; } + +.abandon { + &:hover { + color: @red; + border-color: @red; + }; + + &:active, &.confirming { + background: @red; + color: black; + border: 1px solid black; + } +} \ No newline at end of file diff --git a/client/src/components/player.box.jsx b/client/src/components/player.box.jsx index 7ecc2fb1..a769d90f 100644 --- a/client/src/components/player.box.jsx +++ b/client/src/components/player.box.jsx @@ -1,4 +1,5 @@ const preact = require('preact'); +const { Component } = require('preact') const { connect } = require('preact-redux'); const addState = connect( @@ -8,52 +9,74 @@ const addState = connect( } ); -function Scoreboard(args) { - const { - abandon, - animating, - isPlayer, - player, - isGame, - clear, - } = args; - const scoreText = () => { - if (player.score === 'Zero') return '▫▫▫▫'; - if (player.score === 'One') return '■▫▫▫'; - if (player.score === 'Two') return '■■▫▫'; - if (player.score === 'Three') return '■■■▫'; - if (player.score === 'Adv') return '■■■+'; - if (player.score === 'Win') return '■■■■'; - return ''; - }; +class Scoreboard extends Component { + constructor(props) { + super(props); + this.state = { + abandonState: false, + }; + } - if (!isPlayer) { + render(args, state) { + const { + abandon, + animating, + isPlayer, + player, + isGame, + clear, + } = args; + + const { abandonState } = state; + + const scoreText = () => { + if (player.score === 'Zero') return '▫▫▫▫'; + if (player.score === 'One') return '■▫▫▫'; + if (player.score === 'Two') return '■■▫▫'; + if (player.score === 'Three') return '■■■▫'; + if (player.score === 'Adv') return '■■■+'; + if (player.score === 'Win') return '■■■■'; + return ''; + }; + + const divClick = e => { + e.stopPropagation(); + return this.setState({ abandonState: false }); + }; + const abandonStateTrue = e => { + e.stopPropagation(); + this.setState({ abandonState: true }); + }; + + if (!isPlayer) { + return ( +
+
 
+
{scoreText()}
+
+
{player.name}
+
+
+ ); + } + const abandonClasses = `abandon ${abandonState ? 'confirming' : ''}`; + const abandonAction = abandonState ? abandon : abandonStateTrue; return ( -
-
 
+
{scoreText()}
{player.name}
+
+ {(isPlayer && isGame) ? : null} +
+
+ {(abandon) ? : null} +
); } - - return ( -
-
{scoreText()}
-
-
{player.name}
-
-
- {(isPlayer && isGame) ? : null} -
-
- {(abandon) ? : null} -
-
- ); } module.exports = addState(Scoreboard); From 075880d5a75b46c582dd269f729783bae916ea94 Mon Sep 17 00:00:00 2001 From: Mashy Date: Thu, 12 Sep 2019 14:25:52 +1000 Subject: [PATCH 3/7] fix slay bug --- client/src/components/anims/slay.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/client/src/components/anims/slay.jsx b/client/src/components/anims/slay.jsx index c1624a62..ef862a2f 100644 --- a/client/src/components/anims/slay.jsx +++ b/client/src/components/anims/slay.jsx @@ -91,7 +91,7 @@ class Slay extends Component { }); anime.set('#slay', { - translateY: (window.screen.height) * 0.35 * this.props.direction.y, + translateY: -1 * (window.screen.height) * 0.35, translateX: 0, }); anime.set('#explosion feDisplacementMap', { From c82fb404d14dc3f98d6e0b965ae3c003693690ca Mon Sep 17 00:00:00 2001 From: Mashy Date: Thu, 12 Sep 2019 15:24:16 +1000 Subject: [PATCH 4/7] request account state when instance finished, remove account instances from socket --- client/src/components/collection.jsx | 2 +- client/src/components/main.jsx | 5 +++-- client/src/events.jsx | 8 ++++++-- client/src/socket.jsx | 6 +++--- 4 files changed, 13 insertions(+), 8 deletions(-) diff --git a/client/src/components/collection.jsx b/client/src/components/collection.jsx index c6441803..8a598b8a 100644 --- a/client/src/components/collection.jsx +++ b/client/src/components/collection.jsx @@ -56,7 +56,7 @@ function Collection(args) { teamSelect[insert] = id; return setTeam(teamSelect); } - console.log(constructs.length); + const dispConstructs = constructs.length >= ((teamPage + 1) * 6) ? constructs.slice(teamPage * 6, (teamPage + 1) * 6) : constructs.slice(teamPage * 6, constructs.length); diff --git a/client/src/components/main.jsx b/client/src/components/main.jsx index 8441782e..c312849d 100644 --- a/client/src/components/main.jsx +++ b/client/src/components/main.jsx @@ -11,8 +11,8 @@ const Bottom = require('./main.bottom'); const addState = connect( state => { - const { game, instance, account, nav } = state; - return { game, instance, account, nav }; + const { game, instance, account, nav, ws } = state; + return { game, instance, account, nav, ws }; } ); @@ -22,6 +22,7 @@ function Main(props) { instance, account, nav, + ws, } = props; if (!account) { diff --git a/client/src/events.jsx b/client/src/events.jsx index f2e5d498..e17c7bff 100644 --- a/client/src/events.jsx +++ b/client/src/events.jsx @@ -169,7 +169,7 @@ function registerEvents(store) { } function setInstance(v) { - const { account, instance } = store.getState(); + const { account, instance, ws } = store.getState(); if (v) { const player = v.players.find(p => p.id === account.id); store.dispatch(actions.setPlayer(player)); @@ -180,7 +180,11 @@ function registerEvents(store) { store.dispatch(actions.setActiveConstruct(first)); } } - if (v.phase === 'Finished') setGame(null); + if (v.phase === 'Finished') { + setGame(null); + ws.sendAccountState(); + } + return store.dispatch(actions.setInstance(v)); } diff --git a/client/src/socket.jsx b/client/src/socket.jsx index a6a97162..dd6049aa 100644 --- a/client/src/socket.jsx +++ b/client/src/socket.jsx @@ -43,8 +43,8 @@ function createSocket(events) { send(['AccountConstructs', {}]); } - function sendAccountInstances() { - send(['AccountInstances', {}]); + function sendAccountState() { + send(['AccountState', {}]); } function sendAccountSetTeam(ids) { @@ -323,7 +323,7 @@ function createSocket(events) { return { sendAccountConstructs, - sendAccountInstances, + sendAccountState, sendAccountSetTeam, From 58fa6a573432906d771b457ddce476a31b1b9c48 Mon Sep 17 00:00:00 2001 From: Mashy Date: Thu, 12 Sep 2019 15:32:57 +1000 Subject: [PATCH 5/7] actually requesting account instances when game end --- client/src/events.jsx | 2 +- client/src/socket.jsx | 6 +++--- server/src/rpc.rs | 4 +++- 3 files changed, 7 insertions(+), 5 deletions(-) diff --git a/client/src/events.jsx b/client/src/events.jsx index e17c7bff..242e2888 100644 --- a/client/src/events.jsx +++ b/client/src/events.jsx @@ -182,7 +182,7 @@ function registerEvents(store) { } if (v.phase === 'Finished') { setGame(null); - ws.sendAccountState(); + ws.sendAccountInstances(); } return store.dispatch(actions.setInstance(v)); diff --git a/client/src/socket.jsx b/client/src/socket.jsx index dd6049aa..a6a97162 100644 --- a/client/src/socket.jsx +++ b/client/src/socket.jsx @@ -43,8 +43,8 @@ function createSocket(events) { send(['AccountConstructs', {}]); } - function sendAccountState() { - send(['AccountState', {}]); + function sendAccountInstances() { + send(['AccountInstances', {}]); } function sendAccountSetTeam(ids) { @@ -323,7 +323,7 @@ function createSocket(events) { return { sendAccountConstructs, - sendAccountState, + sendAccountInstances, sendAccountSetTeam, diff --git a/server/src/rpc.rs b/server/src/rpc.rs index 4f73e17f..082f9f0d 100644 --- a/server/src/rpc.rs +++ b/server/src/rpc.rs @@ -83,6 +83,7 @@ enum RpcRequest { AccountState {}, AccountShop {}, + AccountInstances {}, AccountConstructs {}, AccountSetTeam { ids: Vec }, @@ -154,7 +155,8 @@ impl Connection { Ok(RpcMessage::AccountState(account.clone())), RpcRequest::AccountConstructs {} => Ok(RpcMessage::AccountConstructs(account::constructs(&mut tx, &account)?)), - + RpcRequest::AccountInstances {} => + Ok(RpcMessage::AccountInstances(account::account_instances(&mut tx, account)?)), RpcRequest::AccountSetTeam { ids } => Ok(RpcMessage::AccountTeam(account::set_team(&mut tx, &account, ids)?)), From 70e66d1916d0d729931f00c7dfa083ef7b3cc613 Mon Sep 17 00:00:00 2001 From: Mashy Date: Thu, 12 Sep 2019 15:33:48 +1000 Subject: [PATCH 6/7] misc --- client/src/components/main.jsx | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/client/src/components/main.jsx b/client/src/components/main.jsx index c312849d..ab923182 100644 --- a/client/src/components/main.jsx +++ b/client/src/components/main.jsx @@ -11,8 +11,8 @@ const Bottom = require('./main.bottom'); const addState = connect( state => { - const { game, instance, account, nav, ws } = state; - return { game, instance, account, nav, ws }; + const { game, instance, account, nav } = state; + return { game, instance, account, nav }; } ); @@ -22,7 +22,6 @@ function Main(props) { instance, account, nav, - ws, } = props; if (!account) { From b1e18f68f22902980dfc47ac082b29c1ced647f1 Mon Sep 17 00:00:00 2001 From: Mashy Date: Thu, 12 Sep 2019 16:17:13 +1000 Subject: [PATCH 7/7] item description speeds --- WORKLOG.md | 2 -- client/src/components/info.component.jsx | 10 +++++++--- client/src/utils.jsx | 15 +++++++++++++++ 3 files changed, 22 insertions(+), 5 deletions(-) diff --git a/WORKLOG.md b/WORKLOG.md index f8bf9347..03ff4cbc 100644 --- a/WORKLOG.md +++ b/WORKLOG.md @@ -20,8 +20,6 @@ * msg pane * game invites -* add speed to descriptions - ## SOON *SERVER* * modules diff --git a/client/src/components/info.component.jsx b/client/src/components/info.component.jsx index 9b0d1c6d..8de69d77 100644 --- a/client/src/components/info.component.jsx +++ b/client/src/components/info.component.jsx @@ -3,7 +3,7 @@ const range = require('lodash/range'); const reactStringReplace = require('react-string-replace'); const { INFO } = require('./../constants'); -const { convertItem } = require('../utils'); +const { convertItem, removeTier, itemSpeed } = require('../utils'); const shapes = require('./shapes'); function InfoComponent(args) { @@ -40,19 +40,23 @@ function InfoComponent(args) { if (isSkill) { const regEx = /(RedPower|BluePower|GreenPower|RedLife|BlueLife|GreenLife|SpeedStat)/; const infoDescription = reactStringReplace(fullInfo.description, regEx, match => shapes[match]()); - const itemSource = itemInfo.combos.filter(c => c.item === info); + const itemSource = itemInfo.combos.filter(c => c.item === removeTier(info)); const itemSourceInfo = itemSource.length ? `${itemSource[0].components[0]} ${itemSource[0].components[1]} ${itemSource[0].components[2]}` : false; const itemRegEx = /(Red|Blue|Green)/; const itemSourceDescription = reactStringReplace(itemSourceInfo, itemRegEx, match => shapes[match]()); - + const calcSpeed = itemSource.length + ? (24 + (itemSpeed(itemSource[0].components[0]) + itemSpeed(itemSource[0].components[1])) * itemSpeed(itemSource[0].components[2])) * 4 + : (24 + itemSpeed(info)) * 4; + const speed =
Speed {shapes.SpeedStat()} multiplier {calcSpeed}%
; return (

{fullInfo.item}

SKILL

{itemSourceDescription}
{infoDescription}
+ {speed}
); } diff --git a/client/src/utils.jsx b/client/src/utils.jsx index b78a2b44..ab3a6f4c 100644 --- a/client/src/utils.jsx +++ b/client/src/utils.jsx @@ -187,6 +187,20 @@ const removeTier = skill => { return skill; }; +function itemSpeed(item) { + switch (item) { + case 'Attack': return 1; + case 'Stun': return 2; + case 'Block': return 3; + case 'Buff': return 4; + case 'Debuff': return 4; + case 'Red': return 3; + case 'Green': return 2; + case 'Blue': return 1; + default: return 0; + } +} + function postData(url = '/', data = {}) { // Default options are marked with * return fetch(`/api${url}`, { @@ -250,5 +264,6 @@ module.exports = { TARGET_COLOURS, randomPoints, removeTier, + itemSpeed, match, };