editing profile

15 files changed, 114 insertions, 31 deletions

diff --git a/public/assets/javascripts/app.js b/public/assets/javascripts/app.js
index b541d47..310dc69 100644
--- a/public/assets/javascripts/app.js
+++ b/public/assets/javascripts/app.js
@@ -19,7 +19,7 @@ var app = new function(){}
 
 app.init = function () {
 	app.tube = new Tube ()
-	app.master = new MasterView()
+	app.router = new Router ()
 }
 
 app.launch = function () {
diff --git a/public/assets/javascripts/ui/EditProfileModal.js b/public/assets/javascripts/ui/EditProfileModal.js
index 5b79a31..6b89ad8 100644
--- a/public/assets/javascripts/ui/EditProfileModal.js
+++ b/public/assets/javascripts/ui/EditProfileModal.js
@@ -2,6 +2,7 @@
 var EditProfileModal = ModalFormView.extend({
 	el: ".mediaDrawer.editProfile",
 	action: "/api/profile",
+	method: "put",
 
 	load: function(){
 		this.reset()
@@ -12,13 +13,44 @@ var EditProfileModal = ModalFormView.extend({
 				this.$("[name='" + i + "']").val(data[i])
 			}
 			
+			this.$("#profile_username").html(data.username)
+			
+			if (data.photo && data.photo.length) {
+				this.$("#load_avatar").attr("src", data.photo)
+			}
+			else {
+				this.$("#load_avatar").hide()
+			}
+			
 			this.show()
 		}, this))
 	},
+
+	validate: function(){
+		var errors = []
+
+		var email = this.$("#profile_email").val()		
+		var pw0 = this.$("#profile_old_password").val()
+		var pw1 = this.$("#profile_new_password").val()
+		var pw2 = this.$("#profile_new_password2").val()
+
+		if (pw1.length) {
+			if (! pw0.length) {
+				errors.push("Please enter your old password.")
+			}
+			if (pw1 !== pw2) {
+				errors.push("New passwords don't match");
+			}
+		}
+		if (email.length && email.indexOf("@") === -1) {
+			errors.push("Please enter a valid email address");
+		}
+
+		return errors
+	},
 	
 	success: function(){
 		window.location.href = "/profile"
 	}
 
 })
-
diff --git a/public/assets/javascripts/ui/MasterView.js b/public/assets/javascripts/ui/Router.js
index 5aca4e0..a518e27 100644
--- a/public/assets/javascripts/ui/MasterView.js
+++ b/public/assets/javascripts/ui/Router.js
@@ -1,5 +1,5 @@
 
