Merge branch 'uat' of https://github.com/MetaMask/metamask-extension into cb-254

4 files changed, 67 insertions, 13 deletions

diff --git a/mascara/server/index.js b/mascara/server/index.js
index 83f84f6d1..6fb1287cc 100644
--- a/mascara/server/index.js
+++ b/mascara/server/index.js
@@ -2,6 +2,7 @@ const path = require('path')
 const express = require('express')
 const createBundle = require('./util').createBundle
 const serveBundle = require('./util').serveBundle
+const compression = require('compression')
 
 module.exports = createMetamascaraServer
 
@@ -16,6 +17,8 @@ function createMetamascaraServer () {
 
   // serve bundles
   const server = express()
+  server.use(compression())
+
   // ui window
   serveBundle(server, '/ui.js', uiBundle)
   server.use(express.static(path.join(__dirname, '/../ui/'), { setHeaders: (res) => res.set('X-Frame-Options', 'DENY') }))
diff --git a/mascara/server/util.js b/mascara/server/util.js
index af2daddb9..f9692afb6 100644
--- a/mascara/server/util.js
+++ b/mascara/server/util.js
@@ -23,7 +23,9 @@ function createBundle (entryPoint) {
     cache: {},
     packageCache: {},
     plugin: [watchify],
-  }).transform('babelify')
+  })
+    .transform('babelify')
+    .transform('uglifyify', { global: true })
 
   bundler.on('update', bundle)
   bundle()
diff --git a/mascara/src/app/first-time/create-password-screen.js b/mascara/src/app/first-time/create-password-screen.js
index 17b9174b8..30acdcf65 100644
--- a/mascara/src/app/first-time/create-password-screen.js
+++ b/mascara/src/app/first-time/create-password-screen.js
@@ -5,6 +5,8 @@ import { createNewVaultAndKeychain } from '../../../../ui/app/actions'
 import LoadingScreen from './loading-screen'
 import Breadcrumbs from './breadcrumbs'
 import { DEFAULT_ROUTE, IMPORT_ACCOUNT_ROUTE } from '../../../../ui/app/routes'
+import EventEmitter from 'events'
+import Mascot from '../../../../ui/app/components/mascot'
 
 class CreatePasswordScreen extends Component {
   static propTypes = {
@@ -20,6 +22,11 @@ class CreatePasswordScreen extends Component {
     confirmPassword: '',
   }
 
+  constructor () {
+    super()
+    this.animationEventEmitter = new EventEmitter()
+  }
+
   componentWillMount () {
     const { isInitialized, isUnlocked, history } = this.props
     if (isInitialized || isUnlocked) {
@@ -56,12 +63,25 @@ class CreatePasswordScreen extends Component {
   render () {
     const { isLoading } = this.props
 
-    return (
-      <div className="first-time-flow">
-      {
-        isLoading
-          ? <LoadingScreen loadingMessage="Creating your new account" />
-          : (
+    return isLoading
+      ? <LoadingScreen loadingMessage="Creating your new account" />
+      : (
+        <div>
+          <h2 className="alpha-warning">Warning This is Experimental software and is a Developer BETA </h2>
+          <div className="first-view-main">
+            <div className="mascara-info">
+              <Mascot
+                animationEventEmitter={this.animationEventEmitter}
+                width="225"
+                height="225"
+              />
+              <div className="info">
+                MetaMask is a secure identity vault for Ethereum.
+              </div>
+              <div className="info">
+                It allows you to hold ether & tokens, and interact with decentralized applications.
+              </div>
+            </div>
             <div className="create-password">
               <div className="create-password__title">
                 Create Password
@@ -109,10 +129,9 @@ class CreatePasswordScreen extends Component {
               { */ }
               <Breadcrumbs total={3} currentIndex={0} />
             </div>
-          )
-      }
-      </div>
-    )
+          </div>
+        </div>
+      )
   }
 }
 
diff --git a/mascara/src/app/first-time/index.css b/mascara/src/app/first-time/index.css
index 157989d07..f91c72f0e 100644
--- a/mascara/src/app/first-time/index.css
+++ b/mascara/src/app/first-time/index.css
@@ -1,3 +1,4 @@
+
 .first-time-flow {
   height: 100vh;
   width: 100vw;
@@ -5,6 +6,36 @@
   overflow: auto;
 }
 
+.alpha-warning {
+  background: #f7861c;
+  color: #fff;
+  line-height: 2em;
+  padding-left: 2em;
+}
+
+.first-view-main {
+  display: flex;
+  flex-direction: row-reverse;
+  justify-content: space-between;
+}
+
+.mascara-info {
+  display: flex;
+  flex-flow: column;
+  margin-top: 70px;
+  margin-right: 10vw;
+  width: 35vw;
+  max-width: 550px;
+}
+
+.mascara-info :first-child {
+  align-self: flex-end;
+}
+
+.info {
+  font-size: 19px;
+}
+
 .create-password,
 .unique-image,
 .tou,
@@ -540,11 +571,10 @@ button.backup-phrase__confirm-seed-option:hover {
   text-transform: uppercase;
   margin: 35px 0 14px;
   transition: 200ms ease-in-out;
-  background: #f7861c;
+  background-color: rgba(247, 134, 28, 0.9);
 }
 
 button.first-time-flow__button[disabled] {
-  background-color: rgba(247, 134, 28, 0.9);
   opacity: .6;
 }