Replace mousetrap with @github/hotkey

This commit is contained in:
Dave Gallant
2023-03-31 20:40:47 -04:00
parent 0f6825c9d2
commit 4d9b5d2158
5 changed files with 33 additions and 30 deletions

22
package-lock.json generated
View File

@@ -8,6 +8,7 @@
"name": "rfd-fyi",
"version": "0.1.0",
"dependencies": {
"@github/hotkey": "^2.0.1",
"@popperjs/core": "^2.11.5",
"axios": "^0.27.2",
"bootstrap": "^5.2.0",
@@ -15,7 +16,6 @@
"core-js": "^3.8.3",
"jquery": "^3.6.0",
"moment": "^2.29.4",
"mousetrap": "^1.6.5",
"vue": "^3.2.37",
"vue-github-button": "^3.0.3",
"vue-gtag": "^2.0.1",
@@ -1934,6 +1934,11 @@
"url": "https://github.com/sponsors/sindresorhus"
}
},
"node_modules/@github/hotkey": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/@github/hotkey/-/hotkey-2.0.1.tgz",
"integrity": "sha512-qKXjAJjtheJbf4ie3hi8IwrHWJZHB5qdojR6JGo6jvQNPpsdUbk/NIdU8sxu4PW41CjW80vfciDMu3MAP3j2Fg=="
},
"node_modules/@hapi/hoek": {
"version": "9.3.0",
"resolved": "https://registry.npmjs.org/@hapi/hoek/-/hoek-9.3.0.tgz",
@@ -7792,11 +7797,6 @@
"node": "*"
}
},
"node_modules/mousetrap": {
"version": "1.6.5",
"resolved": "https://registry.npmjs.org/mousetrap/-/mousetrap-1.6.5.tgz",
"integrity": "sha512-QNo4kEepaIBwiT8CDhP98umTetp+JNfQYBWvC1pc6/OAibuXtRcxZ58Qz8skvEHYvURne/7R8T5VoOI7rDsEUA=="
},
"node_modules/mrmime": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/mrmime/-/mrmime-1.0.1.tgz",
@@ -12885,6 +12885,11 @@
}
}
},
"@github/hotkey": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/@github/hotkey/-/hotkey-2.0.1.tgz",
"integrity": "sha512-qKXjAJjtheJbf4ie3hi8IwrHWJZHB5qdojR6JGo6jvQNPpsdUbk/NIdU8sxu4PW41CjW80vfciDMu3MAP3j2Fg=="
},
"@hapi/hoek": {
"version": "9.3.0",
"resolved": "https://registry.npmjs.org/@hapi/hoek/-/hoek-9.3.0.tgz",
@@ -17049,11 +17054,6 @@
"resolved": "https://registry.npmjs.org/moment/-/moment-2.29.4.tgz",
"integrity": "sha512-5LC9SOxjSc2HF6vO2CyuTDNivEdoz2IvyJJGj6X8DJ0eFyfszE0QiEd+iXmBvUP3WHxSjFH/vIsA0EN00cgr8w=="
},
"mousetrap": {
"version": "1.6.5",
"resolved": "https://registry.npmjs.org/mousetrap/-/mousetrap-1.6.5.tgz",
"integrity": "sha512-QNo4kEepaIBwiT8CDhP98umTetp+JNfQYBWvC1pc6/OAibuXtRcxZ58Qz8skvEHYvURne/7R8T5VoOI7rDsEUA=="
},
"mrmime": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/mrmime/-/mrmime-1.0.1.tgz",

View File

