Browse Source

添加部分无障碍按钮点击朗读信息,并略微优化无障碍逻辑代码

任一存 3 years ago
parent
commit
c2fe2f6291
2 changed files with 44 additions and 15 deletions
  1. 1 1
      web/README.md
  2. 43 14
      web/src/views/accessibility.vue

File diff suppressed because it is too large
+ 1 - 1
web/README.md


+ 43 - 14
web/src/views/accessibility.vue

@@ -58,7 +58,7 @@
       <li>
         <button
           tabindex="0"
-          aria-description="Mute"
+          aria-description="Sound"
           type="button"
           @click="onClickMute"
         >
@@ -100,7 +100,7 @@
       <li>
         <button
           tabindex="0"
-          aria-description="Coor Modification"
+          aria-description="Color Modification"
           type="button"
           @click="onClickColorModification"
         >
@@ -508,7 +508,7 @@ export default {
           this.$emit('show')
           this.$eventBus.$emit('aria-show')
         } else {
-          this.onClickReset()
+          this.reset()
           for (const iterator of document.body.classList) {
             if (iterator === 'aria-active') {
               document.body.classList.remove(iterator)
@@ -528,6 +528,7 @@ export default {
     'ariaSettings.readMode': {
       handler(v) {
         if (v === 'point') {
+          this.continueReadTaskId = null
           document.removeEventListener('mouseover', this.onMouseOverForContinueRead, {
             passive: true,
           })
@@ -875,24 +876,32 @@ export default {
       }
     },
     onFocusIn(e) {
-      if (!this.ariaSettings.isCompActive) {
-        return
-      }
-      const extractedText = utils.extractTextForMagnify(e, true)
-      if (extractedText) {
-        this.elemType = extractedText.elemType
-        this.elemDisc = extractedText.elemDisc
-        this.planToPlayAudio(this.continueReadTaskId)
-      }
+        if (!this.ariaSettings.isCompActive) {
+          return
+        }
+        const extractedText = utils.extractTextForMagnify(e, true)
+        if (extractedText) {
+          this.elemType = extractedText.elemType
+          this.elemDisc = extractedText.elemDisc
+          this.planToPlayAudio(this.continueReadTaskId)
+        }
     },
-
-    onClickReset() {
+    reset() {
       const copy = { ...defaultAriaSettings }
       copy.isCompActive = this.ariaSettings.isCompActive
       this.ariaSettings = copy
     },
+    onClickReset() {
+      this.planToPlayAudio('', "You've reset the feature settings")
+      this.reset()
+    },
     onClickMute() {
       this.ariaSettings.isMuted = !this.ariaSettings.isMuted
+      if (this.ariaSettings.isMuted) {
+        this.planToPlayAudio('', 'Sound off')
+      } else {
+        this.planToPlayAudio('', 'Sound on')
+      }
       if (this.audioPlayer) {
         this.audioPlayer.muted = this.ariaSettings.isMuted
       }
@@ -902,14 +911,23 @@ export default {
       if (this.ariaSettings.speechRateLevel === speechRateFactors.length) {
         this.ariaSettings.speechRateLevel = 0
       }
+      if (this.ariaSettings.speechRateLevel === 0) {
+        this.planToPlayAudio('', 'Speak slowly')
+      } else if (this.ariaSettings.speechRateLevel === 1) {
+        this.planToPlayAudio('', 'Speak normally')
+      } else if (this.ariaSettings.speechRateLevel === 2) {
+        this.planToPlayAudio('', 'Speak fast')
+      }
       if (this.audioPlayer) {
         this.audioPlayer.playbackRate = speechRateFactors[this.ariaSettings.speechRateLevel]
       }
     },
     onClickScreenReaderMode() {
       if (this.ariaSettings.readMode === 'point') {
+        this.planToPlayAudio('', "You've enabled continuous reading mode.Please move the mouse over on the text you need to read,it'll start reading the screen in 1 second. When reading the link, tap the Enter key to enter the corresponding page.")
         this.ariaSettings.readMode = 'continue'
       } else if (this.ariaSettings.readMode === 'continue') {
+        this.planToPlayAudio('', "You've enabled read-only mode.Please move the mouse over on the text you need to read,Blind users can operate the keyboard directly.")
         this.ariaSettings.readMode = 'point'
       }
     },
@@ -918,6 +936,17 @@ export default {
       if (this.ariaSettings.themeIdx === themeList.length) {
         this.ariaSettings.themeIdx = 0
       }
+      if (this.ariaSettings.themeIdx === 0) {
+        this.planToPlayAudio('', "Ajust to standard color.")
+      } else if (this.ariaSettings.themeIdx) {
+        this.planToPlayAudio('', "Adjust to black lettering on white background.")
+      } else if (this.ariaSettings.themeIdx) {
+        this.planToPlayAudio('', "Adjust to yellow lettering on blue background.")
+      } else if (this.ariaSettings.themeIdx) {
+        this.planToPlayAudio('', "Adjust to black lettering on yellow background.")
+      } else if (this.ariaSettings.themeIdx) {
+        this.planToPlayAudio('', "Adjust to yellow lettering on black background.")
+      }
     },
     onClickZoomIn() {
       if (this.ariaSettings.zoomLevel === zoomFactors.length - 1) {