feat(controller): add controller sensitivity setting and integrate into UI

Author: Ayideyia

frontend/src/constant/app.ts

@@ -109,3 +109,5 @@ export const DefaultTestURL = 'https://www.gstatic.com/generate_204'
 export const DefaultConcurrencyLimit = 20
 
 export const DefaultCardColumns = 5
+
+export const DefaultControllerSensitivity = 2

frontend/src/lang/locale/en.ts

@@ -314,6 +314,7 @@ export default {
       delay: 'Delay test URL',
       concurrencyLimit: 'Latency test concurrency',
       cardColumns: 'Number of card columns',
+      sensitivity: 'Controller Scroll Sensitivity',
       closeMode: {
         name: 'Controller Close Mode',
         all: 'Scroll or Button',

frontend/src/lang/locale/zh.ts

@@ -313,6 +313,7 @@ export default {
       delay: '延迟测试URL',
       concurrencyLimit: '延迟测试并发数量',
       cardColumns: '卡片展示列数',
+      sensitivity: '控制器滚动灵敏度',
       closeMode: {
         name: '控制器关闭模式',
         all: '滚动和关闭按钮',

frontend/src/stores/appSettings.ts

@@ -13,6 +13,7 @@ import {
   Colors,
   DefaultCardColumns,
   DefaultConcurrencyLimit,
+  DefaultControllerSensitivity,
   DefaultFontFamily,
   DefaultTestURL,
   UserFilePath,
@@ -73,6 +74,7 @@ export const useAppSettingsStore = defineStore('app-settings', () => {
       testUrl: DefaultTestURL,
       concurrencyLimit: DefaultConcurrencyLimit,
       controllerCloseMode: ControllerCloseMode.All,
+      controllerSensitivity: DefaultControllerSensitivity,
       main: undefined as any,
       alpha: undefined as any,
     },
@@ -103,6 +105,9 @@ export const useAppSettingsStore = defineStore('app-settings', () => {
     if (app.value.kernel.controllerCloseMode === undefined) {
       app.value.kernel.controllerCloseMode = ControllerCloseMode.All
     }
+    if (app.value.kernel.controllerSensitivity === undefined) {
+      app.value.kernel.controllerSensitivity = DefaultControllerSensitivity
+    }
     if (app.value.addGroupToMenu === undefined) {
       app.value.addGroupToMenu = false
     }

frontend/src/types/app.d.ts

@@ -74,6 +74,7 @@ type AppSettings = {
     testUrl: string
     concurrencyLimit: number
     controllerCloseMode: ControllerCloseMode
+    controllerSensitivity: number
     main: {
       env: Recordable
       args: string[]

frontend/src/views/HomeView/components/GroupsController.vue

@@ -8,6 +8,7 @@ import {
   ControllerCloseModeOptions,
   DefaultCardColumns,
   DefaultConcurrencyLimit,
+  DefaultControllerSensitivity,
   DefaultTestURL,
 } from '@/constant/app'
 import { ControllerCloseMode } from '@/enums/app'
@@ -209,6 +210,7 @@ const handleResetMoreSettings = () => {
   appSettings.app.kernel.testUrl = DefaultTestURL
   appSettings.app.kernel.concurrencyLimit = DefaultConcurrencyLimit
   appSettings.app.kernel.controllerCloseMode = ControllerCloseMode.All
+  appSettings.app.kernel.controllerSensitivity = DefaultControllerSensitivity
   appSettings.app.kernel.cardColumns = DefaultCardColumns
   message.success('common.success')
 }
@@ -396,6 +398,21 @@ onActivated(() => {
       />
     </div>
 
+    <div
+      v-if="appSettings.app.kernel.controllerCloseMode === ControllerCloseMode.All"
+      class="form-item"
+    >
+      {{ t('home.controller.sensitivity') }}
+      <Input
+        v-model="appSettings.app.kernel.controllerSensitivity"
+        type="number"
+        :min="1"
+        :max="6"
+        placeholder="1-6"
+        editable
+      />
+    </div>
+
     <div class="form-item">
       {{ t('home.controller.cardColumns') }}
       <Radio

frontend/src/views/HomeView/index.vue

@@ -65,7 +65,7 @@ const onMouseWheel = (e: WheelEvent) => {
     if (isScrollingDown || currentScrollTop === 0) {
       scrollEventCount += 1
     }
-    if (scrollEventCount >= 2) {
+    if (scrollEventCount >= appSettingsStore.app.kernel.controllerSensitivity) {
       showController.value = isScrollingDown || currentScrollTop !== 0
     }
   }