From 21371efde65a131871a75a643a195b3d58fc0cb4 Mon Sep 17 00:00:00 2001 From: Stephan Porada Date: Mon, 3 Feb 2020 12:58:40 +0100 Subject: [PATCH] Continue new list building for results --- app/corpora/CQiWrapper/CQiWrapper.py | 5 +- app/static/css/nopaque.css | 6 ++ app/static/js/nopaque.lists.js | 95 +++++++++----------- app/templates/corpora/analyse_corpus.html.j2 | 25 +++--- 4 files changed, 65 insertions(+), 66 deletions(-) diff --git a/app/corpora/CQiWrapper/CQiWrapper.py b/app/corpora/CQiWrapper/CQiWrapper.py index d96c5ed9..0a5770b9 100644 --- a/app/corpora/CQiWrapper/CQiWrapper.py +++ b/app/corpora/CQiWrapper/CQiWrapper.py @@ -287,12 +287,14 @@ class CQiWrapper(CQiClient): first_cpos, last_cpos = match_cpos_list[0], match_cpos_list[-1] context_sentences = {} s_ids = self.cl_cpos2struc(key, [first_cpos, last_cpos]) + logger.warning('s id match: {}'.format(s_ids)) for s_id in s_ids: s_start, s_end = self.cl_struc2cpos(key, s_id) s_cpos = list(range(s_start, s_end + 1)) context_sentences[s_id] = s_cpos if get_surrounding_s: - max_s_id = self.cl_attribute_size(key) + max_s_id = self.cl_attribute_size(key) - 1 + logger.warning('max sid: {}'.format(max_s_id)) additional_s_ids = [] additional_s = list(range(max(s_ids[0] - l_r_s_context_additional_len, @@ -302,6 +304,7 @@ class CQiWrapper(CQiClient): max_s_id) + 1)) additional_s_ids.extend(additional_s) for s_id in additional_s_ids: + logger.warning('s id additional: {}'.format(s_id)) s_start, s_end = self.cl_struc2cpos(key, s_id) s_cpos = list(range(s_start, s_end + 1)) context_sentences[s_id] = s_cpos diff --git a/app/static/css/nopaque.css b/app/static/css/nopaque.css index 9094c451..a86502e0 100644 --- a/app/static/css/nopaque.css +++ b/app/static/css/nopaque.css @@ -38,6 +38,11 @@ main { } /* ### End sidenav-fixed offset ### */ +/* add custom bold class */ +.bold { + font-weight: bold; +} + /* CSS for clickable th elements in tables. Needed for sortable table data with list js. On click on th header elements will be sorted accordingly. Also a caret indicator will show up how the column is sorted right now.; */ @@ -87,6 +92,7 @@ indicator will show up how the column is sorted right now.; */ z-index: 999; /* tmp fix */ } +/* styles for resource lists */ .service[data-service]:before { content: "help"; } diff --git a/app/static/js/nopaque.lists.js b/app/static/js/nopaque.lists.js index da255d30..86ead2ed 100644 --- a/app/static/js/nopaque.lists.js +++ b/app/static/js/nopaque.lists.js @@ -93,66 +93,55 @@ RessourceList.options = { class ResultList extends List { createResultRowElement(item, chunk) { - let values, cpos, matchRowElement, lcCellElement, lcTokenElement, token; + let values, cpos, token, matchRowElement, lcCellElement, hitCellElement, rcCellElement, textTitlesCellElement; // gather values from item values = item.values(); console.log("CHONK"); console.log(chunk); + // get infos for full match row matchRowElement = document.createElement("tr"); - for (cpos of values["lc"]) { - console.log(cpos); - lcCellElement = document.createElement("td"); - lcTokenElement = document.createElement("span"); - lcTokenElement.classList.add("token"); - lcTokenElement.dataset.cpos = cpos; - token = chunk["cpos_lookup"][cpos]; - lcTokenElement.innerText = token["word"]; - lcCellElement.appendChild(lcTokenElement); - // let hit_tokens = ""; - } + matchRowElement.setAttribute("data-index", values["index"]) + lcCellElement = document.createElement("td"); + lcCellElement.classList.add("left-context"); matchRowElement.appendChild(lcCellElement); - // // get infos of match - // let textTitles = new Set(); - // for (cpos of match["hit"]) { - // tokenElement = document.createElement("span"); - // tokenElement.classList.add("token"); - // tokenElement.dataset.cpos = cpos; - // token = chunk["cpos_lookup"][cpos]; - // tokenElement.innerText = token["word"]; - // hit_tokens += " " + tokenElement.outerHTML; - // // get text titles of every hit cpos token - // textTitles.add(chunk["text_lookup"][token["text"]]["title"]); - // } - // // add button to trigger more context to every match td - // var inspectBtn = document.createElement("a"); - // inspectBtn.setAttribute("class", "btn-floating btn-flat waves-effect waves-light grey right inspect"); - // inspectBtn.onclick = function() {inspect()}; - // inspectBtn.innerHTML = 'search'; - // hit_tokens += "

" + inspectBtn.outerHTML + "

"; - // // get infos for right context of match - // let rc_tokens = ""; - // for (cpos of match["rc"]) { - // tokenElement = document.createElement("span"); - // tokenElement.classList.add("token"); - // tokenElement.dataset.cpos = cpos; - // token = chunk["cpos_lookup"][cpos]; - // tokenElement.innerText = token["word"]; - // rc_tokens += " " + tokenElement.outerHTML; - // } - // // put all infos into an javascribt object - // textTitleElement = document.createElement("span"); - // textTitleElement.classList.add("text-titles"); - // textTitles = [...textTitles].join(","); - // textTitleElement.innerText = textTitles; - // - // matchRowElement.appendChild(textTitleElement); - // // matchRowElement.appendChild(lc_tokens); - // // matchRowElement.appendChild(hit_tokens); - // // matchRowElement.appendChild(rc_tokens); - // // matchRowElement.appendChild(index); - // } - console.log(matchRowElement.outerHTML); + for (cpos of values["lc"]) { + token = chunk["cpos_lookup"][cpos]; + lcCellElement.insertAdjacentHTML("beforeend", `${token["word"]} `); + } + + // get infos for hit of match + let textTitles = new Set(); + hitCellElement = document.createElement("td"); + hitCellElement.classList.add("match-hit"); + textTitlesCellElement = document.createElement("td"); + textTitlesCellElement.classList.add("titles"); + matchRowElement.appendChild(hitCellElement); + for (cpos of values["hit"]) { + token = chunk["cpos_lookup"][cpos]; + hitCellElement.insertAdjacentHTML("beforeend", `${token["word"]} `); + // get text titles of every hit cpos token + textTitles.add(chunk["text_lookup"][token["text"]]["title"]); + // add button to trigger more context to every match td + var inspectBtn = document.createElement("a"); + inspectBtn.setAttribute("class", "btn-floating btn-flat waves-effect waves-light grey right inspect"); + inspectBtn.innerHTML = 'search'; + inspectBtn.onclick = function () {inspect(values["index"])}; + } + // add text titles at front as first td of one row + hitCellElement.appendChild(inspectBtn); + textTitlesCellElement.innerText = [...textTitles].join(", "); + matchRowElement.insertAdjacentHTML("afterbegin", textTitlesCellElement.outerHTML); + + // get infos for right context of match + rcCellElement = document.createElement("td"); + rcCellElement.classList.add("right-context"); + matchRowElement.appendChild(rcCellElement); + for (cpos of values["rc"]) { + token = chunk["cpos_lookup"][cpos]; + rcCellElement.insertAdjacentHTML("beforeend", `${token["word"]} `); + } + console.log(matchRowElement); return matchRowElement } } diff --git a/app/templates/corpora/analyse_corpus.html.j2 b/app/templates/corpora/analyse_corpus.html.j2 index 382418ab..2f0d4594 100644 --- a/app/templates/corpora/analyse_corpus.html.j2 +++ b/app/templates/corpora/analyse_corpus.html.j2 @@ -378,13 +378,16 @@ resultList.add(resultItems, items => { for (let item of items) { item.elm = resultList.createResultRowElement(item, chunk);} + resultList.update(); }); - resultList.update(); }); // inspect match functions - function inspect() { - console.log("Inspect!") + function inspect(dataIndex) { + console.log("Inspect!"); + console.log(result["matches"][dataIndex]["hit"]); + contextModal.open(); + nopaque.socket.emit("inspect_match", {"cpos": result["matches"][dataIndex]["hit"]}); } // Function to download data to a file @@ -442,7 +445,7 @@ "transitionMovement": 0}); } - + // get context of one match if inspected nopaque.socket.on("match_context", function(message) { console.log("### match_context ###"); console.log(message); @@ -450,9 +453,7 @@ document.getElementById("context-modal-loading").classList.add("hide"); document.getElementById("context-modal-ready").classList.remove("hide"); - var sentenceElement; - var token; - var tokenElement; + let sentenceElement, token, tokenElement; lookup["cpos"] = {...lookup["cpos"], ...message["cpos_lookup"]}; lookup["s"] = message["context_s_cpos"]; @@ -469,11 +470,11 @@ } tokenElement.dataset.cpos = cpos; tokenElement.innerText = token["word"]; - if (expertModeSwitchElement.checked) { - tokenElement.classList.add("chip"); - addToolTipToTokenElement(tokenElement, token); - } - tokenElements.add(tokenElement); + // if (expertModeSwitchElement.checked) { + // tokenElement.classList.add("chip"); + // addToolTipToTokenElement(tokenElement, token); + // } + // tokenElements.add(tokenElement); sentenceElement.append(tokenElement); sentenceElement.append(document.createTextNode(" ")); }