sporada/nopaque
1
0
Fork 0
mirror of https://gitlab.ub.uni-bielefeld.de/sfb1288inf/nopaque.git synced 2024-11-15 01:05:42 +00:00
Code Issues Projects Releases Wiki Activity

Rename some things. Add metadata to downloadable json

Browse Source
This commit is contained in:
Stephan Porada 2020-04-30 15:21:55 +02:00
parent 1350e6ddd6
commit 58295b986d
4 changed files with 65 additions and 55 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
app/static/js/nopaque.Results.js
View File

@ -1,20 +1,20 @@
class Results { class Results {
constructor(resultsJSON, resultsList , resultsMetaData) { constructor(data, jsList , metaData) {
this.resultsJSON = resultsJSON; this.data = data;
this.resultsList = resultsList; this.jsList = jsList;
this.resultsMetaData = resultsMetaData this.metaData = metaData
} }
clearAll() { clearAll() {
this.resultsList.clear(); this.jsList.clear();
this.resultsList.update(); this.jsList.update();
this.resultsJSON.init(); this.data.init();
this.resultsMetaData.init(); this.metaData.init();
} }
} }
class ResultsJSON { class Data {
// Sets empty object structure. Also usefull to delete old results. // Sets empty object structure. Also usefull to delete old results.
// matchCount default is 0 // matchCount default is 0
init(matchCount = 0) { init(matchCount = 0) {
@ -24,6 +24,10 @@ class ResultsJSON {
this["match_count"] = matchCount; this["match_count"] = matchCount;
} }
addData(jsonData) {
Object.assign(this, jsonData);
}
// get query as string from form Element // get query as string from form Element
getQueryStr(queryFormElement) { getQueryStr(queryFormElement) {
// gets query // gets query
@ -77,7 +81,7 @@ class ResultsJSON {
} }
} }
class ResultsMetaData { class MetaData {
// Sets empty object structure when no input is given. // Sets empty object structure when no input is given.
// Else it works like a delete. // Else it works like a delete.
init(json = {}) { init(json = {}) {

38
app/static/js/nopaque.callbacks.js
View File

@ -1,5 +1,5 @@
function recvMetaData(payload) { function recvMetaData(payload) {
results.resultsMetaData.init(payload) results.metaData.init(payload)
// results.metaDataJSON.corpus_name = payload.corpus_name; // results.metaDataJSON.corpus_name = payload.corpus_name;
// results.metaDataJSON.corpus_description = payload.corpus_description; // results.metaDataJSON.corpus_description = payload.corpus_description;
// results.metaDataJSON.corpus_creation_date = payload.corpus_creation_date; // results.metaDataJSON.corpus_creation_date = payload.corpus_creation_date;
@ -10,7 +10,7 @@ function recvMetaData(payload) {
// results.metaDataJSON.corpus_analysis_date = payload.corpus_analysis_date; // results.metaDataJSON.corpus_analysis_date = payload.corpus_analysis_date;
// results.metaDataJSON.corpus_cqi_py_version = payload.corpus_cqi_py_version; // results.metaDataJSON.corpus_cqi_py_version = payload.corpus_cqi_py_version;
// results.metaDataJSON.corpus_cqpserver_version = payload.corpus_cqpserver_version; // results.metaDataJSON.corpus_cqpserver_version = payload.corpus_cqpserver_version;
console.log(results.resultsMetaData); console.log(results.metaData);
} }
function querySetup(payload) { function querySetup(payload) {
@ -28,8 +28,8 @@ function querySetup(payload) {
// this has to be done here again because the last chunk from old results was still being recieved // this has to be done here again because the last chunk from old results was still being recieved
results.clearAll() results.clearAll()
// Get query string again // Get query string again
results.resultsJSON.getQueryStr(queryFormElement); results.data.getQueryStr(queryFormElement);
results.resultsJSON.match_count = payload.match_count; results.data.match_count = payload.match_count;
} }
function queryRenderResults(payload) { function queryRenderResults(payload) {
@ -37,9 +37,9 @@ function queryRenderResults(payload) {
// This is called when results are transmitted and being recieved // This is called when results are transmitted and being recieved
console.log("Current recieved chunk:", payload.chunk); console.log("Current recieved chunk:", payload.chunk);
if (payload.chunk.cpos_ranges == true) { if (payload.chunk.cpos_ranges == true) {
results.resultsJSON["cpos_ranges"] = true; results.data["cpos_ranges"] = true;
} else { } else {
results.resultsJSON["cpos_ranges"] = false; results.data["cpos_ranges"] = false;
} }
// update progress bar // update progress bar
queryResultsDeterminateElement.style.width = `${payload.progress}%`; queryResultsDeterminateElement.style.width = `${payload.progress}%`;
@ -47,33 +47,33 @@ function queryRenderResults(payload) {
resultItems = []; // list for holding every row item resultItems = []; // list for holding every row item
// get infos for full match row // get infos for full match row
for (let [index, match] of payload.chunk.matches.entries()) { for (let [index, match] of payload.chunk.matches.entries()) {
resultItems.push({...match, ...{"index": index + results.resultsJSON.matches.length}}); resultItems.push({...match, ...{"index": index + results.data.matches.length}});
} }
resultsList.add(resultItems, (items) => { results.jsList.add(resultItems, (items) => {
for (let item of items) { for (let item of items) {
item.elm = resultsList.createResultRowElement(item, payload.chunk); item.elm = results.jsList.createResultRowElement(item, payload.chunk);
} }
resultsList.update(); results.jsList.update();
results.resultsList.changeContext(); // sets lr context on first result load results.jsList.changeContext(); // sets lr context on first result load
}); });
// incorporating new chunk results into full results // incorporating new chunk results into full results
results.resultsJSON.matches.push(...payload.chunk.matches); results.data.matches.push(...payload.chunk.matches);
Object.assign(results.resultsJSON.cpos_lookup, payload.chunk.cpos_lookup); Object.assign(results.data.cpos_lookup, payload.chunk.cpos_lookup);
Object.assign(results.resultsJSON.text_lookup, payload.chunk.text_lookup); Object.assign(results.data.text_lookup, payload.chunk.text_lookup);
// show user current and total match count // show user current and total match count
receivedMatchCountElement.innerText = `${results.resultsJSON.matches.length}`; receivedMatchCountElement.innerText = `${results.data.matches.length}`;
textLookupCountElement.innerText = `${Object.keys(results.resultsJSON.text_lookup).length}`; textLookupCountElement.innerText = `${Object.keys(results.data.text_lookup).length}`;
console.log("Results recieved:", results.resultsJSON); console.log("Results recieved:", results.data);
// upate progress status // upate progress status
progress = payload.progress; // global declaration progress = payload.progress; // global declaration
if (progress === 100) { if (progress === 100) {
queryResultsProgressElement.classList.add("hide"); queryResultsProgressElement.classList.add("hide");
queryResultsUserFeedbackElement.classList.add("hide"); queryResultsUserFeedbackElement.classList.add("hide");
queryResultsExportElement.classList.remove("disabled"); queryResultsExportElement.classList.remove("disabled");
results.resultsList.activateInspect(); results.jsList.activateInspect();
} }
// inital expert mode check and activation // inital expert mode check and activation
if (expertModeSwitchElement.checked) { if (expertModeSwitchElement.checked) {
results.resultsList.expertModeOn("query-display"); results.jsList.expertModeOn("query-display");
} }
} }

16
app/static/js/nopaque.lists.js
View File

@ -175,8 +175,8 @@ class ResultsList extends List {
nopaque.socket.emit("corpus_analysis_inspect_match", nopaque.socket.emit("corpus_analysis_inspect_match",
{ {
payload: { payload: {
first_cpos: results.resultsJSON.matches[dataIndex].c[0], first_cpos: results.data.matches[dataIndex].c[0],
last_cpos: results.resultsJSON.matches[dataIndex].c[1] last_cpos: results.data.matches[dataIndex].c[1]
} }
} }
); );
@ -209,8 +209,10 @@ class ResultsList extends List {
let tokenHTMlElement; let tokenHTMlElement;
let uniqueS; let uniqueS;
// TODO: contextData needs some identifier like match Nr to indicate what context this is. Also use this in the filename
this.contextData = response.payload; this.contextData = response.payload;
this.contextData["query"] = results.resultsJSON.query; this.contextData["query"] = results.data.query;
Object.assign(this.contextData, results.metaData);
contextResultsElement = document.getElementById("context-results"); contextResultsElement = document.getElementById("context-results");
modalExpertModeSwitchElement = document.getElementById("inspect-display-options-form-expert_mode_inspect"); modalExpertModeSwitchElement = document.getElementById("inspect-display-options-form-expert_mode_inspect");
highlightSentencesSwitchElement = document.getElementById("inspect-display-options-form-highlight_sentences"); highlightSentencesSwitchElement = document.getElementById("inspect-display-options-form-highlight_sentences");
@ -441,7 +443,7 @@ class ResultsList extends List {
tooltipEventCreate(event) { tooltipEventCreate(event) {
// console.log("Create Tooltip on mouseover."); // console.log("Create Tooltip on mouseover.");
let token; let token;
token = results.resultsJSON.cpos_lookup[event.target.dataset.cpos]; token = results.data.cpos_lookup[event.target.dataset.cpos];
if (!token) { if (!token) {
token = this.contextData.cpos_lookup[event.target.dataset.cpos]; token = this.contextData.cpos_lookup[event.target.dataset.cpos];
} }
@ -488,11 +490,11 @@ class ResultsList extends List {
NER: ${token.ner} NER: ${token.ner}
</td> </td>
<td class="left-align"> <td class="left-align">
Title: ${resultsJSON.text_lookup[token.text].title} Title: ${results.data.text_lookup[token.text].title}
<br> <br>
Author: ${resultsJSON.text_lookup[token.text].author} Author: ${results.data.text_lookup[token.text].author}
<br> <br>
Publishing year: ${resultsJSON.text_lookup[token.text].publishing_year} Publishing year: ${results.data.text_lookup[token.text].publishing_year}
</td> </td>
</tr> </tr>
</table>`} </table>`}

42
app/templates/corpora/analyse_corpus.html.j2
View File

@ -292,7 +292,7 @@
var queryResultsUserFeedbackElement; // Element showing match count|total etc var queryResultsUserFeedbackElement; // Element showing match count|total etc
var receivedMatchCountElement; // Nr. of loaded matches will be displayed in this element var receivedMatchCountElement; // Nr. of loaded matches will be displayed in this element
var results; // results object var results; // results object
var resultsJSON; // full JSON object holding match results var data; // full JSON object holding match results
var resultsList; // resultsList object var resultsList; // resultsList object
var resultsListOptions; // specifies ResultsList options var resultsListOptions; // specifies ResultsList options
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
@ -363,10 +363,10 @@
exportModal = M.Modal.init(exportModal, {"dismissible": true}); exportModal = M.Modal.init(exportModal, {"dismissible": true});
initModal = M.Modal.init(initDisplayElement, {"dismissible": false}); initModal = M.Modal.init(initDisplayElement, {"dismissible": false});
// Init corpus analysis components // Init corpus analysis components
resultsJSON = new ResultsJSON(); data = new Data();
resultsList = new ResultsList("result-list", resultsListOptions); resultsList = new ResultsList("result-list", resultsListOptions);
resultsMetaData = new ResultsMetaData(); resultsMetaData = new MetaData();
results = new Results(resultsJSON, resultsList, resultsMetaData); results = new Results(data, resultsList, resultsMetaData);
initDisplay = new CorpusAnalysisDisplay(initDisplayElement); initDisplay = new CorpusAnalysisDisplay(initDisplayElement);
queryDisplay = new CorpusAnalysisDisplay(queryDisplayElement); queryDisplay = new CorpusAnalysisDisplay(queryDisplayElement);
client = new CorpusAnalysisClient({{ corpus_id }}, nopaque.socket); client = new CorpusAnalysisClient({{ corpus_id }}, nopaque.socket);
@ -392,7 +392,7 @@
queryRenderResults(payload); queryRenderResults(payload);
}); });
client.setCallback("query_match_context", (payload) => { client.setCallback("query_match_context", (payload) => {
results.resultsList.showMatchContext(payload); results.jsList.showMatchContext(payload);
}) })
// Trigger corpus analysis initialization on server side // Trigger corpus analysis initialization on server side
@ -419,34 +419,34 @@
// Prevent page from reloading on submit // Prevent page from reloading on submit
event.preventDefault(); event.preventDefault();
// Get query string and send query to server // Get query string and send query to server
results.resultsJSON.getQueryStr(queryFormElement); results.data.getQueryStr(queryFormElement);
client.query(results.resultsJSON.query); client.query(results.data.query);
}); });
// live update of hits per page if hits per page value is changed // live update of hits per page if hits per page value is changed
let changeHitsPerPageBind = results.resultsList.changeHitsPerPage.bind(results.resultsList); let changeHitsPerPageBind = results.jsList.changeHitsPerPage.bind(results.jsList);
hitsPerPageInputElement.onchange = changeHitsPerPageBind; hitsPerPageInputElement.onchange = changeHitsPerPageBind;
// live update of lr context per item if context value is changed // live update of lr context per item if context value is changed
contextPerItemElement.onchange = results.resultsList.changeContext; contextPerItemElement.onchange = results.jsList.changeContext;
// eventListener if pagination is used to apply new context size to new page // eventListener if pagination is used to apply new context size to new page
// and also activate inspect match if progress is 100 // and also activate inspect match if progress is 100
for (let element of paginationElements) { for (let element of paginationElements) {
element.addEventListener("click", results.resultsList.changeContext); element.addEventListener("click", results.jsList.changeContext);
element.addEventListener("click", results.resultsList.activateInspect); element.addEventListener("click", results.jsList.activateInspect);
} }
expertModeSwitchElement.addEventListener("change", (event) => { expertModeSwitchElement.addEventListener("change", (event) => {
if (event.target.checked) { if (event.target.checked) {
results.resultsList.expertModeOn("query-display"); results.jsList.expertModeOn("query-display");
for (let element of paginationElements) { for (let element of paginationElements) {
element.onclick = (event) => { element.onclick = (event) => {
results.resultsList.eventHandlerCheck(event) results.jsList.eventHandlerCheck(event)
} }
} }
} else { } else {
results.resultsList.expertModeOff("query-display"); results.jsList.expertModeOff("query-display");
} }
}); });
}); });
@ -458,16 +458,20 @@
// add onclick to download JSON button and download the file // add onclick to download JSON button and download the file
downloadResultsJSONElement = document.getElementById("download-results-json") downloadResultsJSONElement = document.getElementById("download-results-json")
downloadResultsJSONElement.onclick = () => { downloadResultsJSONElement.onclick = () => {
let filename = results.resultsJSON.createDownloadFilename("matches"); let filename = results.data.createDownloadFilename("matches");
results.resultsJSON.downloadJSONRessource(filename, results.resultsJSON, downloadResultsJSONElement results.data.addData(results.metaData);
results.data.downloadJSONRessource(filename, results.data,
downloadResultsJSONElement
)}; )};
// add onclick to download JSON button and download the file // add onclick to download JSON button and download the file
downloadInspectContextElement = document.getElementById("inspect-download-context") downloadInspectContextElement = document.getElementById("inspect-download-context")
downloadInspectContextElement.onclick = () => { downloadInspectContextElement.onclick = () => {
let filename = results.resultsJSON.createDownloadFilename("context"); let filename = results.data.createDownloadFilename("context");
console.log(filename); results.data.addData(results.metaData);
results.resultsJSON.downloadJSONRessource(filename, results.resultsList.contextData, downloadInspectContextElement); results.data.downloadJSONRessource(filename,
results.jsList.contextData,
downloadInspectContextElement);
}; };
</script> </script>
{% endblock %} {% endblock %}