aboutsummaryrefslogtreecommitdiffhomepage
path: root/app.js
diff options
context:
space:
mode:
authorJozef Selesi <jozef.selesi@sky.uk>2020-03-19 19:36:24 +0000
committerJozef Selesi <jozef.selesi@sky.uk>2020-03-21 11:47:12 +0000
commit6eba37a370cdd3c0275d49fa693ab189d8ab8ff2 (patch)
tree54045348cda5482daaaeb1a427f26706f30f6814 /app.js
parent2cf93f388130134d8ff9cf1af7535e21cafc207f (diff)
downloadhomer-6eba37a370cdd3c0275d49fa693ab189d8ab8ff2.tar.gz
homer-6eba37a370cdd3c0275d49fa693ab189d8ab8ff2.tar.zst
homer-6eba37a370cdd3c0275d49fa693ab189d8ab8ff2.zip
Add keyboard shortcuts for searching.
/ starts searching. Escape clears the search terms.
Diffstat (limited to 'app.js')
-rw-r--r--app.js29
1 files changed, 29 insertions, 0 deletions
diff --git a/app.js b/app.js
index 6c83074..36508ab 100644
--- a/app.js
+++ b/app.js
@@ -85,6 +85,35 @@ const app = new Vue({
85 toggleMenu: function() { 85 toggleMenu: function() {
86 this.showMenu = !this.showMenu; 86 this.showMenu = !this.showMenu;
87 } 87 }
88 },
89 mounted() {
90 function isSmallScreen() {
91 return window.matchMedia('screen and (max-width: 1023px)').matches;
92 }
93 this._keyListener = function(e) {
94 if (e.key === '/') {
95 if (isSmallScreen()) {
96 this.showMenu = true;
97 }
98 Vue.nextTick(() => {
99 this.$refs.search.focus();
100 });
101
102 e.preventDefault();
103 }
104 if (e.key === 'Escape') {
105 this.filter = '';
106 this.$refs.search.blur();
107 if (isSmallScreen()) {
108 this.showMenu = false;
109 }
110 }
111 }
112
113 document.addEventListener('keydown', this._keyListener.bind(this));
114 },
115 beforeDestroy() {
116 document.removeEventListener('keydown', this._keyListener);
88 } 117 }
89}); 118});
90 119