Change the way how the dismiss feature is added to toasts.

This commit is contained in:
Patrick Jentsch 2020-01-08 10:47:59 +01:00
parent 8416bda04b
commit 4446260c10
2 changed files with 23 additions and 3 deletions

View File

@ -192,8 +192,16 @@
entry.parentNode.classList.add("active");
}
}
var toast;
var toastActionElement
{% for message in get_flashed_messages() %}
M.toast({"html": '<span>{{ message }}</span><button class="btn-flat toast-action red-text" data-action="close"><i class="material-icons">close</i></button>'});
toast = M.toast({"html": `<span>{{ message }}</span><button class="btn-flat toast-action red-text" data-action="close"><i class="material-icons">close</i></button>`});
toastActionElement = toast.el.querySelector(".toast-action[data-action='close']");
if (toastActionElement) {
toastActionElement.addEventListener("click", function() {
toast.dismiss();
});
}
{% endfor %}
for (toastActionElement of document.querySelectorAll(".toast-action[data-action='close']")) {
toastActionElement.addEventListener("click", function(event) {

View File

@ -217,7 +217,13 @@
socket.emit("corpus_analysis", queryData);
queryLoadingElement.classList.remove("hide");
queryResultsTableElement.classList.add("hide");
M.toast({html: "Query has been sent!"});
let toast = M.toast({"html": `<span>Query has been sent!</span><button class="btn-flat toast-action red-text" data-action="close"><i class="material-icons">close</i></button>`});
let toastActionElement = toast.el.querySelector(".toast-action[data-action='close']");
if (toastActionElement) {
toastActionElement.addEventListener("click", function() {
toast.dismiss();
});
}
});
socket.on("corpus_analysis", function(message) {
@ -234,7 +240,13 @@
if (message === null) {
queryResultsTableElement.classList.add("hide");
M.toast({"html": "No results for this query!", "classes": "red"});
let toast = M.toast({"classes": "red", "html": `<span>No results for this query!</span><button class="btn-flat toast-action white-text" data-action="close"><i class="material-icons">close</i></button>`});
let toastActionElement = toast.el.querySelector(".toast-action[data-action='close']");
if (toastActionElement) {
toastActionElement.addEventListener("click", function() {
toast.dismiss();
});
}
return;
}