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

fix: Re-enable button and add disable styles

Browse Source
This commit is contained in:
Mrugesh Mohapatra
2018-01-05 12:53:26 +05:30
parent 07ca7c4376
commit 7d2e9bc15e
1 changed files with 33 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
server/views/account/email-signin.jade
View File

@ -10,16 +10,15 @@ block content
#flash-content #flash-content
.row .row
.text-center .text-center
h2 Sign in or Sign Up with an Email h2 Sign in or Sign Up with an Email here:
.button-spacer .button-spacer
div#sign-in-form
.col-sm-6.col-sm-offset-3 .col-sm-6.col-sm-offset-3
form(method='POST', action='/passwordless-auth') form(method='POST', action='/passwordless-auth')
input(type='hidden', name='_csrf', value=_csrf) input(type='hidden', name='_csrf', value=_csrf)
.form-group .form-group
input.input-lg.form-control(type='email', name='email', id='email', placeholder='Email', autofocus=true, required) input.input-lg.form-control(type='email', name='email', id='email', placeholder='Email', autofocus=true, required)
.button-spacer .button-spacer
button.btn.btn-primary.btn-lg.btn-block(type='submit') button#magic-btn.btn.btn-primary.btn-lg.btn-block(type='submit')
span.fa.fa-envelope span.fa.fa-envelope
| Get a magic link to sign in. | Get a magic link to sign in.
.row .row
@ -36,12 +35,16 @@ block content
script. script.
$(document).ready(function() { $(document).ready(function() {
function disableMagicButton () { function disableMagicButton (isDisabled) {
var userEmail = $("input[name=email]").val(); if (isDisabled) {
$('#sign-in-form') $('#magic-btn')
.empty() .prop('disabled', true)
.html('<h3 class="text-center"> OK - we are sending a magic link to ' + userEmail + ' </h3>') .html('<span style="color:#E0E0E0;"><i class="fa fa-circle-o-notch fa-spin fa-fw"></i>Ok - We will attempt sending to the email above.</span>');
.fadeIn(100); } else {
$('#magic-btn')
.prop('disabled', true)
.html('<span style="color:#E0E0E0;">Did not get a link? Reload the page and resend again.</span>');
}
} }
$('form').submit(function(event){ $('form').submit(function(event){
@ -60,7 +63,7 @@ block content
.fail(error => { .fail(error => {
if (error.responseText){ if (error.responseText){
var data = JSON.parse(error.responseText); var data = JSON.parse(error.responseText);
if(data.error && data.error.message) if(data.error && data.error.message) {
$('#flash-content').html(data.error.message); $('#flash-content').html(data.error.message);
$('#flash-board') $('#flash-board')
.removeClass('alert-success') .removeClass('alert-success')
@ -68,6 +71,8 @@ block content
.slideDown(400) .slideDown(400)
.delay(800) .delay(800)
.fadeIn(); .fadeIn();
disableMagicButton(false);
}
} }
}) })
.done(data => { .done(data => {
@ -93,6 +98,7 @@ block content
.slideDown(400) .slideDown(400)
.delay(800) .delay(800)
.fadeIn(); .fadeIn();
disableMagicButton(false);
} }
}); });
}); });