Improve feedback on login/register forms

This commit is contained in:
James Allen 2014-07-11 17:08:19 +01:00
parent 1c5778e2c4
commit e4d9d03f55
4 changed files with 24 additions and 20 deletions

View file

@ -16,9 +16,9 @@ module.exports = AuthenticationController =
if !isAllowed if !isAllowed
logger.log email:email, "too many login requests" logger.log email:email, "too many login requests"
res.statusCode = 429 res.statusCode = 429
return res.send return res.send
message: message:
text: 'This account has had too many login requests, <br> please wait 2 minutes before trying to log in again', text: 'This account has had too many login requests. Please wait 2 minutes before trying to log in again',
type: 'error' type: 'error'
AuthenticationManager.authenticate email: email, password, (error, user) -> AuthenticationManager.authenticate email: email, password, (error, user) ->
return next(error) if error? return next(error) if error?
@ -100,7 +100,7 @@ module.exports = AuthenticationController =
callback() callback()
_establishUserSession: (req, user, callback = (error) ->) -> _establishUserSession: (req, user, callback = (error) ->) ->
lightUser = lightUser =
_id: user._id _id: user._id
first_name: user.first_name first_name: user.first_name
last_name: user.last_name last_name: user.last_name
@ -110,7 +110,3 @@ module.exports = AuthenticationController =
req.session.user = lightUser req.session.user = lightUser
req.session.justLoggedIn = true req.session.justLoggedIn = true
req.session.save callback req.session.save callback

View file

@ -35,7 +35,9 @@ block content
| Required | Required
.actions .actions
button.btn-primary.btn( button.btn-primary.btn(
type='submit' type='submit',
ng-disabled="loginForm.$invalid" ng-disabled="loginForm.inflight"
) Login )
span(ng-show="!loginForm.inflight") Login
span(ng-show="loginForm.inflight") Logging in...
a.pull-right(href='/user/password/reset') Forgot your password? a.pull-right(href='/user/password/reset') Forgot your password?

View file

@ -10,7 +10,7 @@ block content
div Join ShareLaTeX to view this project div Join ShareLaTeX to view this project
else if newTemplateData.templateName !== undefined else if newTemplateData.templateName !== undefined
h1 Please register to edit the '#{newTemplateData.templateName}' template h1 Please register to edit the '#{newTemplateData.templateName}' template
div Already have a ShareLaTeX account? div Already have a ShareLaTeX account?
a(href="/login") Login here a(href="/login") Login here
.row .row
@ -18,12 +18,12 @@ block content
.card .card
.page-header .page-header
h1 Register h1 Register
form(async-form="register", name="registerForm", action="/register", novalidate, ng-cloak) form(async-form="register", name="registerForm", action="/register", ng-cloak)
input(name='_csrf', type='hidden', value=csrfToken) input(name='_csrf', type='hidden', value=csrfToken)
input(name='redir', type='hidden', value=redir) input(name='redir', type='hidden', value=redir)
form-messages(for="registerForm") form-messages(for="registerForm")
.form-group .form-group
label(for='email') Email label(for='email') Email
input.form-control( input.form-control(
type='email', type='email',
name='email', name='email',
@ -36,7 +36,7 @@ block content
span.small.text-primary(ng-show="registerForm.email.$invalid && registerForm.email.$dirty") span.small.text-primary(ng-show="registerForm.email.$invalid && registerForm.email.$dirty")
| Must be an email address | Must be an email address
.form-group .form-group
label(for='password') Password label(for='password') Password
input.form-control( input.form-control(
type='password', type='password',
name='password', name='password',
@ -49,6 +49,7 @@ block content
.actions .actions
button.btn-primary.btn( button.btn-primary.btn(
type='submit' type='submit'
ng-disabled="register.$invalid" ng-disabled="registerForm.inflight"
) Register )
span(ng-show="!registerForm.inflight") Register
span(ng-show="registerForm.inflight") Registering...

View file

@ -7,6 +7,7 @@ define [
formName = attrs.asyncForm formName = attrs.asyncForm
scope[attrs.name].response = response = {} scope[attrs.name].response = response = {}
scope[attrs.name].inflight = false
element.on "submit", (e) -> element.on "submit", (e) ->
e.preventDefault() e.preventDefault()
@ -15,9 +16,12 @@ define [
for data in element.serializeArray() for data in element.serializeArray()
formData[data.name] = data.value formData[data.name] = data.value
scope[attrs.name].inflight = true
$http $http
.post(element.attr('action'), formData) .post(element.attr('action'), formData)
.success (data, status, headers, config) -> .success (data, status, headers, config) ->
scope[attrs.name].inflight = false
response.success = true response.success = true
response.error = false response.error = false
@ -33,12 +37,13 @@ define [
ga('send', 'event', formName, 'failure', data.message) ga('send', 'event', formName, 'failure', data.message)
else else
ga('send', 'event', formName, 'success') ga('send', 'event', formName, 'success')
.error (data, status, headers, config) -> .error (data, status, headers, config) ->
scope[attrs.name].inflight = false
response.success = false response.success = false
response.error = true response.error = true
response.message = response.message =
text: data.message or "Something went wrong talking to the server :(. Please try again." text: data.message?.text or "Something went wrong talking to the server :(. Please try again."
type: 'error' type: 'error'
ga('send', 'event', formName, 'failure', data.message) ga('send', 'event', formName, 'failure', data.message)
} }
@ -60,4 +65,4 @@ define [
form: "=for" form: "=for"
} }
} }