feat: docs fix window not undefined

theajack · Apr 28, 2022 · c7412e6 · c7412e6
1 parent c0bee50
commit c7412e6
Show file tree

Hide file tree

Showing 5 changed files with 41 additions and 29 deletions.
diff --git a/public/index.ts b/public/index.ts
@@ -126,7 +126,7 @@ cnchar.draw.onWordNotFound((word) => {
     console.log('word not found', word);
 });
 
-(window as any).aaa = cnchar.draw('你好九庳䭹', {
+win.draw = cnchar.draw('你好九庳䭹', {
     type: cnchar.draw.TYPE.ANIMATION,
     style: {
         radicalColor: '#44f',

diff --git a/src/cnchar/plugin/voice/play-mp3.ts b/src/cnchar/plugin/voice/play-mp3.ts
@@ -2,7 +2,7 @@
  * @Author: tackchen
  * @Date: 2022-04-14 23:03:31
  * @LastEditors: tackchen
- * @LastEditTime: 2022-04-27 16:09:24
+ * @LastEditTime: 2022-04-28 16:18:33
  * @FilePath: /cnchar/src/cnchar/plugin/voice/play-mp3.ts
  * @Description: Coding something
  */
@@ -21,19 +21,17 @@ const audioContext: AudioContext | null = (() => {
         return wx.createWebAudioContext();
     }
     if (Env === 'web') {
-        const AudioContext = (window.AudioContext || (window as any).webkitAudioContext || (window as any).mozAudioContext);
+        const win = (window as any);
+        const AudioContext = (win.AudioContext || win.webkitAudioContext || win.mozAudioContext);
         if (!AudioContext) {
             console.log('当前环境不支持web audio');
             return null;
         };
         return new AudioContext();
     }
-    console.log('当前环境不支持web audio');
     return null;
 })();
 
-(window as any).getAudioContext = () => audioContext;
-
 export const loadAudos = (() => {
     return (urls: string[]) => {
         return Promise.all(
@@ -99,7 +97,6 @@ const loadAudio = ((() => {
         return Promise.resolve(null);
     };
 })()) as ((url: string)=>Promise<AudioBuffer|null>);
-(window as any).loadAudio = loadAudio;
 
 export async function playMp3Url ({url, rate = 1, volume = 1, offset = 0, oninit}: IVoicePlaySingleFromUrl) {
     const result = await loadAudio(url);

diff --git a/src/cnchar/plugin/voice/speech-api.ts b/src/cnchar/plugin/voice/speech-api.ts
@@ -2,25 +2,32 @@
  * @Author: tackchen
  * @Date: 2022-04-15 11:37:04
  * @LastEditors: tackchen
- * @LastEditTime: 2022-04-28 09:59:50
+ * @LastEditTime: 2022-04-28 16:34:24
  * @FilePath: /cnchar/src/cnchar/plugin/voice/speech-api.ts
  * @Description: Coding something
  */
 
+import {Env} from '@common/adapter';
 import {IRecognize, IRecognizeOptions, ISpeak, ISpeakOptions} from 'cnchar-types/plugin/voice';
 
+function buildFakeRecognize () {
+    const recognize = ((options: IRecognizeOptions = {}) => {
+        console.warn('当前浏览器暂不支持', options);
+        return {};
+    }) as IRecognize;
+    recognize.stop = () => {console.warn('当前浏览器暂不支持');};
+    recognize.supported = false;
+    return recognize;
+}
+
 export const recognize: IRecognize = (() => {
+    if (Env !== 'web') {
+        return buildFakeRecognize();
+    }
     const win = window as any;
     const SpeechRecognition = win.SpeechRecognition || win.webkitSpeechRecognition;
-
     if (!SpeechRecognition) {
-        const recognize = ((options: IRecognizeOptions = {}) => {
-            console.warn('当前浏览器暂不支持', options);
-            return {};
-        }) as IRecognize;
-        recognize.stop = () => {console.warn('当前浏览器暂不支持');};
-        recognize.supported = false;
-        return recognize;
+        return buildFakeRecognize();
     }
 
     let recognition: any = null;
@@ -89,21 +96,26 @@ export const recognize: IRecognize = (() => {
     return recognize;
 })();
 
+function buildFakeSpeak () {
+    const speak = ((text: string) => {
+        console.warn('当前浏览器暂不支持', text);
+        return {} as SpeechSynthesisUtterance;
+    }) as ISpeak;
+    speak.cancel =
+    speak.pause =
+    speak.resume = () => { console.warn('当前浏览器暂不支持');};
+    speak.supported = false;
+    return speak;
+}
+
 export const speak: ISpeak = (() => {
+    if (Env !== 'web') {
+        return buildFakeSpeak();
+    }
     const SpeechSynthesisUtterance = window.SpeechSynthesisUtterance;
-
     if (!SpeechSynthesisUtterance || !window.speechSynthesis) {
-        const speak = ((text: string) => {
-            console.warn('当前浏览器暂不支持', text);
-            return {} as SpeechSynthesisUtterance;
-        }) as ISpeak;
-        speak.cancel =
-        speak.pause =
-        speak.resume = () => { console.warn('当前浏览器暂不支持');};
-        speak.supported = false;
-        return speak;
+        return buildFakeSpeak();
     }
-
     const speak = ((text: string, {
         lang = 'zh-CN',
         volume = 1,

diff --git a/vuepress/.vuepress/components/home.vue b/vuepress/.vuepress/components/home.vue
@@ -7,7 +7,7 @@
         <div class='desc'>功能全面、多端支持的汉字拼音笔画js库</div>
         <div class='test'>
             <el-input v-model='text' class='test-input' type='text' placeholder='输入一些汉字试试' @input='input'></el-input>
-            <div class='btn-w'>
+            <div class='btn-w' v-show="supportVoice">
                 <el-button type='default' @click='regonize'>语音识别 <i class="ei-music"></i></el-button>
                 <el-button type='default' @click="speak">语音合成 <i class="ei-volume-up"></i></el-button>
             </div>
@@ -72,13 +72,15 @@
                 trad: '',
                 spark: '',
                 order: '',
+                supportVoice: false,
             };
         },
         mounted(){
             if(location.hash){
                 this.text = decodeURIComponent(location.hash).substring(1);
                 this.applyText();
             }
+            this.supportVoice = window.cnchar.voice.speak.supported && window.cnchar.voice.recognize.supported;
         },
         methods: {
             input () {
@@ -211,6 +213,7 @@
         .btn-w{
             max-width: 1000px;
             padding: 0.5rem 0;
+            margin: 0 auto;
         }
         .start-w{
             max-width: 1000px;

diff --git a/vuepress/.vuepress/enhanceApp.js b/vuepress/.vuepress/enhanceApp.js
@@ -44,7 +44,7 @@ export default ({
     Vue.use(ElementUI);
 
     let toastTimer = null;
-    Vue.prototype.$toast = window.$toast = (text, time = 2000) => {
+    Vue.prototype.$toast = (text, time = 2000) => {
         if (!text) return;
         const id = '_vuepress_toast';
         let el = document.getElementById(id);