Pārlūkot izejas kodu

Added keyboard controls to the News UI.

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 (https://github.com/aaronholtomcook/ElectronLauncher/commit/26659f8c383d85e3857ee3cf5be64bcd84fb76cb)
Daniel Scalzi 7 gadi atpakaļ
vecāks
revīzija
85331a7088
1 mainītis faili ar 25 papildinājumiem un 1 dzēšanām
  1. 25 1
      app/assets/js/scripts/landing.js

+ 25 - 1
app/assets/js/scripts/landing.js

@@ -969,7 +969,7 @@ function initNews(){
             
                     displayArticle(newsArr[nxtArt], nxtArt+1)
                 }
-            
+
                 document.getElementById('newsNavigateRight').onclick = () => { switchHandler(true) }
                 document.getElementById('newsNavigateLeft').onclick = () => { switchHandler(false) }
 
@@ -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.
  *