Rework results download. To alwas generate full inspect context.

This commit is contained in:
Stephan Porada
2020-07-16 14:00:52 +02:00
parent 0714070a9b
commit 7ccd2a1c7c
6 changed files with 130 additions and 70 deletions

View File

@ -79,21 +79,37 @@
<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
disabled"
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
disabled"
hide"
type="submit">Sub-Results
<i class="material-icons left">file_download</i>
</button>
@ -127,15 +143,6 @@
</textarea>
</div>
</div>
<div class="col s12 hide" id="sub-results-create-div">
<button class="waves-effect
waves-light
btn-flat
disabled"
type="submit">Create
<i class="material-icons left">build</i>
</button>
</div>
</div>
</div>
<div class="col s12 m3 l3" id="display">
@ -370,14 +377,15 @@
var queryDisplay; // CorpusAnalysisDisplay object first undfined on DOMContentLoaded defined
var queryFormElement; // the query form
var queryResultsDeterminateElement; // The progress bar for recieved results
var queryResultsExportElement; // Download button opens download modal
var resultsExportElement; // Download button opens download modal
var queryResultsProgressElement; // Div element holding the progress bar
var queryResultsUserFeedbackElement; // Element showing match count|total etc
var receivedMatchCountElement; // Nr. of loaded matches will be displayed in this element
var results; // results object
var resultsList; // resultsList object
var resultsListOptions; // specifies ResultsList options
var subResultsCreateElement; // if presses sub results will be created from ids
var subResultsCreateElement; // if pressed sub results will be created from ids
var resultsCreateElement; // if pressed results will pe created for all matches
var subResultsExportElement; // button to download sub results
var subResultsIdListElement; // list showing marked matches for sub corpus creation
var textLookupCountElement // Nr of texts the matches occured in will be shown in this element
@ -420,11 +428,12 @@
queryDisplayElement = document.getElementById("query-display");
queryFormElement = document.getElementById("query-form");
queryResultsDeterminateElement = document.getElementById("query-results-determinate");
queryResultsExportElement = document.getElementById("query-results-export");
resultsExportElement = document.getElementById("query-results-export");
queryResultsProgressElement = document.getElementById("query-results-progress");
queryResultsUserFeedbackElement = document.getElementById("query-results-user-feedback");
receivedMatchCountElement = document.getElementById("received-match-count");
subResultsCreateElement = document.getElementById("sub-results-create-div");
subResultsCreateElement = document.getElementById("sub-results-create");
resultsCreateElement = document.getElementById("results-create");
subResultsExportElement = document.getElementById("sub-results-export");
subResultsIdListElement = document.getElementById("sub-results-match-ids-div");
textLookupCountElement = document.getElementById("text-lookup-count");
@ -580,37 +589,48 @@
});
// ### Download events and sub-results creation ###
var loadingSpinnerHTML = `
<div class="preloader-wrapper button-icon-spinner small active">
<div class="spinner-layer spinner-green-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>
`
// create results on click from all match ids
resultsCreateElement.onclick = () => {
resultsCreateElement.getElementsByTagName("i")[0].classList.add("hide");
resultsCreateElement.innerText = "Creating...";
resultsCreateElement.insertAdjacentHTML("afterbegin", loadingSpinnerHTML);
results.data.createResultsData("results");
}
// Add onclick to open download modal when Export Results button is pressed
queryResultsExportElement.onclick = () => {
resultsExportElement.onclick = () => {
exportModal.open();
// add onclick to download JSON button and download the file
downloadResultsJSONElement = document.getElementById("download-results-json")
downloadResultsJSONElement.onclick = () => {
let filename = results.data.createDownloadFilename("matches");
results.data.addData(results.metaData);
results.data.downloadJSONRessource(filename, results.data,
results.data.downloadJSONRessource(filename, results.resultsData,
downloadResultsJSONElement
)};
}
// create sub results on click from shown marked match ids
subResultsCreateElement.onclick = () => {
subResultsCreateElement.getElementsByTagName("i")[0].classList.add("hide");
let html = `
<div class="preloader-wrapper button-icon-spinner small active">
<div class="spinner-layer spinner-green-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>
`
subResultsCreateElement.insertAdjacentHTML("afterbegin", html);
results.data.createSubResultsData();
subResultsCreateElement.getElementsByTagName("i")[0].remove();
subResultsCreateElement.innerText = "Creating...";
subResultsCreateElement.insertAdjacentHTML("afterbegin", loadingSpinnerHTML);
results.data.createResultsData("sub-results");
}
// Add onclick to open download modal when sub-results button is pressed