mirror of
https://gitlab.ub.uni-bielefeld.de/sfb1288inf/nopaque.git
synced 2025-06-12 09:00:40 +00:00
Add match_count represnetation for the user.
This commit is contained in:
Stephan Porada
@ -75,8 +75,8 @@ function queryDataPreparingCallback(resultsList, detail) {
|
||||
'#interactions-menu',
|
||||
'#recieved-match-count',
|
||||
'#total-match-count',
|
||||
'#text-lookup-count',
|
||||
'#text-lookup-titles',
|
||||
'#text-lookup-count',
|
||||
'#query-results-user-feedback',
|
||||
'#query-progress-bar',
|
||||
'#query-results-create',
|
||||
@ -84,16 +84,16 @@ function queryDataPreparingCallback(resultsList, detail) {
|
||||
'#nr-marked-matches',
|
||||
]);
|
||||
// show or enable some things for the user
|
||||
resultsList.interactionsMenu.classList.toggle('hide', false)
|
||||
resultsList.interactionsMenu.classList.toggle('hide', false);
|
||||
resultsList.queryResultsUserFeedback.classList.toggle('hide', false);
|
||||
resultsList.queryProgressBar.classList.toggle('hide', false);
|
||||
resultsList.showCorpusFiles.classList.toggle('disabled', true);
|
||||
/**
|
||||
* Set some initial values for the user feedback
|
||||
* or reset values for new issued query
|
||||
*/
|
||||
resultsList.recievedMatchCount.textContent = 0;
|
||||
resultsList.totalMatchCount.textContent = results.data.match_count;
|
||||
resultsList.textLookupTitles.textContent = '';
|
||||
resultsList.textLookupCount.textContent = 0;
|
||||
resultsList.nrMarkedMatches.textContent = 0;
|
||||
resultsList.subResultsIndexesDisplay.textContent = '';
|
||||
@ -121,23 +121,18 @@ function queryDataRecievingCallback(resultsList, detail) {
|
||||
client);
|
||||
}
|
||||
});
|
||||
// update user feedback about query status
|
||||
resultsList.recievedMatchCount.textContent = results.data.matches.length;
|
||||
resultsList.queryProgressBar.firstElementChild.style.width = `${client.requestQueryProgress}%`;
|
||||
resultsList.textLookupCount.textContent = `${Object.keys(results.data.text_lookup).length}`;
|
||||
let titles = new Array();
|
||||
for (let [key, value] of Object.entries(results.data.text_lookup)) {
|
||||
titles.push(`${value.title} (${value.publishing_year})`);
|
||||
}
|
||||
resultsList.textLookupTitles.textContent = `${titles.join(', ')}`;
|
||||
// updating table on finished item creation callback via createResultRowElement
|
||||
resultsList.update();
|
||||
resultsList.changeHitsPerPage(client, results);
|
||||
resultsList.changeContext();
|
||||
//activate expertMode of switch is checked
|
||||
if (resultsList.displayOptionsFormExpertMode.checked) {
|
||||
resultsList.expertModeOn('query-display', results);
|
||||
}
|
||||
// update user feedback about query status
|
||||
resultsList.recievedMatchCount.textContent = results.data.matches.length;
|
||||
resultsList.queryProgressBar.firstElementChild.style.width = `${client.requestQueryProgress}%`;
|
||||
resultsList.textLookupCount.textContent = `${Object.keys(results.data.text_lookup).length}`;
|
||||
// updating table on finished item creation callback via createResultRowElement
|
||||
resultsList.update();
|
||||
resultsList.changeHitsPerPage(client, results);
|
||||
resultsList.changeContext();
|
||||
//activate expertMode of switch is checked
|
||||
if (resultsList.displayOptionsFormExpertMode.checked) {
|
||||
resultsList.expertModeOn('query-display', results);
|
||||
}
|
||||
} else if (!client.dynamicMode) {
|
||||
resultsList.add(resultItems, (items) => {
|
||||
for (let item of items) {
|
||||
@ -151,11 +146,6 @@ function queryDataRecievingCallback(resultsList, detail) {
|
||||
resultsList.recievedMatchCount.textContent = results.data.matches.length;
|
||||
resultsList.queryProgressBar.firstElementChild.style.width = `${client.requestQueryProgress}%`;
|
||||
resultsList.textLookupCount.textContent = `${Object.keys(results.data.text_lookup).length}`;
|
||||
let titles = new Array();
|
||||
for (let [key, value] of Object.entries(results.data.text_lookup)) {
|
||||
titles.push(`${value.title} (${value.publishing_year})`);
|
||||
}
|
||||
resultsList.textLookupTitles.textContent = `${titles.join(', ')}`;
|
||||
// updating table on finished item creation callback via createResultRowElement
|
||||
resultsList.update();
|
||||
resultsList.changeHitsPerPage(client, results);
|
||||
@ -170,6 +160,7 @@ function queryDataRecievedCallback(resultsList, detail) {
|
||||
resultsList.queryProgressBar.classList.toggle('hide');
|
||||
// reset bar progress for next query
|
||||
resultsList.queryProgressBar.firstElementChild.style.width = '0%';
|
||||
resultsList.showCorpusFiles.classList.toggle('disabled');
|
||||
}
|
||||
|
||||
/**
|
||||
|
||||
@ -93,6 +93,63 @@ function showMetaData(resultsList, results) {
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* The following event listener handles the button showing infos about matches
|
||||
* and their corresponding corpus files
|
||||
*/
|
||||
|
||||
function showCorpusFiles(resultsList, results) {
|
||||
resultsList.showCorpusFiles.onclick = () => {
|
||||
resultsList.showCorpusFilesModalContent.innerHTML = '';
|
||||
let htmlString = `
|
||||
<div id="corpus-file-table">
|
||||
<ul class="pagination paginationTop"></ul>
|
||||
<table class="responsive-table highlight">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="sort" data-sort="title">Title</th>
|
||||
<th class="sort" data-sort="year">Year</th>
|
||||
<th class="sort" data-sort="match-count">Match count in this text</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="list">
|
||||
`
|
||||
for (let [key, value] of Object.entries(results.data.text_lookup)) {
|
||||
htmlString += `
|
||||
<tr>
|
||||
<td class="title">${value.title}</td>
|
||||
<td class="year">${value.publishing_year}</td>
|
||||
<td class="match-count">${value.match_count}</td>
|
||||
</tr>
|
||||
`
|
||||
}
|
||||
htmlString += `
|
||||
</tbody>
|
||||
</table>
|
||||
<ul class="pagination paginationBottom"></ul>
|
||||
</div>
|
||||
`
|
||||
resultsList.showCorpusFilesModalContent.insertAdjacentHTML('afterbegin', htmlString);
|
||||
resultsList.showCorpusFilesModal.open();
|
||||
let options = {
|
||||
page: 10,
|
||||
pagination: [{
|
||||
name: "paginationTop",
|
||||
paginationClass: "paginationTop",
|
||||
innerWindow: 8,
|
||||
outerWindow: 1
|
||||
}, {
|
||||
paginationClass: "paginationBottom",
|
||||
innerWindow: 8,
|
||||
outerWindow: 1
|
||||
}],
|
||||
valueNames: ["title", "year", "match-count"],
|
||||
};
|
||||
let corpusFileTable = new List('corpus-file-table', options);
|
||||
console.log(corpusFileTable);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Checks if resultsList.exportFullInspectContext switch is changed.
|
||||
* If it has been changed reset all Download buttons.
|
||||
@ -207,6 +264,7 @@ export {
|
||||
actionButtons,
|
||||
displayOptions,
|
||||
showMetaData,
|
||||
showCorpusFiles,
|
||||
exportFullContextSwitch,
|
||||
createFullResults,
|
||||
createSubResults,
|
||||
|
||||
@ -1,182 +0,0 @@
|
||||
// This callback is called on a socket.on "corpus_analysis_send_meta_data".
|
||||
// Handels incoming corpus metadata
|
||||
function recvMetaData(payload) {
|
||||
results.metaData.init(payload)
|
||||
console.log("Metada recieved:", results.metaData);
|
||||
}
|
||||
|
||||
// This callback is called in socket.on "corpus_analysis_get_match_with_full_context" but
|
||||
// only if the response.type is "sub-results".
|
||||
// Saves the incoming inspect match results into results.subResultsData.
|
||||
function saveSubResultsChoices(response) {
|
||||
console.log("Recieving results for export.");
|
||||
if (response.type === "sub-results") {
|
||||
results.subResultsData.init();
|
||||
results.subResultsData.matches.push(...response.payload.matches);
|
||||
results.subResultsData.addData(response.payload.cpos_lookup, "cpos_lookup");
|
||||
results.subResultsData.addData(response.payload.text_lookup, "text_lookup");
|
||||
results.subResultsData.addData(results.metaData);
|
||||
results.subResultsData.query = results.data.query;
|
||||
results.subResultsData.corpus_type = response.type;
|
||||
results.subResultsData.match_count = [...response.payload.matches].length;
|
||||
results.subResultsData.cpos_ranges = response.payload.cpos_ranges;
|
||||
// hides create element after all results are revieved
|
||||
subResultsCreateElement.classList.add("hide");
|
||||
// shows export element after create element hs been hidden
|
||||
subResultsExportElement.classList.remove("hide", "btn-flat");
|
||||
subResultsExportElement.classList.add("pulse", "btn-small");
|
||||
setTimeout(() => {
|
||||
subResultsExportElement.classList.remove("pulse", "btn-small");
|
||||
subResultsExportElement.classList.add("btn-flat");
|
||||
clearTimeout();
|
||||
}, 3000)
|
||||
// Resets the subResultsCreateElement (removing spinner with setting innerText)
|
||||
subResultsCreateElement.innerText = "Create Sub-Results";
|
||||
subResultsCreateElement.insertAdjacentHTML("beforeend", `<i class="material-icons left">build</i>`);
|
||||
// reactivate resultsCreateElement
|
||||
resultsCreateElement.classList.remove("disabled");
|
||||
} else if (response.type === "results") {
|
||||
results.resultsData.init();
|
||||
results.resultsData.matches.push(...response.payload.matches);
|
||||
results.resultsData.addData(response.payload.cpos_lookup, "cpos_lookup");
|
||||
results.resultsData.addData(response.payload.text_lookup, "text_lookup");
|
||||
results.resultsData.addData(results.metaData);
|
||||
results.resultsData.query = results.data.query;
|
||||
results.resultsData.corpus_type = response.type;
|
||||
results.resultsData.match_count = [...response.payload.matches].length;
|
||||
results.resultsData.cpos_ranges = response.payload.cpos_ranges;
|
||||
// hides create element after all results are revieved
|
||||
resultsCreateElement.classList.add("hide");
|
||||
// shows export element after create element hs been hidden
|
||||
resultsExportElement.classList.remove("hide", "btn-flat");
|
||||
resultsExportElement.classList.add("pulse", "btn-small");
|
||||
setTimeout(() => {
|
||||
resultsExportElement.classList.remove("pulse", "btn-small");
|
||||
resultsExportElement.classList.add("btn-flat");
|
||||
clearTimeout();
|
||||
}, 3000)
|
||||
// Resets the resultsCreateElement (removing spinner with setting innerText)
|
||||
resultsCreateElement.innerText = "Create Results";
|
||||
resultsCreateElement.insertAdjacentHTML("beforeend", `<i class="material-icons left">build</i>`);
|
||||
// reactivate subResultsCreateElement
|
||||
subResultsCreateElement.classList.remove("disabled");
|
||||
}
|
||||
// reactivate inspect
|
||||
results.jsList.activateInspect();
|
||||
activateInspectInteraction.setCallback("noCheck",
|
||||
results.jsList.activateInspect,
|
||||
results.jsList);
|
||||
// set resultCreationRunning to flase
|
||||
resultCreationRunning = false;
|
||||
}
|
||||
|
||||
// This callback is called on socket.on "query".
|
||||
// Does some hiding, showing disabling etc.
|
||||
function querySetup(payload) {
|
||||
// some hiding and resetting
|
||||
let textarea = subResultsIdListElement.getElementsByTagName("textarea")[0];
|
||||
textarea.innerText = "";
|
||||
M.textareaAutoResize(textarea);
|
||||
nrMarkedMatches.innerText = 0;
|
||||
results.jsList.addToSubResultsStatus = {};
|
||||
results.jsList.addToSubResultsIdsToShow = new Set();
|
||||
resultsExportElement.classList.add("disabled");
|
||||
addToSubResultsElement.setAttribute("disabled", "");
|
||||
queryResultsDeterminateElement.style.width = "0%";
|
||||
queryResultsProgressElement.classList.remove("hide");
|
||||
queryResultsUserFeedbackElement.classList.remove("hide");
|
||||
resultsCreateElement.classList.add("disabled");
|
||||
resultsCreateElement.classList.remove("hide");
|
||||
resultsExportElement.classList.add("hide");
|
||||
// some initial values
|
||||
receivedMatchCountElement.innerText = "0";
|
||||
textLookupCountElement.innerText = "0";
|
||||
matchCountElement.innerText = payload.match_count;
|
||||
textTitlesElement.innterText = "";
|
||||
// always re initializes results to delete old results from it
|
||||
// this has to be done here again because the last chunk from old results was still being recieved
|
||||
results.clearAll()
|
||||
// Get query string again
|
||||
results.data.getQueryStr(queryFormElement);
|
||||
results.data.match_count = payload.match_count;
|
||||
}
|
||||
|
||||
// This callback is called on socket.on "query_results"
|
||||
// this handels the incoming result chunks
|
||||
function queryRenderResults(payload, imported=false) {
|
||||
let resultItems; // array of built html result items row element
|
||||
// This is called when results are transmitted and being recieved
|
||||
console.log("Current recieved chunk:", payload.chunk);
|
||||
if (payload.chunk.cpos_ranges == true) {
|
||||
results.data["cpos_ranges"] = true;
|
||||
} else {
|
||||
results.data["cpos_ranges"] = false;
|
||||
}
|
||||
// building the result list js list from incoming chunk
|
||||
resultItems = []; // list for holding every row item
|
||||
// get infos for full match row
|
||||
for (let [index, match] of payload.chunk.matches.entries()) {
|
||||
resultItems.push({...match, ...{"index": index + results.data.matches.length}});
|
||||
}
|
||||
if (!imported) {
|
||||
// update progress bar
|
||||
queryResultsDeterminateElement.style.width = `${payload.progress}%`;
|
||||
results.jsList.add(resultItems, (items) => {
|
||||
for (let item of items) {
|
||||
item.elm = results.jsList.createResultRowElement(item, payload.chunk);
|
||||
}
|
||||
helperQueryRenderResults(payload);
|
||||
if (progress === 100) {
|
||||
resultsCreateElement.classList.remove("disabled");
|
||||
queryResultsProgressElement.classList.add("hide");
|
||||
queryResultsUserFeedbackElement.classList.add("hide");
|
||||
resultsExportElement.classList.remove("disabled");
|
||||
addToSubResultsElement.removeAttribute("disabled");
|
||||
// inital expert mode check and sub results activation
|
||||
results.jsList.activateInspect();
|
||||
if (addToSubResultsElement.checked) {
|
||||
results.jsList.activateAddToSubResults();
|
||||
}
|
||||
if (expertModeSwitchElement.checked) {
|
||||
results.jsList.expertModeOn("query-display");
|
||||
}
|
||||
}
|
||||
});
|
||||
} else if (imported) {
|
||||
results.jsList.add(resultItems, (items) => {
|
||||
for (let item of items) {
|
||||
item.elm = results.jsList.createResultRowElement(item, payload.chunk,
|
||||
true);
|
||||
}
|
||||
helperQueryRenderResults(payload);
|
||||
progress = 100;
|
||||
results.jsList.activateInspect();
|
||||
if (expertModeSwitchElement.checked) {
|
||||
results.jsList.expertModeOn("query-display");
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function helperQueryRenderResults (payload) {
|
||||
// updating table on finished item creation callback via createResultRowElement
|
||||
results.jsList.update();
|
||||
results.jsList.changeContext(); // sets lr context on first result load
|
||||
// incorporating new chunk results into full results
|
||||
results.data.matches.push(...payload.chunk.matches);
|
||||
results.data.addData(payload.chunk.cpos_lookup, "cpos_lookup");
|
||||
results.data.addData(payload.chunk.text_lookup, "text_lookup");
|
||||
// complete metaData
|
||||
// results.metaData.add();
|
||||
// show user current and total match count
|
||||
receivedMatchCountElement.innerText = `${results.data.matches.length}`;
|
||||
textLookupCountElement.innerText = `${Object.keys(results.data.text_lookup).length}`;
|
||||
let titles = new Array();
|
||||
for (let [key, value] of Object.entries(results.data.text_lookup)) {
|
||||
titles.push(`${value.title} (${value.publishing_year})`);
|
||||
};
|
||||
textTitlesElement.innerText = `${titles.join(", ")}`;
|
||||
console.log("Results recieved:", results.data);
|
||||
// upate progress status
|
||||
progress = payload.progress; // global declaration
|
||||
}
|
||||
Reference in New Issue
Block a user