First setup for metadata modal view

This commit is contained in:
Stephan Porada
2020-07-20 09:31:27 +02:00
parent 398d5c2989
commit 3e50c2f275
9 changed files with 160 additions and 101 deletions

View File

@ -87,7 +87,8 @@
<div class="col s12">
<button class="waves-effect
waves-light
btn-flat"
btn-flat
disabled"
type="submit"
id="results-create">Create Results
<i class="material-icons left">build</i>
@ -244,6 +245,18 @@
<!-- Modals -->
<!-- Metadata modal -->
{% import "macros/query_result_macro.html.j2" as metadata %}
<div id="metadata-modal" class="modal bottom-sheet">
<div class="modal-content">
{{ metadata.show_metadata("testasdasgs") }}
</div>
<div class="modal-footer">
<a href="#!" class="modal-close waves-effect waves-green btn red">Close</a>
</div>
</div>
<!-- Analysis init modal -->
<div class="modal no-autoinit" id="init-display">
<div class="modal-content">
@ -421,6 +434,11 @@
var textTitlesElement; // matched text titles
var nrMarkedMatches; // count of matches marked for subresults
var showMetadataButton; // Button to show corpus metadata
var activateInspectInteraction; // global interaction element
var expertModeInteraction; // global interaction element
var subResultsInteraction; // global interaction element
var changeContextInteraction; // global interaction element
var resultCreationRunning;
// ###### Defining local scope variables ######
let contextPerItemElement; // Form Element for display option
@ -490,11 +508,11 @@
// ###### event on DOMContentLoaded ######
document.addEventListener("DOMContentLoaded", () => {
//set accordion of collapsibles to false
M.Collapsible.init(collapsibleElements, {accordion: false});
// creates some modals on DOMContentLoaded
contextModal = M.Modal.init(contextModal, {"dismissible": true});
exportModal = M.Modal.init(exportModal, {"dismissible": true});
let defaultOptions = {"dismissible": true,
"preventScrolling": false};
contextModal = M.Modal.init(contextModal, defaultOptions);
exportModal = M.Modal.init(exportModal, defaultOptions);
initModal = M.Modal.init(initDisplayElement, {"dismissible": false});
// Init corpus analysis components
data = new Data();
@ -572,8 +590,8 @@
// htmlID. Callbacks are set for these elements which will be triggered on
// a pagination interaction by the user or if the status of the element has
// been altered. (Like the switche has ben turned on or off).
interactionElements = new Array();
let expertModeInteraction = new InteractionElement("display-options-form-expert_mode");
interactionElements = new InteractionElements();
expertModeInteraction = new InteractionElement("display-options-form-expert_mode");
expertModeInteraction.setCallback("on",
results.jsList.expertModeOn,
results.jsList,
@ -583,7 +601,7 @@
results.jsList,
["query-display"])
let subResultsInteraction = new InteractionElement("add-to-sub-results");
subResultsInteraction = new InteractionElement("add-to-sub-results");
subResultsInteraction.setCallback("on",
results.jsList.activateAddToSubResults,
results.jsList);
@ -591,22 +609,22 @@
results.jsList.deactivateAddToSubResults,
results.jsList);
let activateInspectInteraction = new InteractionElement("inspect",
activateInspectInteraction = new InteractionElement("inspect",
false);
activateInspectInteraction.setCallback("noCheck",
results.jsList.activateInspect,
results.jsList);
let changeContextInteraction = new InteractionElement("display-options-form-results_per_page",
changeContextInteraction = new InteractionElement("display-options-form-results_per_page",
false);
changeContextInteraction.setCallback("noCheck",
results.jsList.changeContext,
results.jsList)
interactionElements.push(expertModeInteraction, subResultsInteraction, activateInspectInteraction, changeContextInteraction);
interactionElements.addInteractions([expertModeInteraction, subResultsInteraction, activateInspectInteraction, changeContextInteraction]);
// checks if a change for every interactionElement happens and executes
// the callbacks accordingly
InteractionElement.onChangeExecute(interactionElements);
interactionElements.onChangeExecute();
// eventListener if pagination is used to apply new context size to new page
// and also activate inspect match if progress is 100
@ -617,12 +635,24 @@
});
}
// ### Show corpus Metadata
showMetadataButton.onclick = () => {
let deleteOverlay = () => {
let overlay = document.getElementsByClassName("modal-overlay")[0];
overlay.remove();
}
let modal = document.getElementById("metadata-modal");
console.log(modal);
modal = M.Modal.init(modal, {"preventScrolling": false,
"opacity": 0.0,
"dismissible": false,
"onOpenEnd": deleteOverlay});
console.log(modal);
modal.open();
};
});
// ### Show corpus Metadata
showMetadataButton.onclick = () => {
console.log("click");
}
// ### Download events and sub-results creation ###
var loadingSpinnerHTML = `
@ -653,9 +683,9 @@
// 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.resultsData,
let filename = results.resultsData.createDownloadFilename("matches-results");
results.resultsData.addData(results.metaData);
results.resultsData.downloadJSONRessource(filename, results.resultsData,
downloadResultsJSONElement
)};
}
@ -675,7 +705,7 @@
// add onclick to download JSON button and download the file
downloadResultsJSONElement = document.getElementById("download-results-json")
downloadResultsJSONElement.onclick = () => {
let filename = results.data.createDownloadFilename("matches-sub-results");
let filename = results.subResultsData.createDownloadFilename("matches-sub-results");
results.subResultsData.downloadJSONRessource(filename,
results.subResultsData,
downloadResultsJSONElement
@ -690,6 +720,6 @@
results.data.downloadJSONRessource(filename,
results.jsList.contextData,
downloadInspectContextElement);
};
};
</script>
{% endblock %}