From 50f1c6fa1b700bedd0f0c684a3f7d61b03121f1f Mon Sep 17 00:00:00 2001
From: Mashy <himesh.kapadia@gmail.com>
Date: Mon, 28 Oct 2019 14:23:56 +1000
Subject: [PATCH] construct name and avatar and $$$ jebaited

---
 client/src/components/construct.jsx           |  3 ++-
 client/src/components/info.component.jsx      | 22 +++++++++++++++++++
 client/src/components/instance.constructs.jsx |  8 +++----
 3 files changed, 28 insertions(+), 5 deletions(-)

diff --git a/client/src/components/construct.jsx b/client/src/components/construct.jsx
index 334ba19e..3c2df336 100644
--- a/client/src/components/construct.jsx
+++ b/client/src/components/construct.jsx
@@ -29,12 +29,13 @@ class ConstructAvatar extends Component {
     }
 
     render() {
-        const { construct } = this.props;
+        const { construct, mouseOver } = this.props;
         return (
             <div
                 class="avatar"
                 id={construct.id}
                 onMouseDown={this.onClick.bind(this)}
+                onMouseOver={mouseOver ? mouseOver : null}
                 style={{ 'background-image': `url(/imgs/${construct.img}.svg)` }}>
                 <ConstructAnimation construct={construct} />
             </div>
diff --git a/client/src/components/info.component.jsx b/client/src/components/info.component.jsx
index 2574e50a..1d78d2ed 100644
--- a/client/src/components/info.component.jsx
+++ b/client/src/components/info.component.jsx
@@ -40,7 +40,29 @@ class InfoComponent extends preact.Component {
                 if (tutorialStageInfo) return tutorialStageInfo;
             }
             if (!info) return false;
+            if (info.includes('constructName')) {
+                return (
+                    <div>
+                        <h2> {info.replace('constructName ', '')} </h2>
+                        <p> This is the name of your construct. <br />
+                            Names are randomly generated and are purely cosmetic. <br />
+                            You can change change your construct name in the reshape tab outside of games.
+                        </p>
+                    </div> 
+                );
+            }
 
+            if (info.includes('constructAvatar')) {
+                return (
+                    <div>
+                        <h2> {info.replace('constructAvatar ', '')} </h2>
+                        <p> This is your construct avatar. <br />
+                            Avatars are randomly generated and are purely cosmetic. <br />
+                            You can change your construct avatar in the reshape tab outside of games.
+                        </p>
+                    </div> 
+                );
+            }
             const fullInfo = itemInfo.items.find(i => i.item === info) || INFO[info];
             if (!fullInfo) return false;
             const isSkill = fullInfo.skill;
diff --git a/client/src/components/instance.constructs.jsx b/client/src/components/instance.constructs.jsx
index f3367a2a..1e010061 100644
--- a/client/src/components/instance.constructs.jsx
+++ b/client/src/components/instance.constructs.jsx
@@ -221,11 +221,11 @@ function Construct(props) {
     });
 
     const classes = `instance-construct ${mobileVisible ? 'visible' : ''}`;
-
+    const avatarMouseOver = e => hoverInfo(e, `constructAvatar ${construct.name}`);
     return (
-        <div key={construct.id} class={classes} onClick={onClick} >
-            <ConstructAvatar construct={construct} />
-            <h2 class="name" >{construct.name}</h2>
+        <div key={construct.id} class={classes} onClick={onClick}>
+            <ConstructAvatar construct={construct} mouseOver={avatarMouseOver}/>
+            <h2 class="name" onMouseOver={e => hoverInfo(e, `constructName ${construct.name}`)}>{construct.name}</h2>
             <div class="skills" onMouseOver={e => hoverInfo(e, 'constructSkills')} >
                 {skills}
             </div>