Only scroll into view if not already visible

This commit is contained in:
Marcus Noble 2021-05-15 11:10:46 +01:00
parent da1319ca68
commit f5b386f70d

View File

@ -140,6 +140,15 @@
</div> </div>
<script> <script>
function isInViewport(element) {
const rect = element.getBoundingClientRect();
return (
rect.top >= 0 &&
rect.left >= 0 &&
rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) &&
rect.right <= (window.innerWidth || document.documentElement.clientWidth)
);
}
const vm = new Vue({ const vm = new Vue({
el: '#app', el: '#app',
data: { data: {
@ -212,7 +221,9 @@
this.selectedItem = undefined; this.selectedItem = undefined;
} else { } else {
this.selectedItem = item.ID; this.selectedItem = item.ID;
document.getElementById(this.selectedItem).scrollIntoView(); if (!isInViewport(document.getElementById(this.selectedItem))) {
document.getElementById(this.selectedItem).scrollIntoView();
}
item.PendingRead = true; item.PendingRead = true;
fetch(`/api/read/${item.ID}`, {method: "POST"}) fetch(`/api/read/${item.ID}`, {method: "POST"})
} }