Add rudimentary rework of corpus analysis

This commit is contained in:
Stephan Porada
2020-08-10 14:48:45 +02:00
parent 25ea9ba583
commit f94d21fa96
7 changed files with 163 additions and 92 deletions

View File

@ -20,7 +20,7 @@ class CorpusAnalysisClient {
}
}
loadListeners() {
loadSocketEventListeners() {
for (let [type, listener] of Object.entries(this.socketEventListeners)) {
listener(this);
}
@ -31,16 +31,6 @@ class CorpusAnalysisClient {
this.displays[type] = corpusAnalysisDisplay;
}
// /**
// * Initializes the interactive corpus analysis session via socket.io.
// * This function uses helper functions.
// */
// initSession() {
// let request = this.requestSession();
// let recvieveSession = this.recvieveSession();
// console.info('corpus_analysis_init: Client waiting for response'); // this happens inbetween the two functions above
// }
/**
* Requests a corpus analysis session via socket.io.
* Opens a loading modal at the start of the request
@ -56,17 +46,6 @@ class CorpusAnalysisClient {
this.socket.emit('corpus_analysis_init', this.corpusId);
}
// /**
// * Sends a query to the server and handles the response to that query.
// * This function uses helper functions.
// */
// query(queryStr) {
// let requestQueryData = this.requestQueryData(queryStr);
// let recieveQueryProcessStatus = this.recieveQueryProcessStatus();
// let recieveQueryData = this.recieveQueryData();
// console.info('corpus_analysis_query: Client waiting for query data'); // this happens inbetween the two functions above
// }
/**
* Sends the query string to the server.
* Should be a private method if ES2020 is finalized (Maybe?)
@ -165,5 +144,5 @@ class SocketEventListener {
}
}
// export both Classes from this module
// export Classes from this module
export {CorpusAnalysisClient, CorpusAnalysisDisplay, SocketEventListener};

View File

@ -0,0 +1,84 @@
/**
* This callback is called when the SocketEventListener 'recieveQueryData'
* has been triggered. It takes the incoming chunk and renders the results in a
* the results.jsList. It can eiterh hande llive incoming data or imported
* results data.
*/
function queryRenderResults(payload, client, imported=false) {
console.info("Current recieved chunk:", payload.chunk);
if (payload.chunk.cpos_ranges == true) {
client.results.data["cpos_ranges"] = true;
} else {
client.results.data["cpos_ranges"] = false;
}
/**
* resultItem is a list where
*/
let resultItems = [];
// get infos for full match row
for (let [index, match] of payload.chunk.matches.entries()) {
resultItems.push({...match, ...{"index": index + client.results.data.matches.length}});
}
if (!imported) {
// update progress bar
// queryResultsDeterminateElement.style.width = `${payload.progress}%`;
client.results.jsList.add(resultItems, (items) => {
for (let item of items) {
item.elm = client.results.jsList.createResultRowElement(item, payload.chunk);
}
});
helperQueryRenderResults(payload, client);
// 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
// client.results.jsList.activateInspect();
// if (addToSubResultsElement.checked) {
// client.results.jsList.activateAddToSubResults();
// }
// if (expertModeSwitchElement.checked) {
// client.results.jsList.expertModeOn("query-display");
// }
// }
} else if (imported) {
client.results.jsList.add(resultItems, (items) => {
for (let item of items) {
item.elm = client.results.jsList.createResultRowElement(item, payload.chunk,
true);
}
helperQueryRenderResults(payload, client);
progress = 100;
client.results.jsList.activateInspect();
if (expertModeSwitchElement.checked) {
client.results.jsList.expertModeOn("query-display");
}
});
}
}
function helperQueryRenderResults (payload, client) {
// updating table on finished item creation callback via createResultRowElement
client.results.jsList.update();
client.results.jsList.changeContext(); // sets lr context on first result load
// incorporating new chunk results into full results
client.results.data.matches.push(...payload.chunk.matches);
client.results.data.addData(payload.chunk.cpos_lookup, "cpos_lookup");
client.results.data.addData(payload.chunk.text_lookup, "text_lookup");
// complete metaData
// client.results.metaData.add();
// show user current and total match count
// receivedMatchCountElement.innerText = `${client.results.data.matches.length}`;
// textLookupCountElement.innerText = `${Object.keys(client.results.data.text_lookup).length}`;
let titles = new Array();
for (let [key, value] of Object.entries(client.results.data.text_lookup)) {
titles.push(`${value.title} (${value.publishing_year})`);
};
// textTitlesElement.innerText = `${titles.join(", ")}`;
// upate progress status
// progress = payload.progress; // global declaration
}
export { queryRenderResults }

View File

@ -1,3 +1,5 @@
import {queryRenderResults} from './nopaque.listenerCallbacks.js'
/**
* Recieves a corpus analysis session via socket.io.
* Closes the loading modal that has been opend with requestSession at the
@ -34,11 +36,13 @@ function recieveSession(client) {
* Recieves the query process status before any actual results are being
* transmitted. So it recieves error codes if a query failed or
* was invalid etc.
* Also prepares the result.jsList for the incoming data.
*/
function recieveQueryStatus(client) {
client.socket.on('corpus_analysis_query', (response) => {
console.group('corpus_analysis_query: Client recieving query process',
'status via socket.on');
client.results.clearAll();
console.info(response);
console.groupEnd();
});
@ -51,10 +55,13 @@ function recieveQueryData(client) {
client.socket.on('corpus_analysis_query_results', (response) => {
console.group('corpus_analysis_query_results: Client recieving query',
'data via socket.on');
console.info(response);
console.info('Recieved chunk', response);
queryRenderResults(response.payload, client);
console.info('Added chunk data to results.data and rendered it with',
'results.jsList')
console.groupEnd();
});
}
// export listeners from this module
export {recieveSession, recieveQueryStatus, recieveQueryData};
export { recieveSession, recieveQueryStatus, recieveQueryData };

View File

@ -22,7 +22,7 @@ class Results {
class Data {
// Sets empty object structure. Also usefull to delete old results.
// matchCount default is 0
init(matchCount = 0) {
init(matchCount = 0, type = "results") {
this["matches"] = []; // list of all c with lc and rc
this["cpos_lookup"] = {}; // object contains all this key value pair
this["text_lookup"] = {}; // same as above for all text ids
@ -122,4 +122,6 @@ class MetaData {
init(json = {}) {
Object.assign(this, json);
}
}
}
export {Results, Data, MetaData};

View File

@ -425,15 +425,31 @@ RessourceList.options = {
class ResultsList extends List {
constructor(idOrElement, options={}) {
super(idOrElement, options);
this.eventTokens = {}; // all span tokens which are holdeing events if expert
// mode is on. Collected here to delete later on
this.currentExpertTokenElements = {}; // all token elements which have added
// classes like chip and hoverable for expert view. Collected
//here to delete later on
this.addToSubResultsStatus = {}; // holds True/false for check buttons used to add matches tu sub-results. If checked, it is True. If unchecked, it is false. Buttons for this have the class add. Those little round check buttons.
this.addToSubResultsIdsToShow = new Set(); // If check button is pressed its corresponding data_index is saved in this set. The set is shown to the user.
static options = {
page: 10,
pagination: [{
name: "paginationTop",
paginationClass: "paginationTop",
innerWindow: 8,
outerWindow: 1
}, {
paginationClass: "paginationBottom",
innerWindow: 8,
outerWindow: 1
}],
valueNames: ["titles", "lc", "c", "rc", {data: ["index"]}],
item: `<span></span>`
};
constructor(idOrElement, options) {
super(idOrElement, options);
this.options = options;
this.eventTokens = {}; // all span tokens which are holdeing events if expert
// mode is on. Collected here to delete later on
this.currentExpertTokenElements = {}; // all token elements which have added
// classes like chip and hoverable for expert view. Collected
//here to delete later on
this.addToSubResultsStatus = {}; // holds True/false for check buttons used to add matches tu sub-results. If checked, it is True. If unchecked, it is false. Buttons for this have the class add. Those little round check buttons.
this.addToSubResultsIdsToShow = new Set(); // If check button is pressed its corresponding data_index is saved in this set. The set is shown to the user.
}
helperCreateCpos(cpos_ranges, cpos_values) {
@ -479,12 +495,11 @@ class ResultsList extends List {
}
// get display options from display options form element
static getDisplayOptions(displayOptionsFormElement) {
static getDisplayOptions(htmlId) {
// gets display options parameters
let displayOptionsFormData
let displayOptionsData;
displayOptionsFormData = new FormData(displayOptionsFormElement);
displayOptionsData =
let displayOptionsFormElement = document.getElementById(htmlId);
let displayOptionsFormData = new FormData(displayOptionsFormElement);
let displayOptionsData =
{
"resultsPerPage": displayOptionsFormData.get("display-options-form-results_per_page"),
"resultsContex": displayOptionsFormData.get("display-options-form-result_context"),
@ -1182,5 +1197,6 @@ class ResultsList extends List {
`);
}
}
};
}
export {RessourceList, ResultsList};