kevin/hypothetical
1
0
Fork 0
mirror of https://github.com/prurigro/hypothetical.git synced 2024-11-13 20:32:30 -05:00
Code Issues Projects Releases Packages Wiki Activity

Use keydown instead of keyup and preventDefault for the dashboard modals so other input can be ignored, and only reset the submitting variable after the dialog has been closed to avoid the possibility of re-submitting before the dialog is closed

Browse source
This commit is contained in:
Kevin MacMartin 2018-04-26 01:21:14 -04:00
parent cbe6a5eac6
commit 5c6d86405f
1 changed files with 76 additions and 39 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

113
resources/assets/js/dashboard.js vendored
View file

@ -2,21 +2,21 @@ const $loadingModal = $("#loading-modal"),
fadeTime = 250; fadeTime = 250;
// show the loading modal // show the loading modal
const showLoadingModal = function() { function showLoadingModal() {
$loadingModal.css({ $loadingModal.css({
visibility: "visible", visibility: "visible",
opacity: 1 opacity: 1
}); });
}; }
// hide the loading modal // hide the loading modal
const hideLoadingModal = function() { function hideLoadingModal() {
$loadingModal.css({ opacity: 0 }); $loadingModal.css({ opacity: 0 });
setTimeout(function() { setTimeout(function() {
$loadingModal.css({ visibility: "hidden" }); $loadingModal.css({ visibility: "hidden" });
}, fadeTime); }, fadeTime);
}; }
// declare a reverse function for jquery // declare a reverse function for jquery
jQuery.fn.reverse = [].reverse; jQuery.fn.reverse = [].reverse;
@ -31,7 +31,7 @@ function askConfirmation(message, command, cancelCommand) {
// close the confirmation modal and unbind its events // close the confirmation modal and unbind its events
const closeConfirmationModal = function() { const closeConfirmationModal = function() {
// unbind events // unbind events
$(document).off("keyup", escapeModal); $(document).off("keydown", escapeModal);
$cancelButton.off("click", closeConfirmationModal); $cancelButton.off("click", closeConfirmationModal);
$confirmButton.off("click", confirmModal); $confirmButton.off("click", confirmModal);
@ -48,7 +48,11 @@ function askConfirmation(message, command, cancelCommand) {
// close the modal if the escape button is pressed // close the modal if the escape button is pressed
const escapeModal = function(e) { const escapeModal = function(e) {
if (e.keyCode === 27) { closeConfirmationModal(); } if (e.keyCode === 27) {
closeConfirmationModal();
} else {
e.preventDefault();
}
}; };
// functionality to run when clicking the confirm button // functionality to run when clicking the confirm button
@ -70,7 +74,7 @@ function askConfirmation(message, command, cancelCommand) {
$cancelButton.on("click", cancelModal); $cancelButton.on("click", cancelModal);
// hide the modal when the escape key is pressed // hide the modal when the escape key is pressed
$(document).on("keyup", escapeModal); $(document).on("keydown", escapeModal);
// run the command and hide the modal when the confirm button is pressed // run the command and hide the modal when the confirm button is pressed
$confirmButton.on("click", confirmModal); $confirmButton.on("click", confirmModal);
@ -94,7 +98,7 @@ function showAlert(message, command) {
// close the alert modal and unbind its events // close the alert modal and unbind its events
const closeAlertModal = function() { const closeAlertModal = function() {
// unbind events // unbind events
$(document).off("keyup", escapeModal); $(document).off("keydown", escapeModal);
$acceptButton.off("click", closeAlertModal); $acceptButton.off("click", closeAlertModal);
// clear the message // clear the message
@ -102,19 +106,28 @@ function showAlert(message, command) {
// hide the modal // hide the modal
$alertModal.css({ opacity: 0 }); $alertModal.css({ opacity: 0 });
setTimeout(function() { $alertModal.css({ visibility: "hidden" }); }, fadeTime);
setTimeout(function() {
$alertModal.css({ visibility: "hidden" });
}, fadeTime);
// if a command was passed run it now // if a command was passed run it now
if (command !== undefined) { command(); } if (command !== undefined) {
command();
}
}; };
// close the modal if the escape button is pressed // close the modal if the escape button is pressed
const escapeModal = function(e) { const escapeModal = function(e) {
if (e.keyCode === 27) { closeAlertModal(); } if (e.keyCode === 27) {
closeAlertModal();
} else {
e.preventDefault();
}
}; };
// hide the modal when the escape key is pressed // hide the modal when the escape key is pressed
$(document).on("keyup", escapeModal); $(document).on("keydown", escapeModal);
// hide the modal when the accept button is pressed // hide the modal when the accept button is pressed
$acceptButton.on("click", closeAlertModal); $acceptButton.on("click", closeAlertModal);
@ -395,9 +408,10 @@ function editItemInit() {
uploadFile(row_id, currentFile + 1); uploadFile(row_id, currentFile + 1);
} else { } else {
hideLoadingModal(); hideLoadingModal();
showAlert("Failed to upload file");
console.log(response.responseText); showAlert("Failed to upload file", function() {
submitting = false; submitting = false;
});
} }
}); });
} else { } else {
@ -441,8 +455,10 @@ function editItemInit() {
uploadImage(row_id, currentImage + 1); uploadImage(row_id, currentImage + 1);
} else { } else {
hideLoadingModal(); hideLoadingModal();
showAlert("Failed to upload image");
showAlert("Failed to upload image", function() {
submitting = false; submitting = false;
});
} }
}); });
} else { } else {
@ -479,11 +495,12 @@ function editItemInit() {
}).always(function(response) { }).always(function(response) {
if (response === "success") { if (response === "success") {
$(`#current-image-${name}`).slideUp(200); $(`#current-image-${name}`).slideUp(200);
} else {
showAlert("Failed to delete image: " + response);
}
submitting = false; submitting = false;
} else {
showAlert("Failed to delete image: " + response, function() {
submitting = false;
});
}
}); });
}, function() { }, function() {
submitting = false; submitting = false;
@ -514,11 +531,12 @@ function editItemInit() {
}).always(function(response) { }).always(function(response) {
if (response === "success") { if (response === "success") {
$(`#current-file-${name}`).slideUp(200); $(`#current-file-${name}`).slideUp(200);
} else {
showAlert("Failed to delete file: " + response);
}
submitting = false; submitting = false;
} else {
showAlert("Failed to delete file: " + response, function() {
submitting = false;
});
}
}); });
}, function() { }, function() {
submitting = false; submitting = false;
@ -617,8 +635,10 @@ function editItemInit() {
uploadImage(response.replace(/^id:/, ""), 0); uploadImage(response.replace(/^id:/, ""), 0);
} else { } else {
hideLoadingModal(); hideLoadingModal();
showAlert("Failed to " + operation + " record");
showAlert("Failed to " + operation + " record", function() {
submitting = false; submitting = false;
});
} }
}); });
} }
@ -658,13 +678,15 @@ function userProfileImageInit() {
beforeSend: function(xhr) { xhr.setRequestHeader("X-CSRF-TOKEN", $token.val()); } beforeSend: function(xhr) { xhr.setRequestHeader("X-CSRF-TOKEN", $token.val()); }
}).always(function(response) { }).always(function(response) {
hideLoadingModal(); hideLoadingModal();
submitting = false;
if (/\.png\?version=/.test(response)) { if (/\.png\?version=/.test(response)) {
$display.css({ backgroundImage: `url(${response})` }); $display.css({ backgroundImage: `url(${response})` });
$delete.removeClass("inactive"); $delete.removeClass("inactive");
submitting = false;
} else { } else {
showAlert("Failed to upload image"); showAlert("Failed to upload image", function() {
submitting = false;
});
} }
}); });
}, function() { }, function() {
@ -690,11 +712,12 @@ function userProfileImageInit() {
if (response === "success") { if (response === "success") {
$display.css({ backgroundImage: `url(${defaultImage})` }); $display.css({ backgroundImage: `url(${defaultImage})` });
$delete.addClass("inactive"); $delete.addClass("inactive");
} else {
showAlert("Failed to delete profile image");
}
submitting = false; submitting = false;
} else {
showAlert("Failed to delete profile image", function() {
submitting = false;
});
}
}); });
}, function() { }, function() {
submitting = false; submitting = false;
@ -757,11 +780,13 @@ function userProfileUpdateInit() {
data: formData data: formData
}).always(function(response) { }).always(function(response) {
hideLoadingModal(); hideLoadingModal();
submitting = false;
if (response === "success") { if (response === "success") {
$submit.addClass("no-input"); $submit.addClass("no-input");
showAlert("User profile updated successfully");
showAlert("User profile updated successfully", function() {
submitting = false;
});
} else { } else {
// add the error class to fields that haven't been filled correctly // add the error class to fields that haven't been filled correctly
for (let errorName in response.responseJSON.errors) { for (let errorName in response.responseJSON.errors) {
@ -770,7 +795,9 @@ function userProfileUpdateInit() {
} }
} }
showAlert("Error updating user profile"); showAlert("Error updating user profile", function() {
submitting = false;
});
} }
}); });
} }
@ -837,8 +864,10 @@ function userPasswordUpdateInit() {
$newpassConfirmation.val(""); $newpassConfirmation.val("");
$newpass.addClass("error"); $newpass.addClass("error");
$newpassConfirmation.addClass("error"); $newpassConfirmation.addClass("error");
showAlert("New passwords do not match");
showAlert("New passwords do not match", function() {
submitting = false; submitting = false;
});
} else { } else {
// submit the update // submit the update
$.ajax({ $.ajax({
@ -847,18 +876,26 @@ function userPasswordUpdateInit() {
data: formData data: formData
}).always(function(response) { }).always(function(response) {
hideLoadingModal(); hideLoadingModal();
submitting = false;
if (response === "success") { if (response === "success") {
$inputs.val("").trigger("change"); $inputs.val("").trigger("change");
showAlert("Password updated successfully");
showAlert("Password updated successfully", function() {
submitting = false;
});
} else if (response === "old-password-fail") { } else if (response === "old-password-fail") {
$oldpass.addClass("error"); $oldpass.addClass("error");
showAlert("Old password is not correct");
showAlert("Old password is not correct", function() {
submitting = false;
});
} else { } else {
$newpass.addClass("error"); $newpass.addClass("error");
$newpassConfirmation.val(""); $newpassConfirmation.val("");
showAlert("New password must be at least 6 characters");
showAlert("New password must be at least 6 characters", function() {
submitting = false;
});
} }
}); });
} }