Mirrors/phanpy
1
0
Fork 0
mirror of https://github.com/cheeaun/phanpy.git synced 2025-01-23 17:16:26 +01:00
Code Issues Projects Releases Packages Wiki Activity

Shift+j/k shortcut to skip posts in Boosts Carousel

Browse source
This commit is contained in:
Lim Chee Aun 2023-01-16 21:26:33 +08:00
parent 58cefc2853
commit f7cbf238b1
1 changed files with 20 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

24
src/pages/home.jsx
View file

@ -139,7 +139,7 @@ function Home({ hidden }) {
const scrollableRef = useRef(); const scrollableRef = useRef();
useHotkeys('j', () => { useHotkeys('j, shift+j', (_, handler) => {
// focus on next status after active status // focus on next status after active status
// Traverses .timeline li .status-link, focus on .status-link // Traverses .timeline li .status-link, focus on .status-link
const activeStatus = document.activeElement.closest( const activeStatus = document.activeElement.closest(
@ -157,7 +157,15 @@ function Home({ hidden }) {
activeStatusRect.bottom > 0 activeStatusRect.bottom > 0
) { ) {
const activeStatusIndex = allStatusLinks.indexOf(activeStatus); const activeStatusIndex = allStatusLinks.indexOf(activeStatus);
const nextStatus = allStatusLinks[activeStatusIndex + 1]; let nextStatus = allStatusLinks[activeStatusIndex + 1];
if (handler.shift) {
// get next status that's not .status-boost-link
nextStatus = allStatusLinks.find(
(statusLink, index) =>
index > activeStatusIndex &&
!statusLink.classList.contains('status-boost-link'),
);
}
if (nextStatus) { if (nextStatus) {
nextStatus.focus(); nextStatus.focus();
nextStatus.scrollIntoViewIfNeeded?.(); nextStatus.scrollIntoViewIfNeeded?.();
@ -175,7 +183,7 @@ function Home({ hidden }) {
} }
}); });
useHotkeys('k', () => { useHotkeys('k. shift+k', () => {
// focus on previous status after active status // focus on previous status after active status
// Traverses .timeline li .status-link, focus on .status-link // Traverses .timeline li .status-link, focus on .status-link
const activeStatus = document.activeElement.closest( const activeStatus = document.activeElement.closest(
@ -193,7 +201,15 @@ function Home({ hidden }) {
activeStatusRect.bottom > 0 activeStatusRect.bottom > 0
) { ) {
const activeStatusIndex = allStatusLinks.indexOf(activeStatus); const activeStatusIndex = allStatusLinks.indexOf(activeStatus);
const prevStatus = allStatusLinks[activeStatusIndex - 1]; let prevStatus = allStatusLinks[activeStatusIndex - 1];
if (handler.shift) {
// get prev status that's not .status-boost-link
prevStatus = allStatusLinks.find(
(statusLink, index) =>
index < activeStatusIndex &&
!statusLink.classList.contains('status-boost-link'),
);
}
if (prevStatus) { if (prevStatus) {
prevStatus.focus(); prevStatus.focus();
prevStatus.scrollIntoViewIfNeeded?.(); prevStatus.scrollIntoViewIfNeeded?.();