From 5c134dd8c51a77c7ff15e82c5028e2f9d64e980a Mon Sep 17 00:00:00 2001
From: stephan <sporada@uni-bielefeld.de>
Date: Thu, 12 Mar 2020 14:48:58 +0100
Subject: [PATCH] Add interaactive context change
---
app/corpora/forms.py | 11 +++-
app/corpora/views.py | 2 +-
app/templates/corpora/analyse_corpus.html.j2 | 60 ++++++++++++++------
3 files changed, 53 insertions(+), 20 deletions(-)
diff --git a/app/corpora/forms.py b/app/corpora/forms.py
index 27844d18..801f0e39 100644
--- a/app/corpora/forms.py
+++ b/app/corpora/forms.py
@@ -68,11 +68,16 @@ class QueryForm(FlaskForm):
validators=[DataRequired()])
context = SelectField('Context',
choices=[('', 'Words of context around hit'),
- ('5', '5'),
('10', '10'),
- ('15', '15'),
('20', '20'),
- ('25', '25')],
+ ('30', '30'),
+ ('40', '40'),
+ ('50', '50'),
+ ('60', '60'),
+ ('70', '70'),
+ ('80', '80'),
+ ('90', '90'),
+ ('100', '100')],
validators=[DataRequired()])
submit = SubmitField('Start Query')
diff --git a/app/corpora/views.py b/app/corpora/views.py
index 6e8a31fe..6f4e1ed2 100644
--- a/app/corpora/views.py
+++ b/app/corpora/views.py
@@ -56,7 +56,7 @@ def analyse_corpus(corpus_id):
corpus.status = 'start analysis'
db.session.commit()
query_download_form = QueryDownloadForm()
- query_form = QueryForm(context=request.args.get('context', 10),
+ query_form = QueryForm(context=request.args.get('context', 20),
hits_per_page=request.args.get('hits_per_page', 30),
query=request.args.get('query'))
return render_template('corpora/analyse_corpus.html.j2',
diff --git a/app/templates/corpora/analyse_corpus.html.j2 b/app/templates/corpora/analyse_corpus.html.j2
index 8f3a6355..04e669bb 100644
--- a/app/templates/corpora/analyse_corpus.html.j2
+++ b/app/templates/corpora/analyse_corpus.html.j2
@@ -305,13 +305,11 @@
// live update of hits per page
var hitsPerPageInputElement = document.getElementById("hits-per-page");
- hitsPerPageInputElement.addEventListener("change", changeResultList);
+ hitsPerPageInputElement.onchange = changeHitsPerPage;
- function changeResultList(event) {
- let queryFormElement = document.getElementById("query-form");
- queryData = getQueryData(queryFormElement);
+ function changeHitsPerPage(event) {
try {
- resultList.page = queryData["hits_per_page"];
+ resultList.page = event.target.value;
resultList.update();
nopaque.toast("Updated matches per page.")
} catch (e) {
@@ -319,19 +317,47 @@
}
}
- // live update of lr context per item
+ // live update of lr context per item if context value is changed
var contextPerItemElement = document.getElementById("context-per-item");
- contextPerItemElement.addEventListener("change", changeContext);
+ contextPerItemElement.onchange = changeContext;
+
+ // eventListener if pagination is used to apply new context size to new page
+ var paginationElements = document.getElementsByClassName("pagination");
+ for (element of paginationElements) {
+ element.addEventListener("click", changeContext);
+ }
+ // event triggered on context select change and also if pagination is clicked
function changeContext(event) {
- let queryFormElement = document.getElementById("query-form");
- queryData = getQueryData(queryFormElement);
- console.log(queryData);
- try {
- nopaque.toast("Loading more context.");
- sendQuery(event);
- } catch (e) {
- console.log("No query given.");
+ // newValue = event.target.value; // cannot use this anymore due to reuse of this function in the above paginationElements eventListener
+ var contextPerItemElement = document.getElementById("context");
+ newValue = contextPerItemElement.value;
+ console.log(newValue);
+ var lc = document.getElementsByClassName("left-context");
+ var rc = document.getElementsByClassName("right-context");
+ // console.log("LC", lc);
+ // console.log("RC", rc);
+ for (let element of lc) {
+ // console.log(element.childNodes);
+ array = Array.from(element.childNodes);
+ // console.log(array);
+ for (let element of array.slice(newValue)) {
+ element.classList.add("hide");
+ }
+ for (let element of array.slice(0, newValue)) {
+ element.classList.remove("hide");
+ }
+ }
+ for (let element of rc) {
+ // console.log(element.childNodes);
+ array = Array.from(element.childNodes);
+ // console.log(array);
+ for (let element of array.slice(newValue)) {
+ element.classList.add("hide");
+ }
+ for (let element of array.slice(0, newValue)) {
+ element.classList.remove("hide");
+ }
}
}
@@ -392,8 +418,10 @@
}
resultList.add(resultItems, items => {
for (let item of items) {
- item.elm = resultList.createResultRowElement(item, chunk);}
+ item.elm = resultList.createResultRowElement(item, chunk);
+ }
resultList.update();
+ changeContext(); // sets lr context to current/default value
});
result["loaded_match_count"] += Object.keys(chunk["matches"]).length;
console.log("After current match count", result["loaded_match_count"]);
--
GitLab