-var MasterView = View.extend({
+var Router = View.extend({
 	el: "body",
 	
 	events: {
diff --git a/public/assets/javascripts/ui/SignUpModal.js b/public/assets/javascripts/ui/SignUpModal.js
index 95b5837..5c651ee 100644
--- a/public/assets/javascripts/ui/SignUpModal.js
+++ b/public/assets/javascripts/ui/SignUpModal.js
@@ -1,5 +1,3 @@
-
-
 var SignUpModal = ModalFormView.extend({
 	el: ".mediaDrawer.signup",
 	action: "/auth/signup",
diff --git a/public/assets/javascripts/ui/ModalFormView.js b/public/assets/javascripts/vendor/ModalFormView.js
index 608b8c1..16d63b2 100644
--- a/public/assets/javascripts/ui/ModalFormView.js
+++ b/public/assets/javascripts/vendor/ModalFormView.js
@@ -1,6 +1,8 @@
 
 var ModalFormView = ModalView.extend({
 
+	method: "put",
+
 	events: {
 		"submit form": "submit"
 	},
@@ -45,12 +47,16 @@ var ModalFormView = ModalView.extend({
 
 		var fields = this.$form.serializeArray()
 		fields.forEach(function(pair){
-			if (pair.name == "password" && pair.value.length > 0) {
+			if (pair.name.indexOf("password") !== -1 && pair.value.length > 0) {
 				pair.value = SHA1.hex('lol$' + pair.value + '$vvalls')
 			}
 		})
 		
-		var request = $.post(this.action, $.param(fields));
+		var request = $.ajax({
+			url: this.action,
+			type: this.method,
+			data: $.param(fields)
+		});
 		request.done($.proxy(function (response) {
 			if (response.error) {
 				this.$errors.show();
diff --git a/public/assets/javascripts/ui/ModalView.js b/public/assets/javascripts/vendor/ModalView.js
index 80ce8d0..b90b3c4 100644
--- a/public/assets/javascripts/ui/ModalView.js
+++ b/public/assets/javascripts/vendor/ModalView.js
@@ -21,7 +21,7 @@ var ModalView = View.extend({
 			window.location.pathname = "/"
 		}
 		else {
-			history.pushState(null, document.title, app.master.originalPath)
+			history.pushState(null, document.title, app.router.originalPath)
 			this.hide()
 		}
 	}
diff --git a/public/assets/stylesheets/app.css b/public/assets/stylesheets/app.css
index 85ecdb4..4a17214 100755
--- a/public/assets/stylesheets/app.css
+++ b/public/assets/stylesheets/app.css
@@ -424,7 +424,7 @@ h5{
 	font-size: 16px;
 	font-weight: 300;
 }
-.profilepage .bio span:nth-of-type:after { content: ' · ' }
+.profilepage .bio span:after { content: ' \00b7 ' }
 .profilepage .bio span:last-of-type:after { display: none; }
 
 
@@ -1274,6 +1274,11 @@ form h3 {
 form .errors div {
 	float: none;
 }
+form li div div {
+	width: 210px;
+	text-align: left;
+	margin: 0 10px 10px 0;
+}
 
 
 .video {
diff --git a/server/index.js b/server/index.js
index 34d5989..3f9aad0 100644
--- a/server/index.js
+++ b/server/index.js
@@ -62,7 +62,7 @@ app.all('*', middleware.ensureLocals);
 app.get('/', views.home);
 app.get('/login', views.modal);
 app.get('/signup', views.modal);
-app.post('/auth/signin', auth.loggedIn('local'));
+app.post('/auth/signin', auth.loggedInLocal);
 app.post('/auth/signup', auth.signup);
 app.get('/logout', auth.logout);
 app.get('/auth/twitter', auth.login('twitter'));
diff --git a/server/lib/api.js b/server/lib/api.js
index 9ff9f38..85c5b85 100644
--- a/server/lib/api.js
+++ b/server/lib/api.js
@@ -1,7 +1,6 @@
 /* jshint node: true */
 
 var passport = require('passport'),
-	_ = require('lodash'),
 	Entities = require('html-entities').XmlEntities,
 	entities = new Entities(),
 	crypto = require('crypto'),
@@ -19,13 +18,28 @@ var api = {
 				res.json(err || user)
 			})
 		},
+		
 		update: function(req, res){
-			var data = req.cleanQuery(req.body)
-			if (data.new_password.length && req.user.checkPassword(data.old_password)) {
-				data.password = data.new_password
+			var data = util.cleanQuery(req.body)
+			if (data.new_password.length) {
+				if (req.user.checkPassword(data.old_password)) {
+					res.json({ error: { errors: { username: { message: "Old password is incorrect" } } } })
+				}
+				
+				var shasum = crypto.createHash('sha1')
+				shasum.update(data.new_password)
+				password = shasum.digest('hex');
+				
+				req.user.password = password
 			}
 			delete data.old_password
 			delete data.new_password
+			delete data.isAdmin
+			_.extend( req.user, data )
+			req.user.save(function(err, msg) {
+				err ? res.json({ status: "FAIL", error: err })
+					: res.json({ status: "OK", payload: req.user })
+			})
 		}
 	}
 
diff --git a/server/lib/auth.js b/server/lib/auth.js
index e7b7a75..5a952f5 100644
--- a/server/lib/auth.js
+++ b/server/lib/auth.js
@@ -72,7 +72,22 @@ var auth = {
 			failureRedirect: '/login'
 		});
 	},
-	
+
+	loggedInLocal: function (req, res, next) {
+		passport.authenticate("local", function(err, user, info){
+			if (err) {
+				return res.json({ error: err });
+			}
+			if (! user) {
+				return info ? res.json(info) : res.redirect("/login");
+			}
+			req.logIn(user, function(err) {
+				if (err) { return next(err); }
+				return res.json({ status: "OK" })
+			});
+		})(req, res, next);
+	},
+
 	logout: function (req, res) {
 		req.logout();
 		res.redirect('/');
diff --git a/server/lib/util.js b/server/lib/util.js
index 7a63507..88d16cb 100644
--- a/server/lib/util.js
+++ b/server/lib/util.js
@@ -1,4 +1,6 @@
 
+var _ = require('lodash');
+
 var whitespaceHead = /^\s+/
 var whitespaceTail = /\s+$/
 
diff --git a/server/lib/views.js b/server/lib/views.js
index 4f2402b..224dd3f 100644
--- a/server/lib/views.js
+++ b/server/lib/views.js
@@ -18,15 +18,12 @@ views.home = function (req, res) {
 }
 
 views.profile = function (req, res) {
-	var username = req.params[0]
+	var username = req.params[0] || req.user.username
 	if (username) {
 		User.findOne({ username: username }, function (err, user) {
 			user ? next(user) : done(err, {}, [])
 		})
 	}
-	else if (req.user) {
-		next(req.user)
-	}
 	else {
 		done()
 	}
diff --git a/views/partials/edit-profile.ejs b/views/partials/edit-profile.ejs
index a9a5a9a..1a288db 100644
--- a/views/partials/edit-profile.ejs
+++ b/views/partials/edit-profile.ejs
@@ -3,13 +3,19 @@
 	<div id="form_container">
 
 		<form enctype="multipart/form-data" method="post">
-				
+			<input type="hidden" name="_csrf" value="[[- token ]]">
 			<ul>
 				<li class="section_break">
 					<h3>Edit Profile</h3>
 				</li>
 				<li>
-					<label class="description" for="profile_displayName">Name:</label>
+					<label class="description" for="profile_displayName">Username:</label>
+					<div>
+					<div id="profile_username"></div>
+					</div>
+				</li>
+				<li>
+					<label class="description" for="profile_displayName">Display Name:</label>
 					<div>
 					<input id="profile_displayName" name="displayName" class="element text" type="text" maxlength="255">
 					</div>
@@ -21,6 +27,12 @@
 					</div> 
 				</li>
 				<li>
+					<label class="description" for="profile_website">Location:</label>
+					<div>
+						<input id="profile_location" name="location" class="element text medium" type="text" maxlength="255"> 
+					</div> 
+				</li>
+				<li>
 					<label class="description" for="profile_website">Website:</label>
 					<div>
 						<input id="profile_website" name="website" class="element text medium" type="text" maxlength="255"> 
@@ -29,13 +41,13 @@
 				<li>
 					<label class="description" for="profile_twitter">Twitter:</label>
 					<div>
-						<input id="profile_twitter" name="twitter" class="element text medium" type="text" maxlength="255">
+						<input id="profile_twitter" name="twitterName" class="element text medium" type="text" maxlength="255">
 					</div> 
 				</li>		
 				<li>
 					<label class="description" for="profile_facebook">Facebook:</label>
 					<div>
-						<input id="profile_facebook" name="facebook" class="element text medium" type="text" maxlength="255"> 
+						<input id="profile_facebook" name="facebookUrl" class="element text medium" type="text" maxlength="255"> 
 					</div> 
 				</li>		
 				<li>
@@ -43,10 +55,11 @@
 					<div>
 						<input id="profile_avatar" name="avatar" class="element file" type="file"/> 
 					</div>
-					<p class="guidelines" id="guide_1"><small>please choose a picture at least 500px wide</small></p> 
+					<p class="guidelines"><img id="load_avatar"><small>please choose a picture at least 500px wide</small></p> 
 				</li>		
+
 				<li class="section_break">
-					<h3>Edit Password</h3>
+					<h3>Change Password</h3>
 				</li>
 				<li>
 					<label class="description" for="profile_old_password">Old Password:</label>
@@ -55,9 +68,9 @@
 					</div> 
 				</li>		
 				<li>
-					<label class="description" for="profile_password">New Password:</label>
+					<label class="description" for="profile_new_password">New Password:</label>
 					<div>
-						<input id="profile_password" name="new_password" class="element text medium" type="password" maxlength="255">
+						<input id="profile_new_password" name="new_password" class="element text medium" type="password" maxlength="255">
 					</div> 
 				</li>		
 				<li>
diff --git a/views/partials/header.ejs b/views/partials/header.ejs
index c706aa1..e0e98c2 100644
--- a/views/partials/header.ejs
+++ b/views/partials/header.ejs
@@ -2,7 +2,7 @@
 
 <span class="topLinks">
 [[ if (logged_in) { ]]
-	[[ if (profile && user._id == profile._id) { ]]
+	[[ if (profile && String(user._id) == String(profile._id)) { ]]
 	<a href="/profile" data-role="edit-profile-modal" class="topLink editProfile">Edit Profile <span class="icon-ios7-gear-outline"></span></a>
 	[[ } else if (! profile) { ]]
 	<a href="/profile" class="topLink">View Profile</a>
diff --git a/views/partials/scripts.ejs b/views/partials/scripts.ejs
index fdb2229..5501c26 100644
--- a/views/partials/scripts.ejs
+++ b/views/partials/scripts.ejs
@@ -43,9 +43,10 @@
 <script type="text/javascript" src="/assets/javascripts/mx/extensions/mx.movements.js"></script>
 <script type="text/javascript" src="/assets/javascripts/mx/primitives/mx.image.js"></script>
 
-<script type="text/javascript" src="/assets/javascripts/ui/ModalView.js"></script>
-<script type="text/javascript" src="/assets/javascripts/ui/ModalFormView.js"></script>
-<script type="text/javascript" src="/assets/javascripts/ui/MasterView.js"></script>
+<script type="text/javascript" src="/assets/javascripts/vendor/ModalView.js"></script>
+<script type="text/javascript" src="/assets/javascripts/vendor/ModalFormView.js"></script>
+
+<script type="text/javascript" src="/assets/javascripts/ui/Router.js"></script>
 <script type="text/javascript" src="/assets/javascripts/ui/SignInModal.js"></script>
 <script type="text/javascript" src="/assets/javascripts/ui/SignUpModal.js"></script>
 <script type="text/javascript" src="/assets/javascripts/ui/NewProjectModal.js"></script>