From 40e2b65715ef3d3198ea012fe2112dc8883d4151 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=90=84=E5=8B=99=E5=8E=9F=20=E3=81=AA=E3=81=A7=E3=81=97?=
 =?UTF-8?q?=E3=81=93?= <axmmisaka@users.noreply.github.com>
Date: Thu, 27 Jul 2023 00:01:45 -0700
Subject: [PATCH] Focus on the searchbox when "/" key is pressed
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

按下"/"键后聚焦搜索框
This commit addresses and closes #371
本提交解决并关闭#371
---
 _layouts/index.html |  2 +-
 static/js/index.es6 | 10 ++++++++++
 2 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/_layouts/index.html b/_layouts/index.html
index ffdee91..cfe2ca9 100644
--- a/_layouts/index.html
+++ b/_layouts/index.html
@@ -35,7 +35,7 @@
 						<div class="row">
 							<h3 id="mirror-title">{% fa_svg fas.fa-cube %} 镜像列表 </h3>
 							{% unless page.legacy %}
-							<input type="search" v-model.trim="filter" id="search" placeholder="搜索" autocomplete="off">
+							<input type="search" v-model.trim="filter" id="search" ref="search" placeholder="搜索" autocomplete="off">
 							{% endunless %}
 						</div>
 						<table class="table" v-if="mirrorList.length">
diff --git a/static/js/index.es6 b/static/js/index.es6
index 32d90f9..b3faf7a 100644
--- a/static/js/index.es6
+++ b/static/js/index.es6
@@ -30,6 +30,10 @@ var vmMirList = new Vue({
 	},
 	created () {
 		this.refreshMirrorList();
+		window.addEventListener("keypress", this.onKeyPress);
+	},
+	beforeDestroy() {
+		window.removeEventListener("keypress", this.onKeyPress);
 	},
 	updated () {
 		$('.mirror-item-label').popover();
@@ -76,6 +80,12 @@ var vmMirList = new Vue({
 				self.rawMirrorList = status_data;
 				setTimeout(() => {self.refreshMirrorList()}, 10000);
 			});
+		},
+		onKeyPress(event) {
+			if (event.key === '/' && document.activeElement !== this.$refs.search) {
+				event.preventDefault();
+				this.$refs.search.focus();
+			}
 		}
 	}
 })