gaspersic/freeCodeCamp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Add Update Email View

Browse Source 
This commit:

- Displays the user's email that we have on records
- Adds a button in the settings to update email
- Adds a form view to update the email
- Fixes CSS for the Email icons and the email form
                         ~ Credits to @hallaathrad

- Linting fixes and updated with Berkeley's Comments

- Streamline checks and fix scope

- Add AJAX Calls

- Add flash messages

- Update the views & add XHR value
This commit is contained in:
Mrugesh Mohapatra
2016-04-22 02:17:59 +05:30
parent c8a06f008b
commit 3d55b9bb8b
6 changed files with 189 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
server/boot/user.js
View File

@@ -149,6 +149,7 @@ module.exports = function(app) {
router.get('/email-signup', getEmailSignup);
router.get('/email-signin', getEmailSignin);
router.get('/deprecated-signin', getDepSignin);
router.get('/email-update', getUpdateEmail);
router.get(
'/toggle-lockdown-mode',
sendNonUserToMap,
@@ -226,6 +227,7 @@ module.exports = function(app) {
res.redirect('/');
}
function getDepSignin(req, res) {
if (req.user) {
return res.redirect('/');
@@ -235,6 +237,15 @@ module.exports = function(app) {
});
}
function getUpdateEmail(req, res) {
if (!req.user) {
return res.redirect('/');
}
return res.render('account/email-update', {
title: 'Update your Email'
});
}
function getEmailSignin(req, res) {
if (req.user) {
return res.redirect('/');

58
server/views/account/email-update.jade Normal file
View File

@@ -0,0 +1,58 @@
extends ../layout
block content
.container
.row.flashMessage.negative-30
.col-xs-12
#flash-board.alert.fade.in(style='display: none;')
button.close(type='button', data-dismiss='alert')
span.ion-close-circled#flash-close
#flash-content
h2.text-center Update your email address here:
form.form-horizontal.email-update(method='POST', action='/api/users/#{user.id}/email-update', name="updateEmailForm")
.row
.col-sm-6.col-sm-offset-3
input(type='hidden', name='_csrf', value=_csrf)
.form-group
input.input-lg.form-control(type='email', name='email', id='email', placeholder='Enter your new email', autofocus, required, autocomplete="off")
.form-group
button.btn.btn-lg.btn-primary.btn-block(type='submit')
| Update my Email
a.btn.btn-lg.btn-block.btn-primary.btn-link-social(href='/settings')
| Go back to Settings
script.
$(document).ready(function() {
$('form').submit(function(event){
event.preventDefault();
$('#flash-board').hide();
var $form = $(event.target);
$.ajax({
type : 'POST',
url : $form.attr('action'),
data : $form.serialize(),
dataType : 'json',
encode : true,
xhrFields : { withCredentials: true }
})
.fail(error => {
if (error.responseText){
var data = JSON.parse(error.responseText);
if(data.error && data.error.message)
$('#flash-content').html(data.error.message);
$('#flash-board')
.removeClass('alert-success')
.addClass('alert-danger')
.fadeIn();
}
})
.done(data =>{
if(data.status && data.status.count){
$('#flash-content').html("Your email has been updated successfully!");
$('#flash-board')
.removeClass('alert-danger')
.addClass('alert-success')
.fadeIn();
}
});
});
});

88
server/views/account/settings.jade
View File

@@ -48,43 +48,61 @@ block content
.spacer
h2.text-center Email settings
.row
.col-xs-12.col-sm-8.col-sm-offset-2.col-md-6.col-md-offset-3
.row
.col-xs-9
p.large-p Send me announcement emails
br
| (we'll send you these every Thursday)
if (user.sendMonthlyEmail)
.col-xs-3
a.btn.btn-lg.btn-primary.btn-block.active.positive-20(href='/toggle-announcement-email-mode') On
else
.col-xs-3
a.btn.btn-lg.btn-primary.btn-block.positive-20(href='/toggle-announcement-email-mode') Off
if(user.email)
.row
.col-xs-12
p.large-p.text-center
em #{user.email}
.col-xs-12
a.btn.btn-lg.btn-block.btn-primary.btn-link-social(href='/email-update')
i.fa.fa-envelope
| Update my Email
.row
.col-xs-12.col-sm-8.col-sm-offset-2.col-md-6.col-md-offset-3
.row
.col-xs-9
p.large-p Send me announcement emails
br
| (we'll send you these every Thursday)
if (user.sendMonthlyEmail)
.col-xs-3
a.btn.btn-lg.btn-primary.btn-block.active.positive-20(href='/toggle-announcement-email-mode') On
else
.col-xs-3
a.btn.btn-lg.btn-primary.btn-block.positive-20(href='/toggle-announcement-email-mode') Off
.row
.col-xs-9
p.large-p Send me notification emails
br
| (these will pertain to your account)
if (user.sendNotificationEmail)
.col-xs-3
a.btn.btn-lg.btn-primary.btn-block.active.positive-20(href='/toggle-notification-email-mode') On
else
.col-xs-3
a.btn.btn-lg.btn-primary.btn-block.positive-20(href='/toggle-notification-email-mode') Off
.row
.col-xs-9
p.large-p Send me notification emails
br
| (these will pertain to your account)
if (user.sendNotificationEmail)
.col-xs-3
a.btn.btn-lg.btn-primary.btn-block.active.positive-20(href='/toggle-notification-email-mode') On
else
.col-xs-3
a.btn.btn-lg.btn-primary.btn-block.positive-20(href='/toggle-notification-email-mode') Off
.row
.col-xs-9
p.large-p Send me Quincy's weekly email
br
| (with new articles every Tuesday)
if (user.sendQuincyEmail)
.col-xs-3
a.btn.btn-lg.btn-primary.btn-block.active.positive-20(href='/toggle-quincy-email-mode') On
else
.col-xs-3
a.btn.btn-lg.btn-primary.btn-block.positive-20(href='/toggle-quincy-email-mode') Off
.row
.col-xs-9
p.large-p Send me Quincy's weekly email
br
| (with new articles every Tuesday)
if (user.sendQuincyEmail)
.col-xs-3
a.btn.btn-lg.btn-primary.btn-block.active.positive-20(href='/toggle-quincy-email-mode') On
else
.col-xs-3
a.btn.btn-lg.btn-primary.btn-block.positive-20(href='/toggle-quincy-email-mode') Off
else
.row
.col-xs-12
p.large-p.text-center
| You don't have an email id associated to this account.
.col-xs-12
a.btn.btn-lg.btn-block.btn-primary.btn-link-social(href='/email-update')
i.fa.fa-envelope
| Update my Email
.spacer
h2.text-center Danger Zone