[keyboard.js] Moved all keybindings to a separate javascript file and implemented vim-like navigation for headings

3 files changed, 65 insertions, 49 deletions

diff --git a/src/scripts/keyboard.js b/src/scripts/keyboard.js
new file mode 100644
index 0000000..f618e45
--- /dev/null
+++ b/src/scripts/keyboard.js
@@ -0,0 +1,65 @@
+const headings = document.querySelectorAll('h1, h2, h3, h4, h5, h6');
+var currentHeading = 0;
+
+document.addEventListener('keydown', function (e) {
+	if (e.ctrlKey) return;
+
+	switch (e.code) {
+		case 'KeyG':
+			currentHeading = (e.shiftKey) ? headings.length - 1 : 0;
+			headings[currentHeading].scrollIntoView();
+			break;
+
+		case 'KeyJ': case 'KeyL':
+			if (typeof presenting != 'undefined' && presenting) showSlide(+1);
+			else {
+				currentHeading = (headings.length + currentHeading + 1) % headings.length;
+				headings[currentHeading].scrollIntoView();
+			}
+			break;
+
+		case 'KeyK': case 'KeyH':
+			if (typeof presenting != 'undefined' && presenting) showSlide(-1);
+			else {
+				currentHeading = (headings.length + currentHeading - 1) % headings.length;
+				headings[currentHeading].scrollIntoView();
+			}
+			break;
+
+		/* theme-changer.js */
+
+		case 'KeyC':
+			themeBtn.click();
+			break;
+
+		/* presentation.js */
+
+		// Previous slide
+		case 'Backspace': case 'PageUp':
+		case 'ArrowLeft': case 'ArrowUp':
+			showSlide(-1);
+			break;
+		// Next slide
+		case 'Space': case 'Enter': case 'PageDown':
+		
+		case 'ArrowRight': case 'ArrowDown':
+			showSlide(+1);
+			break;
+		// Start (toggle) presenting
+		case 'KeyP': case 'KeyT':
+			presentBtn.click();
+			break;
+		// Exit presentation
+		case 'Escape':
+			if (presenting) presentBtn.click();
+			break;
+		// Go to first slide
+		case 'Home':
+			showSlide(-slideIndex);
+			break;
+		// Go to last slide
+		case 'End':
+			showSlide(-slideIndex -1);
+			break;
+	}
+});
diff --git a/src/scripts/presentation.js b/src/scripts/presentation.js
index 70339e6..425815c 100644
--- a/src/scripts/presentation.js
+++ b/src/scripts/presentation.js
@@ -102,40 +102,3 @@ articleBtn.addEventListener('click', function() {
 	// Toggle presentation.css
 	document.styleSheets.item(3).disabled = !document.styleSheets.item(3).disabled;
 });
-
-/* Keyboard controls */
-
-document.addEventListener('keydown', function (e) {
-	if (e.ctrlKey) return;
-
-	switch (e.code) {
-		// Previous slide
-		case 'Backspace': case 'PageUp':
-		case 'KeyK': case 'KeyH':
-		case 'ArrowLeft': case 'ArrowUp':
-			showSlide(-1);
-			break;
-		// Next slide
-		case 'Space': case 'Enter': case 'PageDown':
-		case 'KeyJ': case 'KeyL':
-		case 'ArrowRight': case 'ArrowDown':
-			showSlide(+1);
-			break;
-		// Start (toggle) presenting
-		case 'KeyP': case 'KeyT':
-			presentBtn.click();
-			break;
-		// Exit presentation
-		case 'Escape':
-			if (presenting) presentBtn.click();
-			break;
-		// Go to first slide
-		case 'Home':
-			showSlide(-slideIndex);
-			break;
-		// Go to last slide
-		case 'End':
-			showSlide(-slideIndex -1);
-			break;
-	}
-});
diff --git a/src/scripts/theme-changer.js b/src/scripts/theme-changer.js
index 47c5dfe..39eedc9 100644
--- a/src/scripts/theme-changer.js
+++ b/src/scripts/theme-changer.js
@@ -17,15 +17,3 @@ themeBtn.onclick = function() {
 		localStorage.setItem('theme', 'dark');
 	}
 }
-
-/* Keyboard controls */
-
-document.addEventListener('keydown', function (e) {
-	if (e.ctrlKey) return;
-
-	switch (e.code) {
-		case 'KeyC':
-			themeBtn.click();
-			break;
-	}
-});