Skip to content

Commit

Permalink
Added keyboard controls to the News UI.
Browse files Browse the repository at this point in the history
On the landing view, the up arrow will open the News UI.
On the News UI, the left and right arrow keys will switch articles.

Thanks to aaronholtomcook/ElectronLauncher (aaronholtomcook@26659f8)
  • Loading branch information
dscalzi committed Jun 30, 2018
1 parent 52d9027 commit 85331a7
Showing 1 changed file with 25 additions and 1 deletion.
26 changes: 25 additions & 1 deletion app/assets/js/scripts/landing.js
Original file line number Diff line number Diff line change
Expand Up @@ -969,7 +969,7 @@ function initNews(){

displayArticle(newsArr[nxtArt], nxtArt+1)
}

document.getElementById('newsNavigateRight').onclick = () => { switchHandler(true) }
document.getElementById('newsNavigateLeft').onclick = () => { switchHandler(false) }

Expand All @@ -986,6 +986,30 @@ function initNews(){
})
}

/**
* Add keyboard controls to the news UI. Left and right arrows toggle
* between articles. If you are on the landing page, the up arrow will
* open the news UI.
*/
document.addEventListener('keydown', (e) => {
if(newsActive){
if(e.key === 'ArrowRight' || e.key === 'ArrowLeft'){
document.getElementById(e.key === 'ArrowRight' ? 'newsNavigateRight' : 'newsNavigateLeft').click()
}
// Interferes with scrolling an article using the down arrow.
// Not sure of a straight forward solution at this point.
// if(e.key === 'ArrowDown'){
// document.getElementById('newsButton').click()
// }
} else {
if(getCurrentView() === VIEWS.landing){
if(e.key === 'ArrowUp'){
document.getElementById('newsButton').click()
}
}
}
})

/**
* Display a news article on the UI.
*
Expand Down

0 comments on commit 85331a7

Please sign in to comment.