From a22521b119dccee505efbb3f46c1b96e0474a256 Mon Sep 17 00:00:00 2001 From: ntr Date: Sun, 15 Sep 2019 12:10:13 +1000 Subject: [PATCH 1/6] add tris and url parsing --- client/package.json | 1 + client/src/socket.jsx | 4 ++++ server/src/img.rs | 30 +++++++++++++++++++++++++++++- 3 files changed, 34 insertions(+), 1 deletion(-) diff --git a/client/package.json b/client/package.json index 2897558c..7c875711 100644 --- a/client/package.json +++ b/client/package.json @@ -29,6 +29,7 @@ "preact-compat": "^3.19.0", "preact-context": "^1.1.3", "preact-redux": "^2.1.0", + "query-string": "^6.8.3", "react-string-replace": "^0.4.4", "react-stripe-elements": "^3.0.0", "redux": "^4.0.0" diff --git a/client/src/socket.jsx b/client/src/socket.jsx index 74140922..e5c11d5c 100644 --- a/client/src/socket.jsx +++ b/client/src/socket.jsx @@ -1,3 +1,5 @@ +const querystring = require('query-string'); + const toast = require('izitoast'); const cbor = require('borc'); @@ -310,6 +312,8 @@ function createSocket(events) { ws = null; } + console.log(querystring.parse(location.hash)); + ws = new WebSocket(SOCKET_URL); ws.binaryType = 'arraybuffer'; diff --git a/server/src/img.rs b/server/src/img.rs index e3584c20..3fc746b3 100644 --- a/server/src/img.rs +++ b/server/src/img.rs @@ -117,7 +117,7 @@ pub fn shapes_write(id: Uuid) -> Result { (ConstructShapes::Circle, 10), (ConstructShapes::Line, 10), (ConstructShapes::V, 10), - // (ConstructShapes::Tri, 3), + (ConstructShapes::Tri, 10), // (ConstructShapes::Plus, 5), (ConstructShapes::Blank, 1), ]; @@ -155,6 +155,9 @@ pub fn shapes_write(id: Uuid) -> Result { let size = rng.gen_range(20.0, 50.0); write!(&mut svg, "", fill = colour, x = size / 2.0, y = size / 2.0, width = size, height = size, x_t = x_translate, y_t = y_translate, rotation = rotation)?; + if scalar == 0.0 && rng.gen_bool(0.5) { + continue; + } write!(&mut svg, "", fill = colour, x = size / 2.0, y = size / 2.0, width = size, height = size, x_t = -x_translate, y_t = -y_translate, rotation = rotation)?; }, @@ -163,6 +166,9 @@ pub fn shapes_write(id: Uuid) -> Result { let b = rng.gen_range(20.0, 50.0); write!(&mut svg, "", fill = colour, x = -b / 2.0, y = h / 2.0, x0 = -b / 2.0, y0 = -h / 2.0, x1 = 0, y1 = b / 2.0, x2 = b / 2.0, y2 = -h / 2.0, rotation = rotation, x_translate = x_translate, y_translate = y_translate)?; + if scalar == 0.0 && rng.gen_bool(0.5) { + continue; + } write!(&mut svg, "", fill = colour, x = -b / 2.0, y = h / 2.0, x0 = -b / 2.0, y0 = -h / 2.0, x1 = 0, y1 = b / 2.0, x2 = b / 2.0, y2 = -h / 2.0, rotation = rotation + 180, x_translate = -x_translate, y_translate = -y_translate)?; }, @@ -178,6 +184,9 @@ pub fn shapes_write(id: Uuid) -> Result { let height = rng.gen_range(20.0, 50.0); write!(&mut svg, "", fill = colour, x = width / 2.0, y = height / 2.0, width = width, height = height, x_t = x_translate, y_t = y_translate, rotation = rotation)?; + if scalar == 0.0 && rng.gen_bool(0.5) { + continue; + } write!(&mut svg, "", fill = colour, x = width / 2.0, y = height / 2.0, width = width, height = height, x_t = -x_translate, y_t = -y_translate, rotation = rotation)?; }, @@ -188,11 +197,30 @@ pub fn shapes_write(id: Uuid) -> Result { write!(&mut svg, "", fill = colour, width = width, x = -b / 2.0, y = h / 2.0, x0 = -b / 2.0, y0 = -h / 2.0, x1 = 0, y1 = b / 2.0, x2 = b / 2.0, y2 = -h / 2.0, rotation = rotation, x_translate = x_translate, y_translate = y_translate)?; + if scalar == 0.0 && rng.gen_bool(0.5) { + continue; + } write!(&mut svg, "", fill = colour, width = width, x = -b / 2.0, y = h / 2.0, x0 = -b / 2.0, y0 = -h / 2.0, x1 = 0, y1 = b / 2.0, x2 = b / 2.0, y2 = -h / 2.0, rotation = rotation + 180, x_translate = -x_translate, y_translate = -y_translate)?; }, ConstructShapes::Tri => { + let width = rng.gen_range(2.0, 4.0); + let length = rng.gen_range(12.5, 25.0); + let x0 = (0.0 as f64).cos() * length; + let y0 = (0.0 as f64).sin() * length; + let x1 = ((f64::consts::PI * 2.0) / 3.0).cos() * length; + let y1 = ((f64::consts::PI * 2.0) / 3.0).sin() * length; + let x2 = ((f64::consts::PI * 4.0) / 3.0).cos() * length; + let y2 = ((f64::consts::PI * 4.0) / 3.0).sin() * length; + + write!(&mut svg, "", + fill = colour, width = width, x0 = x0, y0 = y0, x1 = x1, y1 = y1, x2 = x2, y2 = y2, rotation = rotation, x_translate = x_translate, y_translate = y_translate)?; + if scalar == 0.0 && rng.gen_bool(0.5) { + continue; + } + write!(&mut svg, "", + fill = colour, width = width, x0 = x0, y0 = y0, x1 = x1, y1 = y1, x2 = x2, y2 = y2, rotation = rotation, x_translate = -x_translate, y_translate = -y_translate)?; }, ConstructShapes::Plus => { From dbe38a8815356dd956d05cc5f08092865c1ebf86 Mon Sep 17 00:00:00 2001 From: Mashy Date: Sun, 15 Sep 2019 13:21:04 +1000 Subject: [PATCH 2/6] anim simplified and fixed hopefully --- client/src/components/anims/banish.jsx | 4 +- client/src/components/anims/invert.jsx | 4 +- client/src/components/anims/source.cast.jsx | 8 +- client/src/components/construct.jsx | 86 ++------------------- 4 files changed, 19 insertions(+), 83 deletions(-) diff --git a/client/src/components/anims/banish.jsx b/client/src/components/anims/banish.jsx index 62d3096a..12ae365a 100644 --- a/client/src/components/anims/banish.jsx +++ b/client/src/components/anims/banish.jsx @@ -2,7 +2,7 @@ const anime = require('animejs').default; const { TIMES } = require('../../constants'); -function Banish(id) { +function Banish(id, idle) { return anime({ targets: [document.getElementById(id)], scaleY: 0, @@ -11,6 +11,8 @@ function Banish(id) { delay: TIMES.TARGET_DELAY_MS, duration: TIMES.TARGET_DURATION_MS * 0.45, direction: 'alternate', + begin: idle.pause, + complete: idle.play, }); } diff --git a/client/src/components/anims/invert.jsx b/client/src/components/anims/invert.jsx index 57a787d8..ac083bea 100644 --- a/client/src/components/anims/invert.jsx +++ b/client/src/components/anims/invert.jsx @@ -2,7 +2,7 @@ const anime = require('animejs').default; const { TIMES } = require('../../constants'); -function Invert(id) { +function Invert(id, idle) { return anime({ targets: [document.getElementById(id)], rotate: 180, @@ -10,6 +10,8 @@ function Invert(id) { duration: TIMES.TARGET_DURATION_MS * 0.45, easing: 'easeInOutElastic', direction: 'alternate', + begin: idle.pause, + complete: idle.play, }); } diff --git a/client/src/components/anims/source.cast.jsx b/client/src/components/anims/source.cast.jsx index 25cb8ae8..2ca2f6c3 100644 --- a/client/src/components/anims/source.cast.jsx +++ b/client/src/components/anims/source.cast.jsx @@ -2,15 +2,17 @@ const anime = require('animejs').default; const { TIMES } = require('../../constants'); -function sourceCast(id, direction) { +function sourceCast(id, direction, idle) { const { x, y } = direction; return anime({ targets: [document.getElementById(id)], - translateX: [0, x * 200], - translateY: [0, y * 200], + translateX: x * 200, + translateY: y * 200, easing: 'easeInOutElastic', direction: 'alternate', duration: TIMES.SOURCE_DURATION_MS, + begin: idle.pause, + complete: idle.play, }); } diff --git a/client/src/components/construct.jsx b/client/src/components/construct.jsx index 17e97349..964da49c 100644 --- a/client/src/components/construct.jsx +++ b/client/src/components/construct.jsx @@ -37,73 +37,8 @@ class ConstructAvatar extends Component { } componentDidMount() { - const { animSource, animTarget, construct } = this.props; - - // back to idle - if (!animTarget && !animSource) { - if (!this.idle) { - this.idle = idleAnimation(this.props.construct.id); - return this.animations.push(this.idle); - } - - return this.idle.play(); - } - - const isSource = animSource && animSource.constructId === construct.id; - - const selectAnim = () => { - if (isSource) { - console.warn(construct.name, animSource); - return sourceCast(animSource.constructId, animSource.direction); - } - - switch (animTarget.skill) { - case 'banish': return banish(construct.id); - case 'invert': return invert(construct.id); - default: return null; - } - }; - - const anim = selectAnim(); - if (!anim) return false; - - this.idle.pause(); - this.animations.push(anim); - return true; - } - - componentDidUpdate(prevProps) { - const { animSource, animTarget, construct } = this.props; - - // back to idle - if (!animTarget && !animSource) { - if (!this.idle) { - this.idle = idleAnimation(this.props.construct.id); - return this.animations.push(this.idle); - } - return this.idle.play(); - } - - const isSource = animSource && animSource.constructId === construct.id; - - const selectAnim = () => { - if (isSource) { - return sourceCast(animSource.constructId, animSource.direction); - } - - switch (animTarget.skill) { - case 'Banish': return banish(construct.id); - case 'Invert': return invert(construct.id); - default: return null; - } - }; - - const anim = selectAnim(); - if (!anim) return false; - - this.idle.pause(); - this.animations.push(anim); - return true; + this.idle = idleAnimation(this.props.construct.id); + return this.animations.push(this.idle); } resetAnimations() { @@ -132,24 +67,19 @@ class ConstructAvatar extends Component { // this is the source if (animSource && animSource.constructId === construct.id) { // console.warn(construct.name, 'should update') - return true; + return sourceCast(animSource.constructId, animSource.direction, this.idle); } // this is the target if (animTarget && animTarget.constructId.includes(construct.id)) { // console.warn(construct.name, 'should update') - return true; + switch (animTarget.skill) { + case 'Banish': return banish(construct.id, this.idle); + case 'Invert': return invert(construct.id, this.idle); + default: return null; + } } - // we were previously doing src anim - const prevSrc = this.props.animSource && this.props.animSource.constructId === construct.id; - if (prevSrc && !animSource) return true; - - const prevTarget = this.props.animTarget && this.props.animTarget.constructId.includes(construct.id); - if (prevTarget && !animTarget) return true; - - // console.warn(construct.name, 'not updating'); - return false; } } From 21203ee06a5860f6337e5d9a30e4926faccdb476 Mon Sep 17 00:00:00 2001 From: Mashy Date: Sun, 15 Sep 2019 14:15:03 +1000 Subject: [PATCH 3/6] screen based translate for cast --- client/src/components/anims/source.cast.jsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/client/src/components/anims/source.cast.jsx b/client/src/components/anims/source.cast.jsx index 2ca2f6c3..74a17184 100644 --- a/client/src/components/anims/source.cast.jsx +++ b/client/src/components/anims/source.cast.jsx @@ -6,8 +6,8 @@ function sourceCast(id, direction, idle) { const { x, y } = direction; return anime({ targets: [document.getElementById(id)], - translateX: x * 200, - translateY: y * 200, + translateX: x * window.screen.width * 0.15, + translateY: y * window.screen.height * 0.15, easing: 'easeInOutElastic', direction: 'alternate', duration: TIMES.SOURCE_DURATION_MS, From b85dade35167eca71931cb852dcc853ba94bf783 Mon Sep 17 00:00:00 2001 From: ntr Date: Sun, 15 Sep 2019 15:42:47 +1000 Subject: [PATCH 4/6] game invites --- client/assets/styles/controls.less | 2 +- client/assets/styles/styles.less | 6 ++ client/src/actions.jsx | 1 + client/src/components/play.ctrl.jsx | 54 ++++++++++ client/src/events.jsx | 26 +++++ client/src/reducers.jsx | 1 + client/src/socket.jsx | 20 +++- server/src/events.rs | 60 ++++++++++- server/src/rpc.rs | 149 +++++++++++++++------------- server/src/warden.rs | 4 + 10 files changed, 250 insertions(+), 73 deletions(-) diff --git a/client/assets/styles/controls.less b/client/assets/styles/controls.less index eebcc6c6..58bc0b9f 100644 --- a/client/assets/styles/controls.less +++ b/client/assets/styles/controls.less @@ -53,7 +53,7 @@ aside { border-color: forestgreen; } - &:active, &:focus { + &:active, &:focus, &.enabled { background: forestgreen; color: black; border-color: forestgreen; diff --git a/client/assets/styles/styles.less b/client/assets/styles/styles.less index 66bdb2cd..83ab40d9 100644 --- a/client/assets/styles/styles.less +++ b/client/assets/styles/styles.less @@ -286,3 +286,9 @@ li { background-repeat: no-repeat; background-position: center; } + +#clipboard { + width: 1px; + height: 1px; + padding: 0px; +} \ No newline at end of file diff --git a/client/src/actions.jsx b/client/src/actions.jsx index d4fe0dc8..ccfadcaa 100644 --- a/client/src/actions.jsx +++ b/client/src/actions.jsx @@ -19,6 +19,7 @@ export const setConstructRename = value => ({ type: 'SET_CONSTRUCT_RENAME', valu export const setGame = value => ({ type: 'SET_GAME', value }); export const setInfo = value => ({ type: 'SET_INFO', value }); export const setEmail = value => ({ type: 'SET_EMAIL', value }); +export const setInvite = value => ({ type: 'SET_INVITE', value }); export const setInstance = value => ({ type: 'SET_INSTANCE', value }); export const setInstances = value => ({ type: 'SET_INSTANCES', value }); export const setItemEquip = value => ({ type: 'SET_ITEM_EQUIP', value }); diff --git a/client/src/components/play.ctrl.jsx b/client/src/components/play.ctrl.jsx index e87e01e5..0df4f4d0 100644 --- a/client/src/components/play.ctrl.jsx +++ b/client/src/components/play.ctrl.jsx @@ -1,11 +1,14 @@ const preact = require('preact'); const { connect } = require('preact-redux'); +const { errorToast, infoToast } = require('../utils'); + const addState = connect( function receiveState(state) { const { ws, instances, + invite, } = state; function sendInstanceState(id) { @@ -20,12 +23,18 @@ const addState = connect( ws.sendInstanceQueue(); } + function sendInstanceInvite() { + ws.sendInstanceInvite(); + } + return { instances, + invite, sendInstanceState, sendInstanceQueue, sendInstancePractice, + sendInstanceInvite, }; } ); @@ -33,10 +42,12 @@ const addState = connect( function JoinButtons(args) { const { instances, + invite, sendInstanceState, sendInstanceQueue, sendInstancePractice, + sendInstanceInvite, } = args; if (instances.length) { @@ -55,6 +66,48 @@ function JoinButtons(args) { ); } + const inviteBtn = () => { + if (!invite) { + return ( + + ); + } + + function copyClick(e) { + const link = `${document.location.origin}#join=${invite}`; + const textArea = document.createElement('textarea', { id: '#clipboard' }); + textArea.value = link; + document.body.appendChild(textArea); + textArea.focus(); + textArea.select(); + + try { + document.execCommand('copy'); + infoToast('Invite link copied.'); + } catch (err) { + console.error('link copy error', err); + errorToast('Invite link copy error.'); + } + + document.body.removeChild(textArea); + return true; + } + + return ( + + ); + }; + return (