diff --git a/app/templates/base.html.j2 b/app/templates/base.html.j2
index 6a8e50d9..7a544dfc 100644
--- a/app/templates/base.html.j2
+++ b/app/templates/base.html.j2
@@ -192,8 +192,16 @@
entry.parentNode.classList.add("active");
}
}
+ var toast;
+ var toastActionElement
{% for message in get_flashed_messages() %}
- M.toast({"html": '{{ message }}'});
+ toast = M.toast({"html": `{{ message }}`});
+ 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) {
diff --git a/app/templates/corpora/analyse_corpus.html.j2 b/app/templates/corpora/analyse_corpus.html.j2
index 0f656aec..c1f20bc2 100644
--- a/app/templates/corpora/analyse_corpus.html.j2
+++ b/app/templates/corpora/analyse_corpus.html.j2
@@ -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": `Query has been sent!`});
+ 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": `No results for this query!`});
+ let toastActionElement = toast.el.querySelector(".toast-action[data-action='close']");
+ if (toastActionElement) {
+ toastActionElement.addEventListener("click", function() {
+ toast.dismiss();
+ });
+ }
return;
}