-
{info} - {fullInfo.cost}b
+
{infoText} - {fullInfo.cost}b
SPEC
{itemSourceDescription}
{infoDescription}
diff --git a/client/src/components/instance.component.jsx b/client/src/components/instance.component.jsx
index 3d935752..abd2e9da 100644
--- a/client/src/components/instance.component.jsx
+++ b/client/src/components/instance.component.jsx
@@ -95,7 +95,6 @@ class Instance extends Component {
bindSwipes() {
const instance = document.getElementById('instance');
if (!instance) {
- console.log('no instance, binding in 50');
return setTimeout(this.bindSwipes, 50);
}
if (this.h) this.h.destroy();
@@ -116,7 +115,6 @@ class Instance extends Component {
setNavInstance((navInstance + 1) % 4);
});
- console.log('hammer gestures bound');
return true;
}
}
diff --git a/client/src/components/instance.ctrl.jsx b/client/src/components/instance.ctrl.jsx
index b025d239..6ec4bdaf 100644
--- a/client/src/components/instance.ctrl.jsx
+++ b/client/src/components/instance.ctrl.jsx
@@ -43,11 +43,11 @@ function Controls(args) {
const zero = Date.parse(instance.phase_start);
const now = Date.now();
const end = Date.parse(instance.phase_end);
- const timerPct = instance.phase_end
+ const timerPct = instance.phase !== 'Finished' && instance.phase_end
? ((now - zero) / (end - zero) * 100)
: 100;
- const displayColour = !instance.phase_end
+ const displayColour = !instance.phase_end || instance.phase === 'Finished'
? '#222'
: player.ready
? 'forestgreen'
diff --git a/client/src/components/main.top.jsx b/client/src/components/main.top.jsx
index 64438f40..b6395305 100644
--- a/client/src/components/main.top.jsx
+++ b/client/src/components/main.top.jsx
@@ -6,6 +6,7 @@ const actions = require('./../actions');
const AccountTop = require('./account.top');
const Play = require('./play');
const Shop = require('./shop');
+const Reshape = require('./reshape');
const addState = connect(
function receiveState(state) {
@@ -27,6 +28,7 @@ function Top(args) {
if (nav === 'account') return
;
if (nav === 'play') return
if (nav === 'shop') return
+ if (nav === 'reshape') return
return false;
}
diff --git a/client/src/components/mnni.jsx b/client/src/components/mnni.jsx
new file mode 100644
index 00000000..f1506dfc
--- /dev/null
+++ b/client/src/components/mnni.jsx
@@ -0,0 +1,63 @@
+const { Component } = require('preact');
+const preact = require('preact');
+// const { connect } = require('preact-redux');
+
+const idleAnimation = require('./anims/idle');
+const wiggle = require('./anims/wiggle');
+
+class MnniAvatatr extends Component {
+ constructor() {
+ super();
+ // The animation ids are a check to ensure that animations are not repeated
+ // When a new account animation is communicated with state it will have a corresponding Id
+ // which is a count of how many resoluttions have passed
+ this.animations = [];
+ this.resetAnimations = this.resetAnimations.bind(this);
+ }
+
+ render() {
+ const { account, mtxActive } = this.props;
+ return (
+
+
+ );
+ }
+
+ onClick() {
+ if (this.props.mtxActive) {
+ return this.props.sendMtxAccountApply();
+ }
+ return this.animations.push(wiggle('mnni', this.idle));
+ }
+
+ componentDidMount() {
+ this.idle = idleAnimation('mnni');
+ return this.animations.push(this.idle);
+ }
+
+ resetAnimations() {
+ for (let i = this.animations.length - 1; i >= 0; i--) {
+ this.animations[i].reset();
+ }
+ }
+
+ componentWillUnmount() {
+ this.resetAnimations();
+ }
+}
+
+function Mnni(args) {
+ return (
+
+ );
+}
+
+module.exports = Mnni;
diff --git a/client/src/components/play.ctrl.jsx b/client/src/components/play.ctrl.jsx
index e0391b32..39f11fc0 100644
--- a/client/src/components/play.ctrl.jsx
+++ b/client/src/components/play.ctrl.jsx
@@ -1,156 +1,26 @@
const preact = require('preact');
-const { connect } = require('preact-redux');
-
-const { errorToast, infoToast } = require('../utils');
+// const { connect } = require('preact-redux');
const AccountBox = require('./account.box');
-
-const addState = connect(
- function receiveState(state) {
- const {
- ws,
- instances,
- invite,
- } = state;
-
- function sendInstanceState(id) {
- ws.sendInstanceState(id);
- }
-
- function sendInstancePractice() {
- ws.sendInstancePractice();
- }
-
- function sendInstanceQueue() {
- ws.sendInstanceQueue();
- }
-
- function sendInstanceInvite() {
- ws.sendInstanceInvite();
- }
-
- return {
- instances,
- invite,
-
- sendInstanceState,
- sendInstanceQueue,
- sendInstancePractice,
- sendInstanceInvite,
- };
- }
-);
+const Mnni = require('./mnni');
function JoinButtons(args) {
- const {
- instances,
- invite,
-
- sendInstanceState,
- sendInstanceQueue,
- sendInstancePractice,
- sendInstanceInvite,
- } = args;
-
- const discordBtn = (
-
- );
-
- if (instances.length) {
- return (
-
- );
- }
-
- 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 to clipboard.');
- } catch (err) {
- console.error('link copy error', err);
- errorToast('Invite link copy error.');
- }
-
- document.body.removeChild(textArea);
- return true;
- }
-
- return (
-
- );
- };
-
return (
);
}
-module.exports = addState(JoinButtons);
+module.exports = JoinButtons;
diff --git a/client/src/components/play.jsx b/client/src/components/play.jsx
index e08223bc..dc7a1720 100644
--- a/client/src/components/play.jsx
+++ b/client/src/components/play.jsx
@@ -1,12 +1,8 @@
// const { connect } = require('preact-redux');
const preact = require('preact');
const { connect } = require('preact-redux');
-const { Elements } = require('react-stripe-elements');
-
-const Header = require('./header');
-const Team = require('./team');
-const StripeBtns = require('./stripe.buttons');
+const { errorToast, infoToast } = require('../utils');
const actions = require('./../actions');
const VERSION = process.env.npm_package_version;
@@ -16,17 +12,35 @@ const addState = connect(
const {
ws,
account,
- shop,
+ instances,
+ invite,
} = state;
- function mtxBuy(mtx) {
- return ws.sendMtxBuy(mtx.variant);
+ function sendInstanceState(id) {
+ ws.sendInstanceState(id);
+ }
+
+ function sendInstancePractice() {
+ ws.sendInstancePractice();
+ }
+
+ function sendInstanceQueue() {
+ ws.sendInstanceQueue();
+ }
+
+ function sendInstanceInvite() {
+ ws.sendInstanceInvite();
}
return {
account,
- shop,
- mtxBuy,
+ instances,
+ invite,
+
+ sendInstanceState,
+ sendInstanceQueue,
+ sendInstancePractice,
+ sendInstanceInvite,
};
},
@@ -51,32 +65,66 @@ const addState = connect(
function Play(args) {
const {
account,
- shop,
- mtxBuy,
+ instances,
+ invite,
+
+ sendInstanceState,
+ sendInstanceQueue,
+ sendInstancePractice,
+ sendInstanceInvite,
- setMtxActive,
setNav,
} = args;
- if (!shop) return false;
+ const inviteBtn = () => {
+ if (!invite) {
+ return (
+
+
+ Invite a Friend
+
+
+ );
+ }
+
+ 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 to clipboard.');
+ } catch (err) {
+ console.error('link copy error', err);
+ errorToast('Invite link copy error.');
+ }
+
+ document.body.removeChild(textArea);
+ return true;
+ }
- const useMtx = (item, i) => {
- const price = item === 'Rename' ? 5 : 1;
return (
-
setMtxActive(item)} >
- {item}
-
+
+
+ Invite Generated
);
};
- const availableMtx = (item, i) => (
-
- Enable {item.variant}
-
-
- );
-
const subscription = account.subscribed
?