From 8c707fa81cece93d72bbe950b350383974cd444a Mon Sep 17 00:00:00 2001 From: Stephan Porada Date: Mon, 5 Oct 2020 16:55:02 +0200 Subject: [PATCH] Add match_count represnetation for the user. --- .../modules/corpus_analysis/view/callbacks.js | 41 ++-- .../corpus_analysis/view/eventListeners.js | 58 ++++++ web/app/static/js/nopaque.callbacks.js | 182 ------------------ .../nopaque_cqi_py_results_schema.json | 3 + .../templates/corpora/analyse_corpus.html.j2 | 12 ++ web/app/templates/interactions/infos.html.j2 | 42 ++-- .../modals/show_corpus_files.html.j2 | 19 ++ .../templates/modals/show_metadata.html.j2 | 20 +- .../templates/query_results/inspect.html.j2 | 12 ++ 9 files changed, 161 insertions(+), 228 deletions(-) delete mode 100644 web/app/static/js/nopaque.callbacks.js create mode 100644 web/app/templates/modals/show_corpus_files.html.j2 diff --git a/web/app/static/js/modules/corpus_analysis/view/callbacks.js b/web/app/static/js/modules/corpus_analysis/view/callbacks.js index 786712e6..a29143d7 100644 --- a/web/app/static/js/modules/corpus_analysis/view/callbacks.js +++ b/web/app/static/js/modules/corpus_analysis/view/callbacks.js @@ -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'); } /** diff --git a/web/app/static/js/modules/corpus_analysis/view/eventListeners.js b/web/app/static/js/modules/corpus_analysis/view/eventListeners.js index 1685c47c..6c40cafc 100644 --- a/web/app/static/js/modules/corpus_analysis/view/eventListeners.js +++ b/web/app/static/js/modules/corpus_analysis/view/eventListeners.js @@ -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 = ` +
+ + + + + + + + + + + ` + for (let [key, value] of Object.entries(results.data.text_lookup)) { + htmlString += ` + + + + + + ` + } + htmlString += ` + +
TitleYearMatch count in this text
${value.title}${value.publishing_year}${value.match_count}
+ +
+ ` + 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, diff --git a/web/app/static/js/nopaque.callbacks.js b/web/app/static/js/nopaque.callbacks.js deleted file mode 100644 index 8b78338d..00000000 --- a/web/app/static/js/nopaque.callbacks.js +++ /dev/null @@ -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", `build`); - // 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", `build`); - // 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 -} \ No newline at end of file diff --git a/web/app/static/json_schema/nopaque_cqi_py_results_schema.json b/web/app/static/json_schema/nopaque_cqi_py_results_schema.json index 63576d9c..aa88e051 100644 --- a/web/app/static/json_schema/nopaque_cqi_py_results_schema.json +++ b/web/app/static/json_schema/nopaque_cqi_py_results_schema.json @@ -143,6 +143,9 @@ }, "title": { "type": "string" + }, + "match_count": { + "type": "integer" } }, "required": [ diff --git a/web/app/templates/corpora/analyse_corpus.html.j2 b/web/app/templates/corpora/analyse_corpus.html.j2 index 64a8acb6..1ee776d4 100644 --- a/web/app/templates/corpora/analyse_corpus.html.j2 +++ b/web/app/templates/corpora/analyse_corpus.html.j2 @@ -63,6 +63,7 @@ {% include 'modals/analysis_init.html.j2' %} {% include 'modals/export_query_results.html.j2' %} {% include 'modals/context_modal.html.j2' %} +{% include 'modals/show_corpus_files.html.j2' %}