mirror of
https://gitlab.ub.uni-bielefeld.de/sfb1288inf/nopaque.git
synced 2025-06-27 08:20:34 +00:00
Preperations vor metadata modal in analysis and import
This commit is contained in:
Stephan Porada
@ -41,173 +41,202 @@
|
||||
<div class="card">
|
||||
<div class="card-content" id="result-list" style="overflow: hidden;">
|
||||
<div class="error-container hide show-on-error"></div>
|
||||
<div class="hide show-on-success" style="margin-top:-20px;">
|
||||
<div class="row" style="margin-bottom: 0px;">
|
||||
<div class="col s12 m3 l3" id="results-info">
|
||||
<div class="row section">
|
||||
<h6 style="margin-top: 0px;">Infos</h6>
|
||||
<div class="divider" style="margin-bottom: 10px;"></div>
|
||||
<div class="col" id="infos">
|
||||
<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 class=" row hide 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>
|
||||
<div class="col s12 m9 l9" id="actions-and-tools">
|
||||
<div class="row section">
|
||||
<div class="col s12 m3 l3" id="export">
|
||||
<h6 style="margin-top: 0px;">Export</h6>
|
||||
<div class="divider" style="margin-bottom: 10px;"></div>
|
||||
<div class="row">
|
||||
<div class="col s12">
|
||||
<button class="waves-effect
|
||||
waves-light
|
||||
btn-flat"
|
||||
type="submit"
|
||||
id="results-create">Create Results
|
||||
<i class="material-icons left">build</i>
|
||||
</button>
|
||||
<button id="query-results-export"
|
||||
class="waves-effect
|
||||
waves-light
|
||||
btn-flat
|
||||
hide"
|
||||
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 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 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>
|
||||
<!-- 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 class="col s12 m2 l2" id="export">
|
||||
<h6 style="margin-top: 0px;">Export</h6>
|
||||
<div class="divider" style="margin-bottom: 10px;"></div>
|
||||
<div class="row">
|
||||
<div class="col s12">
|
||||
<button class="waves-effect
|
||||
waves-light
|
||||
btn-flat"
|
||||
type="submit"
|
||||
id="results-create">Create Results
|
||||
<i class="material-icons left">build</i>
|
||||
</button>
|
||||
<button id="query-results-export"
|
||||
class="waves-effect
|
||||
waves-light
|
||||
btn-flat
|
||||
hide"
|
||||
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 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>
|
||||
@ -391,6 +420,7 @@
|
||||
var textLookupCountElement // Nr of texts the matches occured in will be shown in this element
|
||||
var textTitlesElement; // matched text titles
|
||||
var nrMarkedMatches; // count of matches marked for subresults
|
||||
var showMetadataButton; // Button to show corpus metadata
|
||||
|
||||
// ###### Defining local scope variables ######
|
||||
let contextPerItemElement; // Form Element for display option
|
||||
@ -439,6 +469,7 @@
|
||||
textLookupCountElement = document.getElementById("text-lookup-count");
|
||||
textTitlesElement = document.getElementById("text-titles");
|
||||
nrMarkedMatches = document.getElementById("nr-marked-matches");
|
||||
showMetadataButton = document.getElementById("show-metadata");
|
||||
|
||||
// ###### js list options and intialization ######
|
||||
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 = `
|
||||
<div class="preloader-wrapper button-icon-spinner small active">
|
||||
<div class="spinner-layer spinner-green-only">
|
||||
|
||||
Reference in New Issue
Block a user