@@ -8,6 +8,7 @@
"lint": "vue-cli-service lint"
},
"dependencies": {
"@github/hotkey": "^2.0.1",
"@popperjs/core": "^2.11.5",
"axios": "^0.27.2",
"bootstrap": "^5.2.0",
@@ -15,7 +16,6 @@
"core-js": "^3.8.3",
"jquery": "^3.6.0",
"moment": "^2.29.4",
"mousetrap": "^1.6.5",
"vue": "^3.2.37",
"vue-github-button": "^3.0.3",
"vue-gtag": "^2.0.1",

View File

@@ -2,8 +2,8 @@
import axios from "axios";
import moment from "moment";
import Loading from "vue-loading-overlay";
import Mousetrap from "mousetrap";
import GithubButton from "vue-github-button";
import { install } from "@github/hotkey";
import "vue-loading-overlay/dist/vue-loading.css";
@@ -18,22 +18,17 @@ export default {
};
},
mounted() {
// Install all the hotkeys on the page
for (const el of document.querySelectorAll("[data-hotkey]")) {
install(el);
}
this.sortColumn = localStorage.getItem("sortColumn") || "score";
this.ascending =
localStorage.getItem("ascending") === "false" ? false : true;
this.isLoading = true;
this.fetchDeals();
Mousetrap.bind("/", this.focusFilter, "keyup");
Mousetrap.bind("r", this.fetchDeals);
Mousetrap.bind("escape", this.blurFilter);
},
methods: {
focusFilter() {
this.$refs.filter.focus();
},
blurFilter() {
this.$refs.filter.blur();
},
createFilterRoute(params) {
this.$refs.filter.blur();
history.pushState(
@@ -135,12 +130,14 @@ export default {
<link rel="shortcut icon" type="image/png" href="/favicon.png" />
<body>
<input
class="form-control bg-dark text-light mousetrap"
class="form-control bg-dark text-light"
type="text"
id="filter"
placeholder="Filter"
data-hotkey="/"
v-model="filter"
v-on:keyup.enter="createFilterRoute(this.filter.toString())"
v-on:keyup.escape="this.$refs.filter.blur()"
ref="filter"
/>
<table class="table table-dark table-hover">
@@ -201,7 +198,14 @@ export default {
</table>
<div v-if="!isMobile()">
<footer class="fixed-bottom">
<small>Tip: Press '/' to filter and create filter links (i.e. <a href="/#/filter=pizza" onclick="setTimeout(location.reload.bind(location), 1)">https://rfd.fyi/#/filter=pizza</a>)</small>
<small
>Tip: Press '/' to filter and create filter links (i.e.
<a
href="/#/filter=pizza"
onclick="setTimeout(location.reload.bind(location), 1)"
>https://rfd.fyi/#/filter=pizza</a
>)</small
>
<div class="footer-right">
<github-button href="https://github.com/davegallant/rfd-fyi"
>Star</github-button

View File

@@ -5,7 +5,6 @@ import { createRouter, createWebHashHistory } from "vue-router";
import "bootstrap/dist/css/bootstrap.min.css";
import "bootstrap/dist/js/bootstrap.min.js";
import "mousetrap/mousetrap.min.js";
import "./theme.css";

View File

@@ -973,6 +973,11 @@
minimatch "^3.0.4"
strip-json-comments "^3.1.1"
"@github/hotkey@^2.0.1":
version "2.0.1"
resolved "https://registry.npmjs.org/@github/hotkey/-/hotkey-2.0.1.tgz"
integrity sha512-qKXjAJjtheJbf4ie3hi8IwrHWJZHB5qdojR6JGo6jvQNPpsdUbk/NIdU8sxu4PW41CjW80vfciDMu3MAP3j2Fg==
"@hapi/hoek@^9.0.0":
version "9.3.0"
resolved "https://registry.npmjs.org/@hapi/hoek/-/hoek-9.3.0.tgz"
@@ -4313,11 +4318,6 @@ moment@^2.29.4:
resolved "https://registry.npmjs.org/moment/-/moment-2.29.4.tgz"
integrity sha512-5LC9SOxjSc2HF6vO2CyuTDNivEdoz2IvyJJGj6X8DJ0eFyfszE0QiEd+iXmBvUP3WHxSjFH/vIsA0EN00cgr8w==
mousetrap@^1.6.5:
version "1.6.5"
resolved "https://registry.npmjs.org/mousetrap/-/mousetrap-1.6.5.tgz"
integrity sha512-QNo4kEepaIBwiT8CDhP98umTetp+JNfQYBWvC1pc6/OAibuXtRcxZ58Qz8skvEHYvURne/7R8T5VoOI7rDsEUA==
mrmime@^1.0.0:
version "1.0.1"
resolved "https://registry.npmjs.org/mrmime/-/mrmime-1.0.1.tgz"