webshop login, logout
diff --git a/website/templates/css/login.css b/website/templates/css/login.css
index c2a7af2..4120807 100644
--- a/website/templates/css/login.css
+++ b/website/templates/css/login.css
@@ -4,9 +4,17 @@
 			margin: 70px auto;
 		}
 
+		#login_wrapper,
+		#login_wrapper h3 {
+			color: #333;
+		}
+		
+		#login_wrapper a {
+			color: #0088cc;
+		}
+
 		.layout-wrapper {
 			background-color: #fff;
-			color: #333;
 			padding: 10px;
 			box-shadow: 1px 1px 3px 3px #ccc;
 			font-size: 12px;
@@ -32,7 +40,4 @@
 			text-align: center;
 			padding: 15px;
 		}
-		.login-footer, .login-footer a {
-			color: #999;
-		}
 	</style>
\ No newline at end of file
diff --git a/website/templates/html/navbar.html b/website/templates/html/navbar.html
index 8112499..4663a2f 100644
--- a/website/templates/html/navbar.html
+++ b/website/templates/html/navbar.html
@@ -47,9 +47,6 @@
 						{% endif %}
 					{% endfor %}
 				</ul>
-				<ul class="nav pull-right">
-					<li id="login-topbar-item"><a href="login">Login</a></li>
-				</ul>
 			</div>
 		</div>
 	</div>
diff --git a/website/templates/html/outer.html b/website/templates/html/outer.html
index f7296e4..207c124 100644
--- a/website/templates/html/outer.html
+++ b/website/templates/html/outer.html
@@ -4,6 +4,10 @@
 	<header>
 	</header>
 	<div class="container">
+		<div class="pull-right" style="margin:4px;" id="user-tools">
+			<a id="login-link" href="login">Login</a>
+		</div>
+		<div class="clearfix"></div>
 		{% if banner_html %}<div class="row" style="margin-top: 30px;">
 			<div class="span12">{{ banner_html }}</div>
 		</div>{% endif %}
diff --git a/website/templates/js/login.js b/website/templates/js/login.js
index 96b820a..09e8e9e 100644
--- a/website/templates/js/login.js
+++ b/website/templates/js/login.js
@@ -19,25 +19,43 @@
 login.do_login = function(){
 
     var args = {};
-    args['usr']=$("#login_id").val();
-    args['pwd']=$("#password").val();
+	if(window.is_sign_up) {
+		args.cmd = "core.doctype.profile.profile.sign_up";
+		args.email = $("#login_id").val();
+	    args.full_name = $("#full_name").val();
 
-	if(!args.usr || !args.pwd) {
-		login.set_message("Both login and password required.");
+		if(!args.email || !valid_email(args.email) || !args.full_name) {
+			login.set_message("Valid email and name required.");
+			return false;
+		}
+
+	} else {
+		args.cmd = "login"
+	    args.usr = $("#login_id").val();
+	    args.pwd = $("#password").val();
+
+		if(!args.usr || !args.pwd) {
+			login.set_message("Both login and password required.");
+			return false;
+		}	
 	}
 
 	$('#login_btn').attr("disabled", "disabled");
+	$("#login-spinner").toggle(true);
 	$('#login_message').toggle(false);
 	
 	$.ajax({
 		type: "POST",
 		url: "server.py",
-		data: {cmd:"login", usr:args.usr, pwd: args.pwd},
+		data: args,
 		dataType: "json",
 		success: function(data) {
+			$("#login-spinner").toggle(false);
 			$('#login_btn').attr("disabled", false);
 			if(data.message=="Logged In") {
 				window.location.href = "app.html";
+			} else if(data.message=="No App") {
+				window.location.href = "index";
 			} else {
 				login.set_message(data.message);
 			}
@@ -47,6 +65,16 @@
 	return false;
 }
 
+login.sign_up = function() {
+	$("#login_wrapper h3").html("Sign Up");
+	$("#login-label").html("Email Id");
+	$("#password-label").html("Full Name");
+	$("#password-row, #forgot-wrapper, #sign-up-wrapper, #login_message").toggle(false);
+	$("#full-name-row").toggle(true);
+	$("#login_btn").html("Register");
+	window.is_sign_up = true;
+}
+
 login.show_forgot_password = function(){
     // create dialog
 	var login_id = $("#login_id").val();
diff --git a/website/templates/pages/login.html b/website/templates/pages/login.html
index ef9b7bb..6b847ff 100644
--- a/website/templates/pages/login.html
+++ b/website/templates/pages/login.html
@@ -10,7 +10,7 @@
 {% set title="Login" %}
 
 {% block body %}
-	<div id='login_wrapper'>
+	<div class="container" id='login_wrapper'>
 		<div class='layout-wrapper layout-main'>
 			<p id="login_message" class="alert" style="display: none;"></p>
 			<h3><i class="icon-lock" style="margin-top: 7px"></i> Login</h3>
@@ -18,34 +18,45 @@
 				<table border="0" class="login-box">
 					<tbody>
 						<tr>
-							<td style="text-align: right; padding: 3px;">Login Id</td>
+							<td style="text-align: right; padding: 3px;" 
+								id="login-label">Login Id</td>
 							<td><input id="login_id" type="text" style="width: 180px"/></td>
 						</tr>
-						<tr>
-							<td style="text-align: right; padding: 3px;">Password</td>
+						<tr id="password-row">
+							<td style="text-align: right; padding: 3px;" >Password</td>
 							<td><input id="password" type="password" style="width: 180px" /></td>
 						</tr>
+						<tr id="full-name-row" style="display: none;">
+							<td style="text-align: right; padding: 3px;">Full Name</td>
+							<td><input id="full_name" type="text" style="width: 180px" /></td>
+						</tr>
 						<tr>
 							<td>&nbsp;</td>
 							<td>
 								<button type="submit" id="login_btn" 
 									class="btn btn-small btn-primary">Login</button>
+								<img src="lib/images/ui/button-load.gif" id="login-spinner" 
+									style="display: none;">
 							</td>
 						</tr>
 						</tbody>
 				</table>
 			</form>
 			<br>
-			<p style="text-align: center"><a id="forgot-password"
+			<p style="text-align: center" id="forgot-wrapper">
+				<a id="forgot-password" style="cursor:pointer"
 				onclick="return login.show_forgot_password()">Forgot Password</a></p>
+			<p style="text-align: center" id="sign-up-wrapper">
+				New user? <a id="sign-up" style="cursor:pointer"
+				onclick="return login.sign_up()">Sign Up</a></p>
 		</div>
-		<div class="login-footer">
-			<a href="index.html">Home</a> | 
-				<a href="https://erpnext.com">ERPNext</a><br><br>
-				{% if copyright %}
-				<div class="web-footer-copyright">&copy; {{ copyright }}
-				{% endif %}
-		</div>
+	</div>
+	<div class="web-footer login-footer container">
+		<a href="index.html">Home</a> | 
+			<a href="https://erpnext.com">ERPNext</a><br><br>
+			{% if copyright %}
+			<div class="web-footer-copyright">&copy; {{ copyright }}
+			{% endif %}
 	</div>
 
 {% endblock %}
\ No newline at end of file