From 1a78e3a5bc5edd644b99a958efc91e9cd05b1078 Mon Sep 17 00:00:00 2001
From: Richard Schneider <richard@schneiderbox.net>
Date: Wed, 8 Jan 2020 15:52:36 -0600
Subject: [PATCH] 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 85eb4084..57be42eb 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<items.length;i++){if(items[i].classList.contains("current-item")){items[i].classList.remove("current-item");if(i-1>=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<items.length;i++){if(items[i].classList.contains("current-item")){items[i].classList.remove("current-item");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();}
-break;}}}
+for(let i=0;i<items.length;i++){if(items[i].classList.contains("current-item")){items[i].classList.remove("current-item");let nextItem;if(i-1>=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<items.length;i++){if(items[i].classList.contains("current-item")){items[i].classList.remove("current-item");let nextItem;if(i+1<items.length){nextItem=items[i+1];}else{nextItem=items[0];}
+nextItem.classList.add("current-item");DomHelper.scrollPageTo(nextItem);nextItem.querySelector('.item-header a').focus();break;}}}
function decrementUnreadCounter(n){updateUnreadCounterValue((current)=>{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 968045e9..6164800d 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;
}
}
--
GitLab