From 1a78e3a5bc5edd644b99a958efc91e9cd05b1078 Mon Sep 17 00:00:00 2001 From: Richard Schneider Date: Wed, 8 Jan 2020 15:52:36 -0600 Subject: Wrap around when navigating with keyboard shortcuts on a list view --- ui/static/js.go | 14 +++++++------- ui/static/js/app.js | 25 +++++++++++++++++-------- 2 files changed, 24 insertions(+), 15 deletions(-) diff --git a/ui/static/js.go b/ui/static/js.go index 85eb408..57be42e 100644 --- a/ui/static/js.go +++ b/ui/static/js.go @@ -88,12 +88,12 @@ function goToNext(){if(isListView()){goToNextListItem();}else{goToPage("next");} function goToFeedOrFeeds(){if(isEntry()){let feedAnchor=document.querySelector("span.entry-website a");if(feedAnchor!==null){window.location.href=feedAnchor.href;}}else{goToPage('feeds');}} function goToPreviousListItem(){let items=DomHelper.getVisibleElements(".items .item");if(items.length===0){return;} if(document.querySelector(".current-item")===null){items[0].classList.add("current-item");items[0].querySelector('.item-header a').focus();return;} -for(let i=0;i=0){items[i-1].classList.add("current-item");DomHelper.scrollPageTo(items[i-1]);items[i-1].querySelector('.item-header a').focus();} -break;}}} -function goToNextListItem(){let currentItem=document.querySelector(".current-item");let items=DomHelper.getVisibleElements(".items .item");if(items.length===0){return;} -if(currentItem===null){items[0].classList.add("current-item");items[0].querySelector('.item-header a').focus();return;} -for(let i=0;i=0){nextItem=items[i-1];}else{nextItem=items[items.length-1];} +nextItem.classList.add("current-item");DomHelper.scrollPageTo(nextItem);nextItem.querySelector('.item-header a').focus();break;}}} +function goToNextListItem(){let items=DomHelper.getVisibleElements(".items .item");if(items.length===0){return;} +if(document.querySelector(".current-item")===null){items[0].classList.add("current-item");items[0].querySelector('.item-header a').focus();return;} +for(let i=0;i{return current-n;});} function incrementUnreadCounter(n){updateUnreadCounterValue((current)=>{return current+n;});} function updateUnreadCounterValue(callback){let counterElements=document.querySelectorAll("span.unread-counter");counterElements.forEach((element)=>{let oldValue=parseInt(element.textContent,10);element.innerHTML=callback(oldValue);});if(window.location.href.endsWith('/unread')){let oldValue=parseInt(document.title.split('(')[1],10);let newValue=callback(oldValue);document.title=document.title.replace(/(.*?)\(\d+\)(.*?)/,function(match,prefix,suffix,offset,string){return prefix+'('+newValue+')'+suffix;});}} @@ -109,6 +109,6 @@ if("serviceWorker"in navigator){let scriptElement=document.getElementById("servi } var JavascriptsChecksums = map[string]string{ - "app": "f33c45750b6bcc73a33fa39a6ae5d879a53e6edfc99e3eec15c258e18d1d3c35", + "app": "be87d5db4f4373b0a2db87952db4200888cff16e0a400130c931436d475a72d6", "sw": "55fffa223919cc18572788fb9c62fccf92166c0eb5d3a1d6f91c31f24d020be9", } diff --git a/ui/static/js/app.js b/ui/static/js/app.js index 968045e..6164800 100644 --- a/ui/static/js/app.js +++ b/ui/static/js/app.js @@ -404,25 +404,29 @@ function goToPreviousListItem() { if (items[i].classList.contains("current-item")) { items[i].classList.remove("current-item"); + let nextItem; if (i - 1 >= 0) { - items[i - 1].classList.add("current-item"); - DomHelper.scrollPageTo(items[i - 1]); - items[i - 1].querySelector('.item-header a').focus(); + nextItem = items[i - 1]; + } else { + nextItem = items[items.length - 1]; } + nextItem.classList.add("current-item"); + DomHelper.scrollPageTo(nextItem); + nextItem.querySelector('.item-header a').focus(); + break; } } } function goToNextListItem() { - let currentItem = document.querySelector(".current-item"); let items = DomHelper.getVisibleElements(".items .item"); if (items.length === 0) { return; } - if (currentItem === null) { + if (document.querySelector(".current-item") === null) { items[0].classList.add("current-item"); items[0].querySelector('.item-header a').focus(); return; @@ -432,12 +436,17 @@ function goToNextListItem() { if (items[i].classList.contains("current-item")) { items[i].classList.remove("current-item"); + let nextItem; if (i + 1 < items.length) { - items[i + 1].classList.add("current-item"); - DomHelper.scrollPageTo(items[i + 1]); - items[i + 1].querySelector('.item-header a').focus(); + nextItem = items[i + 1]; + } else { + nextItem = items[0]; } + nextItem.classList.add("current-item"); + DomHelper.scrollPageTo(nextItem); + nextItem.querySelector('.item-header a').focus(); + break; } } -- cgit v1.2.3