From 202c8b4138315b61b255e15c86a126f08b256bd6 Mon Sep 17 00:00:00 2001
From: Roosted7 <thomasroos@live.nl>
Date: Sat, 10 Mar 2018 19:16:34 +0100
Subject: [PATCH] Keyboard shortcuts are awesome! Who needs a mouse?
---
client/views/Students.js | 28 +++++++++++++++++++++++++---
package.json | 1 +
2 files changed, 26 insertions(+), 3 deletions(-)
diff --git a/client/views/Students.js b/client/views/Students.js
index 3a841afed..0641c2453 100644
--- a/client/views/Students.js
+++ b/client/views/Students.js
@@ -6,6 +6,7 @@ import * as api from '../api';
import getClosest from 'get-closest';
import Fuse from 'fuse.js';
+import Mousetrap from 'mousetrap';
const StudentPanelBlock = (props) => {
@@ -130,7 +131,26 @@ class CheckStudents extends React.Component {
}
};
- componentDidMount() {
+ componentWillUnmount = () => {
+ Mousetrap.unbind(["left", "h"]);
+ Mousetrap.unbind(["right", "l"]);
+ Mousetrap.unbind(["up", "k"]);
+ Mousetrap.unbind(["down", "j"]);
+ }
+
+ componentDidMount = () => {
+
+ Mousetrap.bind(["left", "h"], this.prev);
+ Mousetrap.bind(["right", "l"], this.next);
+ Mousetrap.bind(["up", "k"], (event) => {
+ event.preventDefault();
+ this.nextUnchecked();
+ });
+ Mousetrap.bind(["down", "j"], (event) => {
+ event.preventDefault();
+ this.prevUnchecked();
+ });
+
api.get('exams')
.then(exams => {
if (exams.length) {
@@ -416,7 +436,9 @@ class CheckStudents extends React.Component {
}
})
- this.searchInput.focus();
+ if (!this.state.submission.validated) {
+ this.searchInput.focus();
+ }
}
render() {
@@ -452,7 +474,7 @@ class CheckStudents extends React.Component {
<form onSubmit={this.matchStudent}>
<p className="control has-icons-left">
<input className="input" type="text"
- autoFocus ref={(input) => { this.searchInput = input; }}
+ ref={(input) => { this.searchInput = input; }}
value={this.state.search.input} onChange={this.search} onKeyDown={this.moveSelection} />
<span className="icon is-left">
diff --git a/package.json b/package.json
index d4c4ad51a..65f1f491e 100644
--- a/package.json
+++ b/package.json
@@ -22,6 +22,7 @@
"fuse.js": "^3.2.0",
"get-closest": "^0.0.4",
"html-webpack-plugin": "^2.30.1",
+ "mousetrap": "^1.6.1",
"optimize-css-assets-webpack-plugin": "^3.2.0",
"path": "^0.12.7",
"raw-loader": "^0.5.1",
--
GitLab