diff --git a/app/corpora/events.py b/app/corpora/events.py index 601cd65448307bf252f02ef68bfba3086d2fc7f6..3da43763996ea7293b653aabb45ff80a06e99a5e 100644 --- a/app/corpora/events.py +++ b/app/corpora/events.py @@ -55,6 +55,7 @@ def observe_corpus_analysis_connection(app, corpus_id, session_id): username='opaque') analysis_client.connect() analysis_clients[session_id] = analysis_client + socketio.emit('init_corpus_analysis', 'Ready', room=session_id) while session_id in connected_sessions: try: analysis_client.ctrl_ping() diff --git a/app/templates/base.html.j2 b/app/templates/base.html.j2 index 2febaeaba32f4b2d8c39f1a54b65e9db8f3ccd36..1f0e4647e52e18cbfd4a15e9971133fef129ba75 100644 --- a/app/templates/base.html.j2 +++ b/app/templates/base.html.j2 @@ -158,9 +158,7 @@ </header> <main class="grey lighten-5"> - {% block main_block %} - {% endblock %} - + {% block main_block %}{% endblock %} </main> <footer class="page-footer"> @@ -188,6 +186,10 @@ document.getElementById("new-job"), {"coverTrigger": false} ); + var loadingModal = document.getElementById("loading-modal"); + console.log(loadingModal); + M.Modal.init(loadingModal, {"dismissible": false}); + M.Modal.getInstance(loadingModal).open(); var entry; for (entry of document.querySelectorAll("#slide-out a:not(.subheader)")) { if (entry.href === window.location.href) { diff --git a/app/templates/corpora/corpus_analysis.html.j2 b/app/templates/corpora/corpus_analysis.html.j2 index 39599272d16f5655252e14e5ab65afcd1b5d7675..a742e9197d0e9104ee61ba311810e32b2b256a91 100644 --- a/app/templates/corpora/corpus_analysis.html.j2 +++ b/app/templates/corpora/corpus_analysis.html.j2 @@ -3,6 +3,9 @@ {% block page_content %} <script> socket.emit('init_corpus_analysis', {{ corpus_id }}); +socket.on('init_corpus_analysis', function(msg) { + if (msg === 'Ready') {M.Modal.getInstance(document.getElementById("loading-modal")).close();} +}); </script> @@ -125,4 +128,23 @@ function sendQueryData() { console.log('Query data has been sent!') } </script> + +<div id="loading-modal" class="modal no-autoinit"> + <div class="modal-content"> + <h4>Waiting for analysis software</h4> + <div class="preloader-wrapper big active"> + <div class="spinner-layer spinner-blue-only"> + <div class="circle-clipper left"> + <div class="circle"></div> + </div> + <div class="gap-patch"> + <div class="circle"></div> + </div> + <div class="circle-clipper right"> + <div class="circle"></div> + </div> + </div> + </div> + </div> +</div> {% endblock %}