added sub back to home, controls on reshape menu

client/src/components/controls.jsx

@@ -38,7 +38,7 @@ function Controls(args) {
 
     if (game) return <GameCtrl />;
     if (instance) return <InstanceCtrl />;
-    if (nav === 'play' || nav === 'shop' || !nav) return <PlayCtrl />
+    if (nav === 'play' || nav === 'shop' || nav === 'reshape' || !nav) return <PlayCtrl />
     if (nav === 'team' || nav === 'account') return <TeamCtrl />
 
     return false;

client/src/components/play.jsx

@@ -1,9 +1,61 @@
 // const { connect } = require('preact-redux');
 const preact = require('preact');
+const { connect } = require('preact-redux');
+
+const actions = require('./../actions');
 
 const VERSION = process.env.npm_package_version;
 
-function Play() {
+const addState = connect(
+    function receiveState(state) {
+        const {
+            ws,
+            account,
+        } = state;
+
+        return {
+            account,
+        };
+    },
+
+    function receiveDispatch(dispatch) {
+        function setMtxActive(mtx) {
+            dispatch(actions.setConstructRename(null));
+            dispatch(actions.setMtxActive(mtx));
+            return true;
+        }
+
+        function setNav(place) {
+            return dispatch(actions.setNav(place));
+        }
+
+        return {
+            setMtxActive,
+            setNav,
+        };
+    }
+);
+
+
+function Play(args) {
+    const {
+        account,
+        setNav,
+    } = args;
+    
+    const subscription = account.subscribed
+        ? <button
+            class="yellow-btn"
+            disabled>
+            Subscribed
+        </button>
+        : <button
+            onClick={() => setNav('shop')}
+            class="yellow-btn"
+            role="link">
+            Subscribe
+        </button>;
+
     return (
         <section class="top">
             <div class="news">
@@ -23,7 +75,18 @@ function Play() {
                 </p>
             </div>
             <div>
-                <p class="play-p">The buttons on the right are the controls to play the game.</p>
+                <h1 class="credits">¤ {account.balance}</h1>
+                <div class='list'>
+                    {subscription}
+                    <button
+                        onClick={() => setNav('shop')}
+                        class="yellow-btn"
+                        role="link">
+                        Get Credits
+                    </button>
+                    <div id="error-message"></div>
+                </div>
+                <br />
                 <p>
                     Click <b>LEARN</b> to practice the game without time controls. <br />
                     Select <b>INVITE</b> then click <b>COPY LINK</b> to create a game invitation for a friend.<br />
@@ -35,4 +98,4 @@ function Play() {
     );
 }
 
-module.exports = Play;
+module.exports = addState(Play);

client/src/components/reshape.jsx

@@ -4,8 +4,6 @@ const { connect } = require('preact-redux');
 
 const actions = require('./../actions');
 
-const VERSION = process.env.npm_package_version;
-
 const addState = connect(
     function receiveState(state) {
         const {