Skip to content

Commit

Permalink
Merge branch 'main' of https://github.com/neilshaabi/mindli
Browse files Browse the repository at this point in the history
  • Loading branch information
@neilshaabi
neilshaabi committed Feb 25, 2024
2 parents 4fb9fbe + bce1131 commit a9bbdf9
Show file tree
Hide file tree
Showing 6 changed files with 78 additions and 155 deletions.
6 changes: 5 additions & 1 deletion app/static/css/main.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -343,7 +343,7 @@ input:-webkit-autofill:focus {

.flashed-message {
color: var(--dark-grey-text);
background: var(--light-grey-bg);
background: white;
border: none;
z-index: 99;
margin: 0;
Expand All @@ -355,3 +355,7 @@ input:-webkit-autofill:focus {
text-align: left;
box-shadow: var(--my-box-shadow);
}

.sidebar-layout .flashed-message {
left: var(--sidebar-width);
}
185 changes: 52 additions & 133 deletions app/static/js/forms.js
View file
Original file line number Diff line number Diff line change
@@ -1,47 +1,55 @@
// Toggles loading button
function showLoadingBtn(isLoading) {
if (isLoading == true) {
function handleSubmitForm(formID, endpoint) {

$('#' + formID).on('submit', function(event) {

event.preventDefault();

// Show loading button
$(":input[type='submit']").prop('disabled', true);
$('.btn-text').hide();
$('.spinner-border').show();
} else {
$(":input[type='submit']").prop('disabled', false);
$('.btn-text').show();
$('.spinner-border').hide();
}
}

// Function to display error messages
function displayFormErrors(errors) {
for (const key in errors) {
const inputField = $('#' + key);
const errorMessage = $(
'<div class="error-message">'
+ '<i class="fa-solid fa-circle-exclamation"></i> '
+ errors[key]
+ '</div>'
);
inputField.after(errorMessage);
inputField.addClass('input-error');
}
var formData = $(this).serialize();
formData += "&form-id=" + $(this).attr('id');

$.post(endpoint, formData, function(data) {

// Hide loading button
$(":input[type='submit']").prop('disabled', false);
$('.btn-text').show();
$('.spinner-border').hide();

// Clear previous errors
$('.error-message').remove();
$('.input-error').removeClass('input-error');

if (response.success) {

// Redirect if url returned
if (response.url) {
window.location = response.url;
}
} else {

// Display error messages for each input field
if (response.errors) {
for (const key in response.errors) {
const inputField = $('#' + key);
const errorMessage = $(
'<div class="error-message">'
+ '<i class="fa-solid fa-circle-exclamation"></i> '
+ response.errors[key]
+ '</div>'
);
inputField.after(errorMessage);
inputField.addClass('input-error');
}
}
}
});
});
}

function ajaxFormResponseHandler(response) {

// Clear previous errors
$('.error-message').remove();
$('.input-error').removeClass('input-error');

if (response.success) {
if (response.url) {
window.location = response.url;
}
} else {
if (response.errors) {
displayFormErrors(response.errors);
}
}
}

$(document).ready(function() {

Expand All @@ -61,99 +69,10 @@ $(document).ready(function() {
}
});



// Registration handler using AJAX
$('#register-form').on('submit', function(event) {

event.preventDefault();
showLoadingBtn(true);

$.post('/register', {
'role': $('input[name="role"]:checked').attr('id'),
'first_name': $('#first_name').val(),
'last_name': $('#last_name').val(),
'email': $('#email').val(),
'password': $('#password').val()
},
function(data) {
showLoadingBtn(false);
ajaxFormResponseHandler(data);
});
});


// Login handler using AJAX
$('#login-form').on('submit', function(event) {

event.preventDefault();
showLoadingBtn(true);

$.post(
'/login', {
'email': $('#email').val(),
'password': $('#password').val()
},
function(data) {
showLoadingBtn(false);
ajaxFormResponseHandler(data);
}
);
});


// Resend email verification handler using AJAX
$('#verify-email-form').on('submit', function(event) {

event.preventDefault();
showLoadingBtn(true);

$.post(
'/verify-email', {},
function(data) {
showLoadingBtn(false);
ajaxFormResponseHandler(data);
}
);
});


// Password reset request handler using AJAX
$('#initiate-password-reset-form').on('submit', function(event) {

event.preventDefault();
showLoadingBtn(true);

$.post(
'/reset-password', {
'form-type': 'initiate_password_reset',
'email': $('#email').val()
},
function(data) {
showLoadingBtn(false);
ajaxFormResponseHandler(data);
}
);
});


// Password reset handler using AJAX
$('#reset-password-form').on('submit', function(event) {

event.preventDefault();
showLoadingBtn(true)

$.post(
'/reset-password', {
'form-type': 'reset_password',
'email': $('#email').val(),
'password': $('#password').val(),
'password_confirmation': $('#password_confirmation').val()
},
function(data) {
showLoadingBtn(false);
ajaxFormResponseHandler(data);
}
);
});
// Form handlers using AJAX
handleSubmitForm('register-form', '/register');
handleSubmitForm('login-form', '/login');
handleSubmitForm('verify-email-form', '/verify-email');
handleSubmitForm('initiate-password-reset-form', '/reset-password');
handleSubmitForm('reset-password-form', '/reset-password');
});
6 changes: 3 additions & 3 deletions app/templates/login.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,14 +11,14 @@ <h3>Sign in</h3>
<p>Don't have an account? <a href='/register'>Register</a></p>
<form id='login-form'>
<div class='form-floating'>
<input type='email' id='email' placeholder='Email address' class='form-control'>
<input type='email' id='email' name='email' placeholder='Email address' class='form-control'>
<label for='email'>Email address</label>
</div>
<div class='form-floating'>
<input type='password' id='password' placeholder='Password' class='form-control'>
<input type='password' id='password' name='password' placeholder='Password' class='form-control'>
<label for='password'>Password</label>
<button type='button' id='togglePassword'>
<i class="fa-solid fa-eye"></i>
<i class='fa-solid fa-eye'></i>
</button>
</div>
<div class='description'>
Expand Down
24 changes: 12 additions & 12 deletions app/templates/register.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,39 +12,39 @@ <h3>Create account</h3>

<form id='register-form'>

<div class="radio-group" id="role">
<input type="radio" class="btn-check" name="role" id="therapist" autocomplete="off">
<label class="btn btn-outline-primary" for="therapist">
<i class="fa-solid fa-check"></i>
<div class='radio-group' id='role'>
<input type='radio' class='btn-check' id='therapist' name='role' value='therapist' autocomplete='off'>
<label class='btn btn-outline-primary' for='therapist'>
<i class='fa-solid fa-check'></i>
Therapist
</label>
<input type="radio" class="btn-check" name="role" id="client" autocomplete="off">
<label class="btn btn-outline-primary" for="client">
<i class="fa-solid fa-check"></i>
<input type='radio' class='btn-check' id='client' name='role' value='client' autocomplete='off'>
<label class='btn btn-outline-primary' for='client'>
<i class='fa-solid fa-check'></i>
Client
</label>
</div>

<div class='form-floating'>
<input type='text' id='first_name' placeholder='First name' class='form-control'>
<input type='text' id='first_name' name='first_name' placeholder='First name' class='form-control'>
<label for='first_name'>First name</label>
</div>

<div class='form-floating'>
<input type='text' id='last_name' placeholder='Last name' class='form-control'>
<input type='text' id='last_name' name='last_name' placeholder='Last name' class='form-control'>
<label for='last_name'>Last name</label>
</div>

<div class='form-floating'>
<input type='email' id='email' placeholder='Email address' class='form-control'>
<input type='email' id='email' name='email' placeholder='Email address' class='form-control'>
<label for='email'>Email</label>
</div>

<div class='form-floating'>
<input type='password' id='password' placeholder='Password' class='form-control'>
<input type='password' id='password' name='password' placeholder='Password' class='form-control'>
<label for='password'>Password</label>
<button type='button' id='togglePassword'>
<i class="fa-solid fa-eye"></i>
<i class='fa-solid fa-eye'></i>
</button>
</div>

Expand Down
6 changes: 3 additions & 3 deletions app/templates/reset-password.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,13 +9,13 @@
<div class='my-container'>
<h3>Reset password</h3>
<form id='reset-password-form'>
<input type='text' readonly class='form-control-plaintext hidden' id='email' value="{{ email }}">
<input type='text' readonly class='form-control-plaintext hidden' id='email' name='email' value="{{ email }}">
<div class='form-floating'>
<input type='password' id='password' placeholder='New password' class='form-control'>
<input type='password' id='password' name='password' placeholder='New password' class='form-control'>
<label for='password'>New password</label>
</div>
<div class='form-floating'>
<input type='password' id='password_confirmation' placeholder='Password confirmation' class='form-control'>
<input type='password' id='password_confirmation' name='password_confirmation' placeholder='Password confirmation' class='form-control'>
<label for='password_confirmation'>Password confirmation</label>
</div>
<div class='description'>
Expand Down
6 changes: 3 additions & 3 deletions app/views/auth.py
View file
Original file line number Diff line number Diff line change
Expand Up @@ -211,9 +211,9 @@ def reset_request() -> Response:

elif request.method == "POST":
errors = {}

# Form submitted to initiate a password reset
if request.form.get("form-type") == "initiate_password_reset":
if request.form.get("form-id") == "initiate-password-reset-form":
# Get form data
email = request.form.get("email").lower()

Expand Down Expand Up @@ -241,7 +241,7 @@ def reset_request() -> Response:
return jsonify({"success": True, "url": url_for("main.index")})

# Form submitted to reset password
elif request.form.get("form-type") == "reset_password":
elif request.form.get("form-id") == "reset-password-form":
# Get form data
email = request.form.get("email")
password = request.form.get("password")
Expand Down

0 comments on commit a9bbdf9

Please sign in to comment.