mirror of
https://gitlab.ub.uni-bielefeld.de/sfb1288inf/nopaque.git
synced 2025-01-18 14:00:33 +00:00
Merge branch 'development' of gitlab.ub.uni-bielefeld.de:sfb1288inf/nopaque into development
This commit is contained in:
Patrick Jentsch
commit
38a450802f
@ -76,6 +76,7 @@ def analyse_corpus(corpus_id):
|
|||||||
prefix='inspect-display-options-form')
|
prefix='inspect-display-options-form')
|
||||||
return render_template(
|
return render_template(
|
||||||
'corpora/analyse_corpus.html.j2',
|
'corpora/analyse_corpus.html.j2',
|
||||||
|
corpus=corpus,
|
||||||
corpus_id=corpus_id,
|
corpus_id=corpus_id,
|
||||||
display_options_form=display_options_form,
|
display_options_form=display_options_form,
|
||||||
query_form=query_form,
|
query_form=query_form,
|
||||||
|
|||||||
@ -41,173 +41,202 @@
|
|||||||
<div class="card">
|
<div class="card">
|
||||||
<div class="card-content" id="result-list" style="overflow: hidden;">
|
<div class="card-content" id="result-list" style="overflow: hidden;">
|
||||||
<div class="error-container hide show-on-error"></div>
|
<div class="error-container hide show-on-error"></div>
|
||||||
<div class="hide show-on-success" style="margin-top:-20px;">
|
<div class=" row hide show-on-success">
|
||||||
<div class="row" style="margin-bottom: 0px;">
|
<div class="col s12 m2 l2" id="infos">
|
||||||
<div class="col s12 m3 l3" id="results-info">
|
<h6 style="margin-top: 0px;">Infos</h6>
|
||||||
<div class="row section">
|
<div class="divider" style="margin-bottom: 10px;"></div>
|
||||||
<h6 style="margin-top: 0px;">Infos</h6>
|
<div class="row">
|
||||||
<div class="divider" style="margin-bottom: 10px;"></div>
|
<div class="col s12">
|
||||||
<div class="col" id="infos">
|
<button id="show-metadata"
|
||||||
<p>
|
class="waves-effect
|
||||||
<span id="received-match-count">
|
waves-light
|
||||||
</span> of
|
btn-flat"
|
||||||
<span id="match-count"></span>
|
type="submit">Corpus Metadata
|
||||||
matches loaded.
|
<i class="material-icons left">info_outline</i>
|
||||||
<br>
|
</button>
|
||||||
Matches occured in
|
|
||||||
<span id="text-lookup-count"></span>
|
|
||||||
corpus files:
|
|
||||||
<br>
|
|
||||||
<span id=text-titles></span>
|
|
||||||
</p>
|
|
||||||
<p id="query-results-user-feedback">
|
|
||||||
<i class="material-icons">help</i>
|
|
||||||
The Server is still sending your results.
|
|
||||||
Functions like "Export Results" and "Match Inspect" will be
|
|
||||||
available after all matches have been loaded.
|
|
||||||
</p>
|
|
||||||
<div class="progress" id="query-results-progress">
|
|
||||||
<div class="determinate" id="query-results-determinate"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="col s12">
|
||||||
<div class="col s12 m9 l9" id="actions-and-tools">
|
<p>
|
||||||
<div class="row section">
|
<span id="received-match-count">
|
||||||
<div class="col s12 m3 l3" id="export">
|
</span> of
|
||||||
<h6 style="margin-top: 0px;">Export</h6>
|
<span id="match-count"></span>
|
||||||
<div class="divider" style="margin-bottom: 10px;"></div>
|
matches loaded.
|
||||||
<div class="row">
|
<br>
|
||||||
<div class="col s12">
|
Matches occured in
|
||||||
<button class="waves-effect
|
<span id="text-lookup-count"></span>
|
||||||
waves-light
|
corpus files:
|
||||||
btn-flat"
|
<br>
|
||||||
type="submit"
|
<span id=text-titles></span>
|
||||||
id="results-create">Create Results
|
</p>
|
||||||
<i class="material-icons left">build</i>
|
<p id="query-results-user-feedback">
|
||||||
</button>
|
<i class="material-icons">help</i>
|
||||||
<button id="query-results-export"
|
The Server is still sending your results.
|
||||||
class="waves-effect
|
Functions like "Export Results" and "Match Inspect" will be
|
||||||
waves-light
|
available after all matches have been loaded.
|
||||||
btn-flat
|
</p>
|
||||||
hide"
|
<div class="progress" id="query-results-progress">
|
||||||
type="submit">Results
|
<div class="determinate" id="query-results-determinate"></div>
|
||||||
<i class="material-icons left">file_download</i>
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
<div class="col s12">
|
|
||||||
<button class="waves-effect
|
|
||||||
waves-light
|
|
||||||
btn-flat
|
|
||||||
hide
|
|
||||||
disabled"
|
|
||||||
type="submit"
|
|
||||||
id="sub-results-create">Create Sub-Results
|
|
||||||
<i class="material-icons left">build</i>
|
|
||||||
</button>
|
|
||||||
<button id="sub-results-export"
|
|
||||||
class="waves-effect
|
|
||||||
waves-light
|
|
||||||
btn-flat
|
|
||||||
hide"
|
|
||||||
type="submit">Sub-Results
|
|
||||||
<i class="material-icons left">file_download</i>
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col s12 m3 l3" id="create">
|
|
||||||
<h6 style="margin-top: 0px;">Create</h6>
|
|
||||||
<div class="divider" style="margin-bottom: 10px;"></div>
|
|
||||||
<div class="row">
|
|
||||||
<div class="col s12">
|
|
||||||
<div class="switch">
|
|
||||||
Sub-Results creation:
|
|
||||||
<label>
|
|
||||||
Off
|
|
||||||
<input disabled
|
|
||||||
type="checkbox"
|
|
||||||
id="add-to-sub-results">
|
|
||||||
<span class="lever"></span>
|
|
||||||
On
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col s12 hide" id="sub-results-match-ids-div">
|
|
||||||
<div class="input-field">
|
|
||||||
<p><span id="nr-marked-matches"></span> matches marked
|
|
||||||
for Sub-Results:</p>
|
|
||||||
<textarea id="sub-results-match-ids"
|
|
||||||
class="materialize-textarea"
|
|
||||||
disabled>
|
|
||||||
</textarea>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col s12 m3 l3" id="display">
|
|
||||||
<h6 style="margin-top: 0px;">Display</h6>
|
|
||||||
<div class="divider" style="margin-bottom: 10px;"></div>
|
|
||||||
<div class="row">
|
|
||||||
<div class="col s12">
|
|
||||||
<form id="display-options-form">
|
|
||||||
{{ M.render_field(display_options_form.results_per_page,
|
|
||||||
material_icon='format_list_numbered') }}
|
|
||||||
{{ M.render_field(display_options_form.result_context,
|
|
||||||
material_icon='short_text') }}
|
|
||||||
{{ M.render_field(display_options_form.expert_mode) }}
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col s12 m3 l3" id="anlysis">
|
|
||||||
<h6 style="margin-top: 0px;">Analysis</h6>
|
|
||||||
<div class="divider" style="margin-bottom: 10px;"></div>
|
|
||||||
<div class="row">
|
|
||||||
<div class="col s12">
|
|
||||||
<button id="placeholder1"
|
|
||||||
class="waves-effect
|
|
||||||
waves-light
|
|
||||||
btn-flat
|
|
||||||
disabled"
|
|
||||||
type="submit">Action One
|
|
||||||
<i class="material-icons left">cloud</i>
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
<div class="col s12">
|
|
||||||
<button id="placeholder2"
|
|
||||||
class="waves-effect
|
|
||||||
waves-light
|
|
||||||
btn-flat
|
|
||||||
disabled"
|
|
||||||
type="submit">Action Two
|
|
||||||
<i class="material-icons left">add</i>
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<!-- Table showing the query results -->
|
<div class="col s12 m2 l2" id="export">
|
||||||
<div class="col s12">
|
<h6 style="margin-top: 0px;">Export</h6>
|
||||||
<ul class="pagination paginationTop"></ul>
|
<div class="divider" style="margin-bottom: 10px;"></div>
|
||||||
<table class="responsive-table highlight">
|
<div class="row">
|
||||||
<thead>
|
<div class="col s12">
|
||||||
<tr>
|
<button class="waves-effect
|
||||||
<th style="width: 2%">Nr.</th>
|
waves-light
|
||||||
<th style="width: 3%">Title</th>
|
btn-flat"
|
||||||
<th style="width: 25%">Left context</th>
|
type="submit"
|
||||||
<th style="width: 35%">Match</th>
|
id="results-create">Create Results
|
||||||
<th style="width: 10%">Actions</th>
|
<i class="material-icons left">build</i>
|
||||||
<th style="width: 25%">Right Context</th>
|
</button>
|
||||||
</tr>
|
<button id="query-results-export"
|
||||||
</thead>
|
class="waves-effect
|
||||||
<tbody class="list" id="query-results">
|
waves-light
|
||||||
</tbody>
|
btn-flat
|
||||||
</table>
|
hide"
|
||||||
<ul class="pagination paginationBottom"></ul>
|
type="submit">Results
|
||||||
|
<i class="material-icons left">file_download</i>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<div class="col s12">
|
||||||
|
<button class="waves-effect
|
||||||
|
waves-light
|
||||||
|
btn-flat
|
||||||
|
hide
|
||||||
|
disabled"
|
||||||
|
type="submit"
|
||||||
|
id="sub-results-create">Create Sub-Results
|
||||||
|
<i class="material-icons left">build</i>
|
||||||
|
</button>
|
||||||
|
<button id="sub-results-export"
|
||||||
|
class="waves-effect
|
||||||
|
waves-light
|
||||||
|
btn-flat
|
||||||
|
hide"
|
||||||
|
type="submit">Sub-Results
|
||||||
|
<i class="material-icons left">file_download</i>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="col s12 m2 l2" id="create">
|
||||||
|
<h6 style="margin-top: 0px;">Create</h6>
|
||||||
|
<div class="divider" style="margin-bottom: 10px;"></div>
|
||||||
|
<div class="row">
|
||||||
|
<div class="col s12">
|
||||||
|
<div class="switch">
|
||||||
|
Sub-Results creation:
|
||||||
|
<label>
|
||||||
|
Off
|
||||||
|
<input disabled
|
||||||
|
type="checkbox"
|
||||||
|
id="add-to-sub-results">
|
||||||
|
<span class="lever"></span>
|
||||||
|
On
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col s12 hide" id="sub-results-match-ids-div">
|
||||||
|
<div class="input-field">
|
||||||
|
<p><span id="nr-marked-matches"></span> matches marked
|
||||||
|
for Sub-Results:</p>
|
||||||
|
<textarea id="sub-results-match-ids"
|
||||||
|
class="materialize-textarea"
|
||||||
|
disabled>
|
||||||
|
</textarea>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col s12 m2 l2" id="display">
|
||||||
|
<h6 style="margin-top: 0px;">Display</h6>
|
||||||
|
<div class="divider" style="margin-bottom: 10px;"></div>
|
||||||
|
<div class="row">
|
||||||
|
<div class="col s12">
|
||||||
|
<form id="display-options-form">
|
||||||
|
{{ M.render_field(display_options_form.results_per_page,
|
||||||
|
material_icon='format_list_numbered') }}
|
||||||
|
{{ M.render_field(display_options_form.result_context,
|
||||||
|
material_icon='short_text') }}
|
||||||
|
{{ M.render_field(display_options_form.expert_mode) }}
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col s12 m2 l2" id="anlysis">
|
||||||
|
<h6 style="margin-top: 0px;">Analysis</h6>
|
||||||
|
<div class="divider" style="margin-bottom: 10px;"></div>
|
||||||
|
<div class="row">
|
||||||
|
<div class="col s12">
|
||||||
|
<button id="placeholder1"
|
||||||
|
class="waves-effect
|
||||||
|
waves-light
|
||||||
|
btn-flat
|
||||||
|
disabled"
|
||||||
|
type="submit">Action One
|
||||||
|
<i class="material-icons left">cloud</i>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<div class="col s12">
|
||||||
|
<button id="placeholder2"
|
||||||
|
class="waves-effect
|
||||||
|
waves-light
|
||||||
|
btn-flat
|
||||||
|
disabled"
|
||||||
|
type="submit">Action Two
|
||||||
|
<i class="material-icons left">add</i>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col s12 m2 l2" id="cite">
|
||||||
|
<h6 style="margin-top: 0px;">Cite Nopaque</h6>
|
||||||
|
<div class="divider" style="margin-bottom: 10px;"></div>
|
||||||
|
<div class="row">
|
||||||
|
<div class="col s12">
|
||||||
|
<button id="placeholder1"
|
||||||
|
class="waves-effect
|
||||||
|
waves-light
|
||||||
|
btn-flat
|
||||||
|
disabled"
|
||||||
|
type="submit">Action One
|
||||||
|
<i class="material-icons left">cloud</i>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<div class="col s12">
|
||||||
|
<button id="placeholder2"
|
||||||
|
class="waves-effect
|
||||||
|
waves-light
|
||||||
|
btn-flat
|
||||||
|
disabled"
|
||||||
|
type="submit">Action Two
|
||||||
|
<i class="material-icons left">add</i>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- Table showing the query results -->
|
||||||
|
<div class="col s12">
|
||||||
|
<ul class="pagination paginationTop"></ul>
|
||||||
|
<table class="responsive-table highlight">
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<th style="width: 2%">Nr.</th>
|
||||||
|
<th style="width: 3%">Title</th>
|
||||||
|
<th style="width: 25%">Left context</th>
|
||||||
|
<th style="width: 35%">Match</th>
|
||||||
|
<th style="width: 10%">Actions</th>
|
||||||
|
<th style="width: 25%">Right Context</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody class="list" id="query-results">
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
<ul class="pagination paginationBottom"></ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -391,6 +420,7 @@
|
|||||||
var textLookupCountElement // Nr of texts the matches occured in will be shown in this element
|
var textLookupCountElement // Nr of texts the matches occured in will be shown in this element
|
||||||
var textTitlesElement; // matched text titles
|
var textTitlesElement; // matched text titles
|
||||||
var nrMarkedMatches; // count of matches marked for subresults
|
var nrMarkedMatches; // count of matches marked for subresults
|
||||||
|
var showMetadataButton; // Button to show corpus metadata
|
||||||
|
|
||||||
// ###### Defining local scope variables ######
|
// ###### Defining local scope variables ######
|
||||||
let contextPerItemElement; // Form Element for display option
|
let contextPerItemElement; // Form Element for display option
|
||||||
@ -439,6 +469,7 @@
|
|||||||
textLookupCountElement = document.getElementById("text-lookup-count");
|
textLookupCountElement = document.getElementById("text-lookup-count");
|
||||||
textTitlesElement = document.getElementById("text-titles");
|
textTitlesElement = document.getElementById("text-titles");
|
||||||
nrMarkedMatches = document.getElementById("nr-marked-matches");
|
nrMarkedMatches = document.getElementById("nr-marked-matches");
|
||||||
|
showMetadataButton = document.getElementById("show-metadata");
|
||||||
|
|
||||||
// ###### js list options and intialization ######
|
// ###### js list options and intialization ######
|
||||||
displayOptionsData = ResultsList.getDisplayOptions(displayOptionsFormElement);
|
displayOptionsData = ResultsList.getDisplayOptions(displayOptionsFormElement);
|
||||||
@ -588,8 +619,12 @@
|
|||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
// ### Download events and sub-results creation ###
|
// ### Show corpus Metadata
|
||||||
|
showMetadataButton.onclick = () => {
|
||||||
|
console.log("click");
|
||||||
|
}
|
||||||
|
|
||||||
|
// ### Download events and sub-results creation ###
|
||||||
var loadingSpinnerHTML = `
|
var loadingSpinnerHTML = `
|
||||||
<div class="preloader-wrapper button-icon-spinner small active">
|
<div class="preloader-wrapper button-icon-spinner small active">
|
||||||
<div class="spinner-layer spinner-green-only">
|
<div class="spinner-layer spinner-green-only">
|
||||||
|
|||||||
109
web/app/templates/macros/query_result_macro.html.j2
Normal file
109
web/app/templates/macros/query_result_macro.html.j2
Normal file
@ -0,0 +1,109 @@
|
|||||||
|
{% macro show_metadata(query_metadata) %}
|
||||||
|
<div class="col s12">
|
||||||
|
<p>Below the metadata for the results from the Corpus
|
||||||
|
<i>{{ query_metadata.corpus_name }}</i> generated with the query
|
||||||
|
<i>{{ query_metadata.query }}</i> are shown.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="col s12">
|
||||||
|
<div class="card">
|
||||||
|
<div class="card-content" id="results">
|
||||||
|
<table class="responsive-table highlight">
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<th>Metadata Description</th>
|
||||||
|
<th>Value</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
{% for pair in query_metadata|dictsort %}
|
||||||
|
<tr>
|
||||||
|
<td>{{ pair[0] }}</td>
|
||||||
|
{% if pair[0] == 'corpus_all_texts'
|
||||||
|
or pair[0] == 'text_lookup' %}
|
||||||
|
<td>
|
||||||
|
<table>
|
||||||
|
{% for key, value in pair[1].items() %}
|
||||||
|
<tr style="border-bottom: none;">
|
||||||
|
<td>
|
||||||
|
<i>{{ value['title'] }}</i> written
|
||||||
|
by <i>{{ value['author'] }}</i>
|
||||||
|
in <i>{{ value['publishing_year'] }}</i>
|
||||||
|
<a class="waves-effect
|
||||||
|
waves-light
|
||||||
|
btn
|
||||||
|
right
|
||||||
|
more-text-detials"
|
||||||
|
data-metadata-key="{{ pair[0] }}"
|
||||||
|
data-text-key="{{ key }}"
|
||||||
|
href="#modal-text-details">More
|
||||||
|
<i class="material-icons right"
|
||||||
|
data-metadata-key="{{ pair[0] }}"
|
||||||
|
data-text-key="{{ key }}">
|
||||||
|
info_outline
|
||||||
|
</i>
|
||||||
|
</a>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
{% endfor %}
|
||||||
|
</table>
|
||||||
|
</td>
|
||||||
|
{% else %}
|
||||||
|
<td>{{ pair[1] }}</td>
|
||||||
|
{% endif %}
|
||||||
|
</tr>
|
||||||
|
{% endfor %}
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Modal Structure -->
|
||||||
|
<div id="modal-text-details" class="modal modal-fixed-footer">
|
||||||
|
<div class="modal-content">
|
||||||
|
<h4>Bibliographic data</h4>
|
||||||
|
<p id="bibliographic-data"></p>
|
||||||
|
</div>
|
||||||
|
<div class="modal-footer">
|
||||||
|
<a href="#!" class="modal-close waves-effect waves-green red btn">Close</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
var moreTextDetailsButtons;
|
||||||
|
moreTextDetailsButtons = document.getElementsByClassName("more-text-detials");
|
||||||
|
for (var btn of moreTextDetailsButtons) {
|
||||||
|
btn.onclick = () => {
|
||||||
|
let modal = document.getElementById("modal-text-details");
|
||||||
|
modal = M.Modal.init(modal, {"dismissible": true});
|
||||||
|
modal.open();
|
||||||
|
let metadataKey = event.target.dataset.metadataKey;
|
||||||
|
let textKey = event.target.dataset.textKey;
|
||||||
|
let textData = {{ query_metadata|tojson|safe }}[metadataKey][textKey];
|
||||||
|
console.log(textData);
|
||||||
|
let bibliographicData = document.getElementById("bibliographic-data");
|
||||||
|
bibliographicData.innerHTML = "";
|
||||||
|
let table = document.createElement("table");
|
||||||
|
for (let [key, value] of Object.entries(textData)) {
|
||||||
|
table.insertAdjacentHTML("afterbegin",
|
||||||
|
`
|
||||||
|
<tr>
|
||||||
|
<td>${key}</td>
|
||||||
|
<td>${value}</td>
|
||||||
|
</tr>
|
||||||
|
`);
|
||||||
|
}
|
||||||
|
table.insertAdjacentHTML("afterbegin",
|
||||||
|
`
|
||||||
|
<thead>
|
||||||
|
<th>Description</th>
|
||||||
|
<th>Value</th>
|
||||||
|
</thead>
|
||||||
|
`)
|
||||||
|
bibliographicData.appendChild(table);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
Loading…
x
Reference in New Issue
Block a user