mirror of
https://gitlab.ub.uni-bielefeld.de/sfb1288inf/nopaque.git
synced 2025-06-12 17:10:41 +00:00
More Analysis Javascript updates for unified interaction handeling
This commit is contained in:
@ -86,9 +86,19 @@ class CorpusAnalysisClient {
|
||||
}
|
||||
});
|
||||
|
||||
// inspect callback handeling based on type
|
||||
socket.on("corpus_analysis_inspect_match", (response) => {
|
||||
if (this.callbacks.query_match_context != undefined) {
|
||||
this.callbacks.query_match_context(response);
|
||||
if (response.type === "inspect") {
|
||||
if (this.callbacks.query_match_context != undefined) {
|
||||
this.callbacks.query_match_context(response);
|
||||
}
|
||||
} else if (response.type === "sub-subcorpus"){
|
||||
if (this.callbacks.show_sub_subcorpus_choices != undefined) {
|
||||
this.callbacks.show_sub_subcorpus_choices(response);
|
||||
}
|
||||
if (this.callbacks.save_sub_subcorpus_choices != undefined) {
|
||||
this.callbacks.save_sub_subcorpus_choices(response);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
@ -104,7 +114,7 @@ class CorpusAnalysisClient {
|
||||
}
|
||||
|
||||
getMetaData() {
|
||||
// just emits thos to tell the server to gather all meta dat infos and send
|
||||
// just emits thos to tell the server to gather all meta data infos and send
|
||||
// those back
|
||||
this.socket.emit("corpus_analysis_get_meta_data", this.corpusId);
|
||||
}
|
||||
|
@ -1,10 +1,12 @@
|
||||
class InteractionElement {
|
||||
constructor(htmlId="",
|
||||
checkStatus=true,
|
||||
disabledBefore=true,
|
||||
disabledAfter=false,
|
||||
hideBefore=true,
|
||||
hideAfter=false) {
|
||||
this.htmlId = htmlId;
|
||||
this.checkStatus = checkStatus;
|
||||
this.callbacks = {};
|
||||
this.disabledBefore = disabledBefore;
|
||||
this.disabledAfter = disabledAfter;
|
||||
@ -14,7 +16,7 @@ class InteractionElement {
|
||||
|
||||
getElement() {
|
||||
this.interactionStatusElement = document.getElementById(this.htmlId);
|
||||
return this.interactionStatusElement
|
||||
return this.interactionStatusElement;
|
||||
}
|
||||
|
||||
setCallback(trigger, callback, bindThis, args=[]) {
|
||||
|
@ -3,6 +3,11 @@ function recvMetaData(payload) {
|
||||
console.log(results.metaData);
|
||||
}
|
||||
|
||||
function saveSubSubcorpusChoices(payload) {
|
||||
console.log("SAVE");
|
||||
console.log(payload);
|
||||
}
|
||||
|
||||
function querySetup(payload) {
|
||||
// This is called when a query was successfull
|
||||
// some hiding and resetting
|
||||
|
@ -141,17 +141,24 @@ class ResultsList extends List {
|
||||
pageChangeEventInteractionHandler(interactionElements) {
|
||||
// get elements to check thier status
|
||||
for (let interaction of interactionElements) {
|
||||
let element = interaction.getElement();
|
||||
if (element.checked) {
|
||||
let f_on = interaction.bindThisToCallback("on");
|
||||
let args_on = interaction.callbacks.on.args;
|
||||
f_on(...args_on);
|
||||
console.log("ON TRIGGERED");
|
||||
if (interaction.checkStatus) {
|
||||
let element = interaction.getElement();
|
||||
if (element.checked) {
|
||||
let f_on = interaction.bindThisToCallback("on");
|
||||
let args_on = interaction.callbacks.on.args;
|
||||
f_on(...args_on);
|
||||
console.log("ON TRIGGERED");
|
||||
} else {
|
||||
let f_off = interaction.bindThisToCallback("off");
|
||||
let args_off = interaction.callbacks.off.args;
|
||||
f_off(...args_off);
|
||||
console.log("OFF TRIGGERED");
|
||||
}
|
||||
} else {
|
||||
let f_off = interaction.bindThisToCallback("off");
|
||||
let args_off = interaction.callbacks.off.args;
|
||||
f_off(...args_off);
|
||||
console.log("OFF TRIGGERED");
|
||||
let f = interaction.bindThisToCallback("noCheck");
|
||||
let args = interaction.callbacks.noCheck.args;
|
||||
f(...args);
|
||||
console.log("noCheck activated");
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -174,11 +181,9 @@ class ResultsList extends List {
|
||||
// ###### Functions to add one match to a sub-subcorpus ######
|
||||
// activate add button
|
||||
activateAddToSubSubcorpus() {
|
||||
if (progress === 100) {
|
||||
let addToSubSubcorpusBtnElements = document.getElementsByClassName("add");
|
||||
for (let addToSubSubcorpusBtn of addToSubSubcorpusBtnElements) {
|
||||
addToSubSubcorpusBtn.classList.remove("hide");
|
||||
}
|
||||
let addToSubSubcorpusBtnElements = document.getElementsByClassName("add");
|
||||
for (let addToSubSubcorpusBtn of addToSubSubcorpusBtnElements) {
|
||||
addToSubSubcorpusBtn.classList.remove("hide");
|
||||
}
|
||||
}
|
||||
// deactivate add button
|
||||
@ -192,12 +197,16 @@ class ResultsList extends List {
|
||||
addToSubSubcorpus(dataIndex) {
|
||||
if (!this.addToSubSubcorpuStatus[dataIndex]
|
||||
|| this.addToSubSubcorpuStatus === undefined) {
|
||||
// add button is activated
|
||||
nopaque.flash(`[Match ${dataIndex + 1}] Marked for Sub-Subcorpus!`);
|
||||
event.target.classList.remove("grey");
|
||||
event.target.classList.add("green");
|
||||
event.target.innerText = "check";
|
||||
this.addToSubSubcorpuStatus[dataIndex] = true;
|
||||
console.log(dataIndex);
|
||||
this.getMatchWithContext(dataIndex, "sub-subcorpus");
|
||||
} else if (this.addToSubSubcorpuStatus[dataIndex]) {
|
||||
// add button is deactivated
|
||||
nopaque.flash(`[Match ${dataIndex + 1}] Unmarked for Sub-Subcorpus!`);
|
||||
event.target.classList.remove("green");
|
||||
event.target.classList.add("grey");
|
||||
event.target.innerText = "add";
|
||||
@ -205,11 +214,33 @@ class ResultsList extends List {
|
||||
}
|
||||
}
|
||||
|
||||
// handels incoming match info from socket on event
|
||||
showSubSubcorpusChoices(response) {
|
||||
console.log("SHOW");
|
||||
console.log(response.data_index);
|
||||
}
|
||||
|
||||
// gets full info for one match
|
||||
getMatchWithContext(dataIndex, type) {
|
||||
this.contextId = dataIndex;
|
||||
let contextResultsElement;
|
||||
contextResultsElement = document.getElementById("context-results");
|
||||
contextResultsElement.innerHTML = ""; // clear it from old inspects
|
||||
nopaque.socket.emit("corpus_analysis_inspect_match",
|
||||
{
|
||||
type: type,
|
||||
data_index: dataIndex,
|
||||
first_cpos: results.data.matches[dataIndex].c[0],
|
||||
last_cpos: results.data.matches[dataIndex].c[1],
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
// ###### Functions to inspect one match, to show more details ######
|
||||
// activate inspect buttons if progress is 100
|
||||
activateInspect() {
|
||||
let inspectBtnElements;
|
||||
if (progress === 100) {
|
||||
let inspectBtnElements;
|
||||
inspectBtnElements = document.getElementsByClassName("inspect");
|
||||
for (let inspectBtn of inspectBtnElements) {
|
||||
inspectBtn.classList.remove("disabled");
|
||||
@ -221,17 +252,8 @@ class ResultsList extends List {
|
||||
|
||||
//gets result cpos infos for one dataIndex to send back to the server
|
||||
inspect(dataIndex, type) {
|
||||
this.contextId = dataIndex;
|
||||
let contextResultsElement;
|
||||
contextResultsElement = document.getElementById("context-results");
|
||||
contextResultsElement.innerHTML = ""; // clear it from old inspects
|
||||
this.getMatchWithContext(dataIndex, type);
|
||||
contextModal.open();
|
||||
nopaque.socket.emit("corpus_analysis_inspect_match",
|
||||
{"type": type,
|
||||
first_cpos: results.data.matches[dataIndex].c[0],
|
||||
last_cpos: results.data.matches[dataIndex].c[1],
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
// create Element from HTML String helper function
|
||||
@ -633,7 +655,7 @@ class ResultsList extends List {
|
||||
// add some interaction buttons
|
||||
// # some btn css rules and classes
|
||||
let css = `margin-right: 10px;`
|
||||
let classes = `btn-floating btn-flat waves-effect` +
|
||||
let classes = `btn-floating btn waves-effect` +
|
||||
`waves-light grey right`
|
||||
// # add button to trigger more context to every match td
|
||||
inspectBtn = document.createElement("a");
|
||||
|
Reference in New Issue
Block a user