Soem clean up and restructure

This commit is contained in:
Stephan Porada
2020-07-21 13:40:17 +02:00
parent 7dfc3ab877
commit 1b853f3338
17 changed files with 509 additions and 604 deletions

View File

@ -3,6 +3,7 @@
{% set headline = ' ' %}
{% set full_width = True %}
{% set imported = True %}
{% block page_content %}
@ -34,169 +35,21 @@
<div class="card">
<div class="card-content" id="result-list" style="overflow: hidden;">
<div class=" row show-on-success">
<div class="col s12 m2 l2" id="infos">
<h6 style="margin-top: 0px;">Infos</h6>
<div class="divider" style="margin-bottom: 10px;"></div>
<div class="row">
<div class="col s12">
<button id="show-metadata"
class="waves-effect
waves-light
btn-flat"
type="submit">Corpus Metadata
<i class="material-icons left">info_outline</i>
</button>
</div>
<div class="col s12">
<p>
<span id="received-match-count">
</span> of
<span id="match-count"></span>
matches loaded.
<br>
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 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>
<!-- 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>
{% include 'interactions/infos.html.j2' %}
{% include 'interactions/display.html.j2' %}
{% include 'interactions/analysis.html.j2' %}
{% include 'interactions/cite.html.j2' %}
</div>
{% include 'tables/query_results.html.j2' %}
</div>
</div>
</div>
<!-- Metadata modal -->
{% import "macros/query_result_macro.html.j2" as metadata %}
<div id="metadata-modal" class="modal bottom-sheet">
<div class="section">
<div class="col s12 right-align">
<a href="#!" class="modal-close waves-effect waves-green btn red">Close</a>
</div>
</div>
{% if query_metadata is defined %}
<div class="modal-content">
{{ metadata.show_metadata(query_metadata) }}
</div>
{% else %}
<div class="modal-content">
<div class="metaDataModal">
</div>
</div>
{% endif %}
<div class="modal-footer">
<a href="#!" class="modal-close waves-effect waves-green btn red">Close</a>
</div>
</div>
<!-- Modals -->
{% include 'modals/show_metadata.html.j2' %}
{% include 'modals/show_text_details.html.j2' %}
{% include 'modals/context_modal.html.j2' %}
<!-- Context modal used for detailed information about one match -->
<div id="context-modal" class="modal modal-fixed-footer">
<div class="modal-content">
<form>
<div class="row" style="margin-bottom: 0px; margin-top: -20px;">
<div class="col s12 m6 l6">
<div class="section">
<h6 style="margin-top: 0px;">Display</h6>
<div class="divider" style="margin-bottom: 10px;"></div>
<div class="col s12" style="margin-bottom: 10px;" id="display-inspect">
{{ inspect_display_options_form.expert_mode_inspect.label.text }}
<div class="switch right">
<label>
{{ inspect_display_options_form.expert_mode_inspect() }}
<span class="lever"></span>
</label>
</div>
</div>
<div class="col s12" style="margin-bottom: 10px;" id="create-inspect">
{{ inspect_display_options_form.highlight_sentences.label.text }}
<div class="switch right">
<label>
{{ inspect_display_options_form.highlight_sentences() }}
<span class="lever"></span>
</label>
</div>
</div>
<div class="col s12" style="margin-bottom: 10px;">
Sentences around match
<div class="input-field right" style="margin-top: -2rem;
margin-bottom: -2rem;
height: 0px;">
<p class="range-field">
<input type="range"
id="context-sentences"
min="1"
max="10"
value="3" />
</p>
</div>
</div>
</div>
</div>
</div>
</form>
<div class="row section">
<h5 style="margin-top: 0px;">Context for match:
<span id="context-match-nr"></span></h5>
<div class="divider" style="margin-bottom: 10px;"></div>
<div class="col s12" >
<div id="context-results">
</div>
</div>
</div>
</div>
<div class="modal-footer">
{# <a id="inspect-download-context" class="left waves-effect waves-light btn">
Export Single Context
<i class="material-icons right">file_download</i>
</a> #}
<a href="#!" class="modal-close waves-effect waves-light red btn">Close</a>
</div>
</div>
<script src="{{ url_for('static', filename='js/nopaque.Results.js') }}">
</script>
@ -208,7 +61,6 @@
// ###### global variables ######
var full_result_json;
var result_json;
var queryResultsDeterminateElement; // The progress bar for recieved results
var receivedMatchCountElement; // Nr. of loaded matches will be displayed in this element
var textLookupCountElement // Nr of texts the matches occured in will be shown in this element
var textTitlesElement; // matched text titles
@ -231,7 +83,6 @@
// ###### Initializing variables ######
displayOptionsFormElement = document.getElementById("display-options-form");
resultItems = [];
queryResultsDeterminateElement = document.getElementById("query-results-determinate");
receivedMatchCountElement = document.getElementById("received-match-count");
textLookupCountElement = document.getElementById("text-lookup-count");
textTitlesElement = document.getElementById("text-titles");