sporada/nopaque
1
0
Fork 0
mirror of https://gitlab.ub.uni-bielefeld.de/sfb1288inf/nopaque.git synced 2025-06-27 00:10:35 +00:00
Code Issues Projects Releases Wiki Activity

Some fixes and enhancements befor javascript rework

Browse Source
This commit is contained in:
Stephan Porada
2020-08-06 10:42:35 +02:00
parent a390fbb0ce
commit 301b090fc0
5 changed files with 82 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
web/app/templates/corpora/analyse_corpus.html.j2
View File

@ -55,6 +55,8 @@
</div>
</div>
<!-- Scroll to top element -->
{% include 'interactions/scroll_to_top.html.j2' %}
<!-- Modals -->
{% include 'modals/show_metadata.html.j2' %}
@ -337,6 +339,20 @@
});
// new insepct event listener makeing use of javascript bubbleing
let resultsTable = document.getElementById("query-results");
console.log(resultsTable);
resultsTable.addEventListener("click", (event) => {
let dataIndex;
if (event.target.classList.contains("inspect-btn")) {
dataIndex = parseInt(event.target.closest("tr").dataset.index);
console.log(dataIndex);
results.jsList.inspect([dataIndex], "inspect");
} else if (event.target.classList.contains("add-btn")) {
dataIndex = parseInt(event.target.closest("tr").dataset.index);
results.jsList.addToSubResults(dataIndex);
}
})
// ### Download events and sub-results creation ###
var loadingSpinnerHTML = `
@ -405,5 +421,20 @@
results.jsList.contextData,
downloadInspectContextElement);
};
// scroll to top button if user scrolled down the list
let headline = document.querySelector(".headline");
let scrollToTop = document.querySelector("#menu-scroll-to-top-div");
window.addEventListener("scroll", (event) => {
if (pageYOffset > 250) {
scrollToTop.classList.toggle("hide", false);
} else {
scrollToTop.classList.toggle("hide", true);
}
});
scrollToTop.onclick = () => {
headline.scrollIntoView({behavior: "smooth", block: "end", inline: "nearest"});
};
</script>
{% endblock %}

6
web/app/templates/interactions/scroll_to_top.html.j2 Normal file
View File

@ -0,0 +1,6 @@
<!-- Scroll to top element -->
<div id="menu-scroll-to-top-div" class="fixed-action-btn direction-top active hide" style="bottom: 45px; right: 24px;">
<a id="menu-scroll-to-top" class="btn btn-floating btn-large cyan">
<i class="material-icons">arrow_upward</i>
</a>
</div>

2
web/app/templates/nopaque.html.j2
View File

@ -181,7 +181,7 @@
<div class="container">
{% endif %}
<div class="row">
<div class="col s12">
<div class="col s12 headline">
<h2>
{% if headline %}
{{ headline }}

29
web/app/templates/query_results/inspect.html.j2
View File

@ -45,6 +45,9 @@
</div>
</div>
<!-- Scroll to top element -->
{% include 'interactions/scroll_to_top.html.j2' %}
<!-- Modals -->
{% include 'modals/show_metadata.html.j2' %}
{% include 'modals/show_text_details.html.j2' %}
@ -192,8 +195,6 @@
// ### Show corpus Metadata
showMetaDataButton.onclick = () => {
console.log(results.metaData);
console.log(results.data.text_lookup);
metaDataModal.open();
};
@ -203,6 +204,30 @@
// live update of lr context per item if context value is changed
contextPerItemElement.onchange = results.jsList.changeContext;
// new insepct event listener makeing use of javascript bubbleing
let resultsTable = document.getElementById("query-results");
resultsTable.addEventListener("click", (event) => {
if (event.target.classList.contains("inspect-btn")) {
const dataIndex = event.target.closest("tr").dataset.index;
const fakeResponse = results.jsList.createFakeResponse();
results.jsList.showMatchContext(fakeResponse);
}
});
// scroll to top button if user scrolled down the list
let headline = document.querySelector(".headline");
let scrollToTop = document.querySelector("#menu-scroll-to-top-div");
window.addEventListener("scroll", (event) => {
if (pageYOffset > 250) {
scrollToTop.classList.toggle("hide", false);
} else {
scrollToTop.classList.toggle("hide", true);
}
});
scrollToTop.onclick = () => {
headline.scrollIntoView({behavior: "smooth", block: "end", inline: "nearest"});
};
});
</script>
{% endblock %}