Hello, world! This is a toast message.
diff --git a/src/frontend/partials/head.eta.html b/src/frontend/partials/head.eta.html
index 4c6df7d..6a178b1 100644
--- a/src/frontend/partials/head.eta.html
+++ b/src/frontend/partials/head.eta.html
@@ -13,6 +13,7 @@
+
diff --git a/static/js/editCategory.js b/static/js/editCategory.js
index 23abf22..a51973e 100644
--- a/static/js/editCategory.js
+++ b/static/js/editCategory.js
@@ -20,13 +20,7 @@ function getDataForEdit(name) {
$('.loader-overlay').removeClass('active');
// Close the modal
$('.modal').modal('hide');
- normalizeToast()
- $('#generalToast').addClass('text-bg-danger');
- $('#generalToast').toast('show');
- $('#generalToast').children('.d-flex').children('.toast-body').html('
Something went wrong. The category does no longer exist.');
- setTimeout(() => {
- window.location.reload();
- }, 3000);
+ createNewToast('
Something went wrong. The category does no longer exist.', "text-bg-danger")
}
});
}
@@ -53,10 +47,7 @@ function deleteEntry(id) {
data: { id: id },
success: function (data) {
$('#staticBackdrop').modal('hide');
- $('#generalToast').removeClass('text-bg-primary');
- $('#generalToast').addClass('text-bg-success');
- $('#generalToast').toast('show');
- $('#generalToast').children('.d-flex').children('.toast-body').html('
Category deleted successfully.');
+ createNewToast('
Category deleted successfully.', "text-bg-success")
confetti({
spread: 360,
ticks: 100,
@@ -72,24 +63,12 @@ function deleteEntry(id) {
}
}
});
- setTimeout(() => {
- $('#generalToast').toast('hide');
- $('#generalToast').removeClass('text-bg-success');
- $('#generalToast').addClass('text-bg-primary');
- window.location.reload();
- }, 2000);
},
error: function (data) {
// hide the staticBackdrop modal
$('#staticBackdrop').modal('hide');
- normalizeToast()
- $('#generalToast').addClass('text-bg-danger');
- $('#generalToast').toast('show');
- $('#generalToast').children('.d-flex').children('.toast-body').html('
Something went wrong. Please try again later.');
- setTimeout(() => {
- $('#generalToast').toast('hide');
- }, 3000);
+ createNewToast('
Something went wrong. Please try again later.', "text-bg-danger", 3000, false)
}
});
}
@@ -118,13 +97,7 @@ function preFillDeleteModal(name) {
document.getElementById('deleteNamePlaceholder').innerText = 'Deleted';
$('#staticBackdrop').modal('hide');
- normalizeToast()
- $('#generalToast').addClass('text-bg-danger');
- $('#generalToast').toast('show');
- $('#generalToast').children('.d-flex').children('.toast-body').html('
Something went wrong. The category does no longer exist.');
- setTimeout(() => {
- window.location.reload();
- }, 3000);
+ createNewToast('
Something went wrong. The category does no longer exist.', "text-bg-danger")
}
});
}
diff --git a/static/js/editStorages.js b/static/js/editStorages.js
index 984f9e8..7663992 100644
--- a/static/js/editStorages.js
+++ b/static/js/editStorages.js
@@ -88,14 +88,7 @@ function preFillDeleteModal(id) {
document.getElementById('deleteNamePlaceholder').innerText = 'Deleted';
$('#staticBackdrop').modal('hide');
- normalizeToast()
-
- $('#generalToast').addClass('text-bg-danger');
- $('#generalToast').toast('show');
- $('#generalToast').children('.d-flex').children('.toast-body').html('
Something went wrong. The storageUnit does no longer exist.');
- setTimeout(() => {
- window.location.reload();
- }, 3000);
+ createNewToast('
Something went wrong. The storageUnit does no longer exist.', "text-bg-danger")
}
});
}
@@ -125,14 +118,7 @@ function preFillDeleteModalLoc(id) {
document.getElementById('deleteNamePlaceholder').innerText = 'Deleted';
$('#staticBackdrop').modal('hide');
- normalizeToast()
-
- $('#generalToast').addClass('text-bg-danger');
- $('#generalToast').toast('show');
- $('#generalToast').children('.d-flex').children('.toast-body').html('
Something went wrong. The storage location does no longer exist.');
- setTimeout(() => {
- window.location.reload();
- }, 3000);
+ createNewToast('
Something went wrong. The storage location does no longer exist.', "text-bg-danger")
}
});
}
@@ -145,11 +131,8 @@ function deleteEntry(id) {
data: { id: id },
success: function (data) {
$('#staticBackdrop').modal('hide');
- normalizeToast()
+ createNewToast('
Storage Unit deleted successfully.', "text-bg-success")
- $('#generalToast').addClass('text-bg-success');
- $('#generalToast').toast('show');
- $('#generalToast').children('.d-flex').children('.toast-body').html('
Storage Unit deleted successfully.');
confetti({
spread: 360,
ticks: 100,
@@ -165,21 +148,11 @@ function deleteEntry(id) {
}
}
});
- setTimeout(() => {
- $('#generalToast').toast('hide');
- window.location.reload();
- }, 2000);
},
error: function (data) {
// hide the staticBackdrop modal
$('#staticBackdrop').modal('hide');
- normalizeToast()
- $('#generalToast').addClass('text-bg-danger');
- $('#generalToast').toast('show');
- $('#generalToast').children('.d-flex').children('.toast-body').html('
Something went wrong. Please try again later.');
- setTimeout(() => {
- $('#generalToast').toast('hide');
- }, 3000);
+ createNewToast('
Something went wrong. Please try again later.', "text-bg-danger", 3000, false)
}
});
}
@@ -193,11 +166,7 @@ function deleteEntryLoc(id) {
data: { id: id },
success: function (data) {
$('#staticBackdrop').modal('hide');
- normalizeToast()
-
- $('#generalToast').addClass('text-bg-success');
- $('#generalToast').toast('show');
- $('#generalToast').children('.d-flex').children('.toast-body').html('
Storage Unit deleted successfully.');
+ createNewToast('
Storage Unit deleted successfully.', "text-bg-success")
confetti({
spread: 360,
ticks: 100,
@@ -213,21 +182,11 @@ function deleteEntryLoc(id) {
}
}
});
- setTimeout(() => {
- $('#generalToast').toast('hide');
- window.location.reload();
- }, 2000);
},
error: function (data) {
// hide the staticBackdrop modal
$('#staticBackdrop').modal('hide');
- normalizeToast()
- $('#generalToast').addClass('text-bg-danger');
- $('#generalToast').toast('show');
- $('#generalToast').children('.d-flex').children('.toast-body').html('
Something went wrong. Please try again later.');
- setTimeout(() => {
- $('#generalToast').toast('hide');
- }, 3000);
+ createNewToast('
Something went wrong. Please try again later.', "text-bg-danger", 3000, false)
}
});
}
@@ -266,13 +225,7 @@ function getDataForEdit(id) {
$('.loader-overlay').removeClass('active');
// Close the modal
$('.modal').modal('hide');
- normalizeToast()
- $('#generalToast').addClass('text-bg-danger');
- $('#generalToast').toast('show');
- $('#generalToast').children('.d-flex').children('.toast-body').html('
Something went wrong. The storage unit does no longer exist.');
- setTimeout(() => {
- window.location.reload();
- }, 3000);
+ createNewToast('
Something went wrong. The storage unit does no longer exist.', "text-bg-danger")
}
});
}
@@ -311,13 +264,7 @@ function getDataForEditLoc(id) {
$('.loader-overlay').removeClass('active');
// Close the modal
$('.modal').modal('hide');
- normalizeToast()
- $('#generalToast').addClass('text-bg-danger');
- $('#generalToast').toast('show');
- $('#generalToast').children('.d-flex').children('.toast-body').html('
Something went wrong. The storage unit does no longer exist.');
- setTimeout(() => {
- window.location.reload();
- }, 3000);
+ createNewToast('
Something went wrong. The storage unit does no longer exist.', "text-bg-danger")
}
});
}
diff --git a/static/js/formHandler.js b/static/js/formHandler.js
index 1a91c03..c55155f 100644
--- a/static/js/formHandler.js
+++ b/static/js/formHandler.js
@@ -24,15 +24,8 @@ $('.frontendForm').each(function() {
$('.modal').modal('hide');
// Clear all fields
form.find('input, textarea').val('');
-
- normalizeToast()
- $('#generalToast').addClass('text-bg-success');
- $('#generalToast').toast('show');
- $('#generalToast').children('.d-flex').children('.toast-body').html('
Changes saved successfully.');
- setTimeout(() => {
- $('#generalToast').toast('hide');;
- window.location.reload();
- }, 1500);
+ // Create toast
+ createNewToast('
Changes saved successfully.', "text-bg-success")
},
error: function(data) {
console.log('error');
@@ -40,19 +33,11 @@ $('.frontendForm').each(function() {
$('.loader-overlay').removeClass('loaderActive');
// Check for response code 409
- normalizeToast()
- $('#generalToast').addClass('text-bg-danger');
- $('#generalToast').toast('show');
-
-
if (data.status == 409) {
- $('#generalToast').children('.d-flex').children('.toast-body').html('
The element you tried to create already exists.');
+ createNewToast('
The element you tried to create already exists.', "text-bg-danger", 3000, false)
}else {
- $('#generalToast').children('.d-flex').children('.toast-body').html('
Something went wrong. Please try again later.');
+ createNewToast('
Something went wrong. Please try again later.', "text-bg-danger", 3000, false)
}
- setTimeout(() => {
- $('#generalToast').toast('hide');
- }, 3000);
}
});
})
diff --git a/static/js/normalizeToast.js b/static/js/normalizeToast.js
index 351d2b8..17fd9b5 100644
--- a/static/js/normalizeToast.js
+++ b/static/js/normalizeToast.js
@@ -1,4 +1,5 @@
function normalizeToast(){
+ console.warn("Something is using the deprecated function normalizeToast(). Please use createNewToast() instead.")
$('#generalToast').removeClass('text-bg-primary');
$('#generalToast').removeClass('text-bg-success');
$('#generalToast').removeClass('text-bg-danger');
diff --git a/static/js/toastHandler.js b/static/js/toastHandler.js
new file mode 100644
index 0000000..9f8571f
--- /dev/null
+++ b/static/js/toastHandler.js
@@ -0,0 +1,27 @@
+const currentToasts = [];
+
+function createNewToast(message, colorSelector, autoHideTime = 3000, autoReload = true){
+ const targetContainer = document.getElementById('toastMainController');
+ const masterToast = document.getElementById('masterToast');
+ const newToast = masterToast.cloneNode(true);
+ newToast.classList.add(colorSelector)
+ newToast.id = `toast-${currentToasts.length}`;
+ console.log(newToast.childNodes[1]);
+ newToast.childNodes[1].childNodes[1].innerHTML = message;
+ targetContainer.appendChild(newToast);
+ currentToasts.push(newToast);
+ $(newToast).toast('show');
+ setTimeout(() => {
+ destroyToast(newToast.id);
+ if(autoReload){
+ location.reload();
+ }
+ }, autoHideTime);
+}
+
+function destroyToast(id){
+ const targetContainer = document.getElementById('toastMainController');
+ const targetToast = document.getElementById(id);
+ targetContainer.removeChild(targetToast);
+ currentToasts.splice(currentToasts.indexOf(targetToast), 1);
+}
\ No newline at end of file