LT-102: Send a email which includes password reset link if Forgot Password option is selected

- Add custom Reset Password template  and reset password
- Show the first error instead showing all errors of invalidated input values in Sign Up and changePassword templates
This commit is contained in:
Aysel Afsar 2016-03-16 10:28:07 -04:00
parent 28ba53b328
commit a5d4c6d0eb
8 changed files with 205 additions and 26 deletions

View File

@ -6,10 +6,11 @@ Meteor.startup(function () {
var server = Meteor.settings && Meteor.settings.mailServerSettings && Meteor.settings.mailServerSettings.server || null;
var port = Meteor.settings && Meteor.settings.mailServerSettings && Meteor.settings.mailServerSettings.port || null;
var verifyEmail = Meteor.settings && Meteor.settings.public && Meteor.settings.public.verifyEmail || false;
var siteName = Meteor.settings && Meteor.settings.public && Meteor.settings.public.siteName || "Lesion Tracker";
if (verifyEmail && username && password && server && port) {
Accounts.emailTemplates.siteName = 'Lesion Tracker';
Accounts.emailTemplates.from = 'Lesion Tracker Admin <'+username+'>';
if (username && password && server && port) {
Accounts.emailTemplates.siteName = siteName;
Accounts.emailTemplates.from = siteName+' Admin <'+username+'>';
process.env.MAIL_URL = 'smtp://' +
encodeURIComponent(username) + ':' +
@ -18,7 +19,7 @@ Meteor.startup(function () {
// Subject line of the email.
Accounts.emailTemplates.verifyEmail.subject = function(user) {
return 'Confirm Your Email Address for Lesion Tracker';
return 'Confirm Your Email Address for '+siteName;
};
// Email text
@ -26,9 +27,24 @@ Meteor.startup(function () {
return 'Thank you for registering. Please click on the following link to verify your email address: \r\n' + url;
};
// Reset password mail
Accounts.emailTemplates.resetPassword.subject = function() {
return 'Reset your '+siteName+' password'
};
Accounts.urls.resetPassword = function(token) {
return Meteor.absoluteUrl('resetPassword/' + token);
};
Accounts.emailTemplates.resetPassword.text = function(user, url) {
return "Hello " + user.profile.fullName + ",\n\n" +
"Click the following link to set your new password:\n" +
url + "\n\n";
};
// Send email when account is created
Accounts.config({
sendVerificationEmail: true
sendVerificationEmail: verifyEmail
});
}
});

View File

@ -8,9 +8,9 @@
<div id="changePasswordPageMessage" class="subtitle-auth" style="{{getChangePasswordMessageColor}}">{{getChangePasswordMessage}}</div>
<form>
{{#if entryErrorMessages}}
{{#if changePasswordErrorMessages}}
<div id="errorMessages" class="list-errors">
{{#each entryErrorMessages}}
{{#each changePasswordErrorMessages}}
<div class="alert alert-danger list-item">{{this}}</div>
{{/each}}
</div>

View File

@ -46,14 +46,19 @@ Template.changePassword.helpers({
}
},
entryErrorMessages: function() {
var errorMessages = [];
Object.keys(ActiveEntry.errorMessages.all()).forEach(function(key) {
if ((key === "password" || key === "confirm") && ActiveEntry.errorMessages.get(key)) {
errorMessages.push(ActiveEntry.errorMessages.get(key));
}
changePasswordErrorMessages: function() {
var allErrorMessages = Object.keys(ActiveEntry.errorMessages.all()).filter(function(key) {
return (key === "password" || key === "confirm") && ActiveEntry.errorMessages.get(key);
});
return errorMessages;
if (allErrorMessages.length > 0) {
var errorMessage = ActiveEntry.errorMessages.get(allErrorMessages[0]);
if (errorMessage) {
return [errorMessage];
}
}
return;
}
});

View File

@ -30,13 +30,18 @@ Template.entrySignUp.helpers({
}
},
entryErrorMessages: function () {
var errorMessages = [];
Object.keys(ActiveEntry.errorMessages.all()).forEach(function(key) {
if (key !== "signInError" && ActiveEntry.errorMessages.get(key)) {
errorMessages.push(ActiveEntry.errorMessages.get(key));
}
var allErrorMessages = Object.keys(ActiveEntry.errorMessages.all()).filter(function(key) {
return key !== "signInError" && ActiveEntry.errorMessages.get(key);
});
return errorMessages;
if (allErrorMessages.length > 0) {
var errorMessage = ActiveEntry.errorMessages.get(allErrorMessages[0]);
if (errorMessage) {
return [errorMessage];
}
}
return;
},
getButtonText: function () {
if (ActiveEntry.errorMessages.get('signInError')) {

View File

@ -5,7 +5,8 @@
<div class="entryLogo" style="background-image: url('{{getLogoUrl}}')"></div>
<h1 id="signInPageTitle" class="title-auth">Forgot Password</h1>
<div id="signInPageMessage" class="subtitle-auth" >Imdivrove your clincal practice with checklists.</div>
<div id="signInPageMessage" class="subtitle-auth" >Improve your clinical practice with checklists.</div>
<p id="signInPageMessage" class="subtitle-auth" style="{{getForgotPasswordMessageColor}}">{{{getForgotPasswordMessage}}}</p>
<form>
<div class="input-symbol">
@ -15,6 +16,11 @@
<br><br>
<button id="sendReminderButton" type="submit" class="btn-gray btn-main btn-large" style="{{getButtonColor}}">Send Reminder</button><br><br>
{{#if forgotPasswordNotification}}
<div class="alert alert-success">
{{{forgotPasswordNotification}}}
</div>
{{/if}}
</form>
</div>
@ -22,3 +28,45 @@
</div>
</div>
</template>
<template name="resetPassword">
{{#if resetPassword}}
<div id="resetPassword" class="page entryPage" style="{{getOpacityWithCorner}}">
<div class="content-scrollable">
<div class="wrapper-auth">
<div class="entryLogo" style="background-image: url('{{getLogoUrl}}')"></div>
<h1 id="signInPageTitle" class="title-auth">Reset Password</h1>
<div id="signInPageMessage" class="subtitle-auth" >Improve your clinical practice with checklists.</div>
<form>
{{#if resetPasswordErrorMessages}}
<div id="errorMessages" class="list-errors">
{{#each resetPasswordErrorMessages}}
<div class="alert alert-danger list-item">{{this}}</div>
{{/each}}
</div>
{{/if}}
<div class="input-symbol ">
<input id="resetPasswordInput" type="password" name="password" placeholder="Password" style="{{getPasswordStyling}}" />
<span class="fa fa-lock" title="Password"></span>
<!-- <span class="icon-lock" title="Password"></span> -->
</div>
<br>
<br>
<div class="input-symbol">
<input id="resetPasswordConfirmInput" type="password" name="confirm" placeholder="Confirm Password" style="{{getConfirmPasswordStyling}}" />
<span class="fa fa-lock" title="Confirm Password"></span>
<!-- <span class="icon-lock" title="Confirm Password"></span> -->
</div>
<br>
<br>
</form>
<button id="resetPasswordButton" type="submit" class="btn-gray btn-main btn-large" style="{{getButtonColor}}">Reset Password</button><br><br>
</div>
</div>
</div>
{{/if}}
</template>

View File

@ -5,11 +5,33 @@ Router.route('/forgotPassword', {
template: "forgotPassword"
});
Router.route('/resetPassword/:token', {
template: 'resetPassword',
name: 'resetPassword',
onBeforeAction: function() {
var token = this.params.token;
Session.set('_resetPasswordToken', token);
this.next();
}
});
Template.forgotPassword.helpers({
getForgotPasswordStyle: function (){
return "border: 1px solid gray";
}
getForgotPasswordMessageColor: function (){
if (ActiveEntry.errorMessages.get('forgotPassword')) {
return "color: #a94442; background-color: #f2dede; border-color: #ebccd1;"
} else {
return "color: black;"
}
},
getForgotPasswordMessage: function (){
return ActiveEntry.errorMessages.get('forgotPassword');
},
getForgotPasswordStyle: function (){
return "border: 1px solid gray";
},
forgotPasswordNotification: function() {
return ActiveEntry.successMessages.get("forgotPassword");
}
});
Template.forgotPassword.events({
@ -17,6 +39,46 @@ Template.forgotPassword.events({
event.preventDefault();
console.log('send reminder!');
Accounts.forgotPassword({email: $('#signInPageEmailInput').val()});
var emailAddress = $('#signInPageEmailInput').val();
ActiveEntry.forgotPassword(emailAddress);
}
});
// Reset password template
Template.resetPassword.helpers({
resetPassword: function(){
return Session.get('_resetPasswordToken');
},
resetPasswordErrorMessages: function() {
if (ActiveEntry.errorMessages.get("password")) {
return [ActiveEntry.errorMessages.get("password")];
}
if (ActiveEntry.errorMessages.get("confirm")) {
return [ActiveEntry.errorMessages.get("confirm")];
}
return;
}
});
Template.resetPassword.events({
'keyup #resetPasswordInput': function (event, template) {
var password = $('#resetPasswordInput').val();
ActiveEntry.verifyPassword(password);
ActiveEntry.errorMessages.set('forgotPassword', null);
},
'keyup #resetPasswordConfirmInput': function (event, template) {
var password = $('#resetPasswordInput').val();
var confirmPassword = $('#resetPasswordConfirmInput').val();
ActiveEntry.verifyConfirmPassword(password, confirmPassword);
ActiveEntry.errorMessages.set('forgotPassword', null);
},
'click #resetPasswordButton': function(e, template) {
e.preventDefault();
var password = $('#resetPasswordInput').val();
var passwordConfirm = $('#resetPasswordConfirmInput').val();
ActiveEntry.resetPassword(password, passwordConfirm);
}
});

View File

@ -263,6 +263,47 @@ ActiveEntry.signUp = function (emailValue, passwordValue, confirmPassword, fullN
});
};
ActiveEntry.forgotPassword = function(emailAddress) {
ActiveEntry.verifyEmail(emailAddress);
ActiveEntry.errorMessages.set("forgotPassword", null);
ActiveEntry.successMessages.set("forgotPassword", null);
if (ActiveEntry.errorMessages.get("email")) {
return;
}
Accounts.forgotPassword({email:emailAddress }, function(error){
if (error) {
console.warn(error.message);
ActiveEntry.errorMessages.set("forgotPassword", error.message);
return;
}
// Show email sent notification
ActiveEntry.successMessages.set("forgotPassword", "Your password reset email is sent to <strong>"+emailAddress+"</strong>");
});
};
ActiveEntry.resetPassword = function(passwordValue, confirmPassword) {
ActiveEntry.verifyPassword(passwordValue);
ActiveEntry.verifyConfirmPassword(passwordValue, confirmPassword);
ActiveEntry.errorMessages.set("resetPassword", null);
// Check error messages
if (ActiveEntry.errorMessages.get("password") || ActiveEntry.errorMessages.get("confirm")) {
return;
}
Accounts.resetPassword(Session.get('_resetPasswordToken'), passwordValue, function(error) {
if (error) {
ActiveEntry.errorMessages.set("resetPassword", error.message);
return;
}
Session.set('_resetPasswordToken', null);
var ActiveEntryConfig = Session.get('Photonic.ActiveEntry');
Router.go(ActiveEntryConfig.signIn.destination);
});
};
// Insert hashed password in previousPasswords fields
ActiveEntry.insertHashedPassword = function(passwordValue) {
var ActiveEntryConfig = Session.get('Photonic.ActiveEntry');

View File

@ -1,6 +1,8 @@
#entrySignIn.entryPage,
#entrySignUp.entryPage,
#changePassword
#changePassword,
#forgotPassword,
#resetPassword
.wrapper-auth
.title-auth
color: white