rough ui finished

7 files changed, 87 insertions, 45 deletions

diff --git a/src/client/views/Main.tsx b/src/client/views/Main.tsx
index 858c02eb4..2a3e2780b 100644
--- a/src/client/views/Main.tsx
+++ b/src/client/views/Main.tsx
@@ -100,6 +100,19 @@ Documents.initProtos(() => {
 
         ReactDOM.render((
             <div style={{ position: "absolute", width: "100%", height: "100%" }}>
+                <a href="/logout">
+                    <img
+                        src="http://aux.iconspalace.com/uploads/logout-icon-256-510450847.png"
+                        style={{
+                            position: "absolute",
+                            width: "20px",
+                            height: "20px",
+                            top: "20px",
+                            zIndex: 15,
+                            right: "20px",
+                        }}
+                    />
+                </a>
                 <DocumentView Document={mainContainer} ContainingCollectionView={undefined} DocumentView={undefined} />
                 <DocumentDecorations />
                 <ContextMenu />
diff --git a/src/server/authentication/controllers/user.ts b/src/server/authentication/controllers/user.ts
index 72fdd5137..554781409 100644
--- a/src/server/authentication/controllers/user.ts
+++ b/src/server/authentication/controllers/user.ts
@@ -5,7 +5,6 @@ import { IVerifyOptions } from "passport-local";
 import "../config/passport";
 import * as request from "express-validator";
 const flash = require("express-flash");
-import * as path from 'path'
 import * as session from "express-session";
 import * as pug from 'pug';
 
@@ -18,17 +17,6 @@ export let getEntry = (req: Request, res: Response) => {
     res.redirect("/login");
 }
 
-export let getHome = (req: Request, res: Response) => {
-    // if user is not logged in, redirect to log in page
-    if (!req.user) {
-        res.redirect("/login");
-        return;
-    }
-    // otherwise, connect them to Dash
-    // TODO: store and manage users' workspaces
-    res.sendFile(path.join(__dirname, '../../deploy/index.html'));
-}
-
 /**
  * GET /signup
  * Directs user to the signup page
@@ -38,7 +26,7 @@ export let getSignup = (req: Request, res: Response) => {
     if (req.user) {
         let user = req.user;
         console.log(user);
-        return res.redirect("/");
+        return res.redirect("/home");
     }
     res.render("signup.pug", {
         title: "Sign Up"
@@ -104,7 +92,7 @@ export let postSignup = (req: Request, res: Response, next: NextFunction) => {
  */
 export let getLogin = (req: Request, res: Response) => {
     if (req.user) {
-        return res.redirect("/");
+        return res.redirect("/home");
     }
     res.render("login.pug", {
         title: "Log In"
diff --git a/src/server/index.ts b/src/server/index.ts
index d097b4aec..7189b32a0 100644
--- a/src/server/index.ts
+++ b/src/server/index.ts
@@ -16,7 +16,7 @@ import { ObjectID } from 'mongodb';
 import { Document } from '../fields/Document';
 import * as io from 'socket.io'
 import * as passportConfig from './authentication/config/passport';
-import { getLogin, postLogin, getSignup, postSignup, getLogout, getEntry, getHome } from './authentication/controllers/user';
+import { getLogin, postLogin, getSignup, postSignup, getLogout, getEntry } from './authentication/controllers/user';
 const config = require('../../webpack.config');
 const compiler = webpack(config);
 const port = 1050; // default port to listen
@@ -32,6 +32,7 @@ const MongoStore = require('connect-mongo')(session);
 const mongoose = require('mongoose');
 const bluebird = require('bluebird');
 import { performance } from 'perf_hooks'
+import * as path from 'path'
 
 const mongoUrl = 'mongodb://localhost:27017/Dash';
 // mongoose.Promise = bluebird;
@@ -77,7 +78,16 @@ app.use((req, res, next) => {
 // functions in the exports of user.ts
 
 // /home defines destination after a successful log in
-app.get("/home", getHome);
+app.get("/home", (req, res) => {
+    // if user is not logged in, redirect to log in page
+    if (!req.user) {
+        res.redirect("/login");
+        return;
+    }
+    // otherwise, connect them to Dash
+    // TODO: store and manage users' workspaces
+    res.sendFile(path.join(__dirname, '../../deploy/index.html'));
+});
 
 // anyone attempting to navigate to localhost at this port will
 // first have to login
diff --git a/views/login.pug b/views/login.pug
index fb97d3171..c379a6605 100644
--- a/views/login.pug
+++ b/views/login.pug
@@ -6,9 +6,11 @@ block content
         include ./stylesheets/authentication.css
     form.form-horizontal(id='login-form', method='POST')
         input(type='hidden', name='_csrf', value=_csrf)
-        .overlay
-            .inner
-                h3(id='login_label') Log In
+        .overlay(id='overlay_login')
+            a(href="/signup")
+                img(id='new_user', src="https://bit.ly/2EuqPb4", alt="")
+            .inner.login
+                h3.auth_header Log In
                 .form-group
                     //- label.col-sm-3.control-label(for='email', id='email_label') Email
                     .col-sm-7
diff --git a/views/resources/dashlogo.png b/views/resources/dashlogo.png
new file mode 100644
index 000000000..3ba4e111b
--- /dev/null
+++ b/views/resources/dashlogo.png
diff --git a/views/signup.pug b/views/signup.pug
index a23f334af..8b5358137 100644
--- a/views/signup.pug
+++ b/views/signup.pug
@@ -2,24 +2,25 @@
 extends ./layout
 
 block content
-  .page-header
-    h3 Sign up
-  form.form-horizontal(id='signup-form', method='POST')
-    input(type='hidden', name='_csrf', value=_csrf)
-    .form-group
-      label.col-sm-3.control-label(for='email') Email
-      .col-sm-7
-        input.form-control(type='email', name='email', id='email', placeholder='Email', autofocus, required)
-    .form-group
-      label.col-sm-3.control-label(for='password') Password
-      .col-sm-7
-        input.form-control(type='password', name='password', id='password', placeholder='Password', required)
-    .form-group
-      label.col-sm-3.control-label(for='confirmPassword') Confirm Password
-      .col-sm-7
-        input.form-control(type='password', name='confirmPassword', id='confirmPassword', placeholder='Confirm Password', required)
-    .form-group
-      .col-sm-offset-3.col-sm-7
-        button.btn.btn-success(type='submit')
-          i.fa.fa-user-plus
-          | Signup
\ No newline at end of file
+    style
+        include ./stylesheets/authentication.css
+    .page-header
+    form.form-horizontal(id='signup-form', method='POST')
+        input(type='hidden', name='_csrf', value=_csrf)
+        .overlay(id='overlay_signup')
+            .inner.signup
+                h3.auth_header Create An Account
+                .form-group
+                    .col-sm-7
+                        input.form-control(type='email', name='email', id='email', placeholder='Email', autofocus, required)
+                .form-group
+                    .col-sm-7
+                        input.form-control(type='password', name='password', id='password', placeholder='Password', required)
+                .form-group
+                    .col-sm-7
+                        input.form-control(type='password', name='confirmPassword', id='confirmPassword', placeholder='Confirm Password', required)
+                .form-group
+                    .col-sm-offset-3.col-sm-7
+                        button.btn.btn-success(type='submit')
+                            i.fa.fa-user-plus
+                            | Signup
\ No newline at end of file
diff --git a/views/stylesheets/authentication.css b/views/stylesheets/authentication.css
index 43f2f228c..4f4c02c03 100644
--- a/views/stylesheets/authentication.css
+++ b/views/stylesheets/authentication.css
@@ -9,14 +9,28 @@ label {
 }
 
 body {
-    background-color: lightslategray;
+    background-color: #ccbbcc;
 }
 
-#login_label {
+#logo {
+    width: 100px;
+    height: 100px;
+    position: absolute;
+}
+
+.auth_header {
     text-align: left;
 }
 
-#submit {
+.login {
+    height: 220px;
+}
+
+.signup {
+    height: 273px;
+}
+
+.btn {
     width: 224px;
     height: 35px;
     font-family: Arial, Helvetica, sans-serif;
@@ -24,6 +38,22 @@ body {
     font-style: oblique;
 }
 
+#overlay_signup {
+    height: 345px;
+}
+
+#overlay_login {
+    height: 300px;
+}
+
+#new_user {
+    width: 20px;
+    height: 20px;
+    position: absolute;
+    top: 15px;
+    right: 15px;
+}
+
 .overlay {
     text-align: center;
     position: absolute;
@@ -33,7 +63,6 @@ body {
     left: 0;
     right: 0;
     width: 400px;
-    height: 300px;
     background-color: white;
     border-radius: 8px;
     box-shadow: 10px 10px 10px #00000033;
@@ -46,7 +75,6 @@ body {
     left: 0;
     right: 0;
     width: 230px;
-    height: 220px;
     margin: auto;
 }