sporada/nopaque
1
0
Fork 0
mirror of https://gitlab.ub.uni-bielefeld.de/sfb1288inf/nopaque.git synced 2025-11-04 04:12:45 +00:00
Code Issues Projects Releases Wiki Activity

Add first query result function

Browse Source
This commit is contained in:
Stephan Porada
2019-11-18 16:07:07 +01:00
parent 5c8ca4e22d
commit 0ca4bf6030
4 changed files with 19 additions and 191 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
app/templates/corpora/analyse_corpus.html.j2
View File

@@ -117,8 +117,9 @@
});
socket.on('query', function(results) {
queryResultsElement.innerHTML = '';
for (let result of results) {
queryResultsElement.innerHTML += '<p>' + result['word_list'] + '</p>';
for (let key in results) {
console.log(results[key]);
queryResultsElement.innerHTML += '<p>' + results[key]['match_cpos_list'] + '</p>';
}
});
</script>

143
app/templates/corpora/corpus_analysis.html.j2
View File

@@ -1,143 +0,0 @@
{% extends "full_width.html.j2" %}
{% block page_content %}
<div class="col s12 m3 l3 sticky">
<a class="waves-effect waves-light btn" href="{{ url_for('corpora.corpus', corpus_id=corpus_id) }}"><i class="material-icons left">arrow_back</i>Back to corpus overview</a>
<div class="card">
<form id="query_form" method="POST">
<div class="card-content">
{{ form.hidden_tag() }}
<span class="card-title">Query and analysis</span>
<br>
<div class="input-field">
{{ form.query(class='materialize-textarea') }}
{{ form.query.label }}
{% for error in form.query.errors %}
<span class="helper-text red-text">{{ error }}</span>
{% endfor %}
</div>
<div class="right-align">
<button id="sent_query" class="btn" type="submit" name="action">Start Query
<i class="material-icons left">search</i>
</button>
</div>
<br>
<span class="card-title">Help</span>
<ul>
<li>
<a href="http://cwb.sourceforge.net/files/CQP_Tutorial/">
CQP Query Language Tutorial</a>
</li>
</ul>
<br>
<span class="card-title">Options</span>
<br>
<div class="input-field">
<i class="material-icons prefix">format_list_numbered</i>
{{ form.hits_per_page() }}
{{ form.hits_per_page.label }}
{% for error in form.hits_per_page.errors %}
<span class="helper-text red-text">{{ error }}</span>
{% endfor %}
</div>
<br>
<div class="input-field">
<i class="material-icons prefix">short_text</i>
{{ form.context() }}
{{ form.context.label }}
{% for error in form.context.errors %}
<span class="helper-text red-text">{{ error }}</span>
{% endfor %}
</div>
<br>
</form>
<span class="card-title">Download Results</span>
<p>Downlaod all results of the current query as csv, excel or json file.</p>
<form method="POST">
{{ form.hidden_tag() }}
<div class="input-field">
<i class="material-icons prefix">insert_drive_file</i>
{{ dl_form.file_type() }}
{{ dl_form.file_type.label }}
{% for error in dl_form.file_type.errors %}
<span class="helper-text red-text">{{ error }}</span>
{% endfor %}
</div>
<div class="right-align">
<button class="btn" type="submit" name="action">Download
<i class="material-icons left">file_download</i>
</button>
</div>
</form>
</div>
</div>
</div>
<script>
socket.on('query_results', function(json_results) {
console.log('Results recieved');
console.log(json_results);
});
</script>
<div class="col s12 m9 l9">
<div class="card">
<div class="card-content">
<span class="card-title">Query Results</span>
<p id="query-results"></p>
</div>
</div>
</div>
<script>
let queryData = document.forms['query_form'].elements;
var queryBtn = document.getElementById('sent_query');
queryBtn.addEventListener('click', function(event) {
event.preventDefault();
sendQueryData();
});
function sendQueryData() {
var query_data = {};
for (element of queryData) {
if (!element.value || element.name == 'csrf_token' || !element.id) {
continue;
}
query_data[element.id] = element.value
}
console.log(query_data)
socket.emit('query_event', query_data);
M.toast({html: 'Query has been sent'});
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>
<script>
var loadingModal;
document.addEventListener('DOMContentLoaded', function() {
loadingModal = M.Modal.init(document.getElementById("loading-modal"), {"dismissible": false});
loadingModal.open();
});
socket.emit('init_corpus_analysis', {{ corpus_id }});
socket.on('init_corpus_analysis', function(msg) {
if (msg === 'Ready') {loadingModal.close();}
});
</script>
{% endblock %}