feat: v0.1.5 support silent mode

Author: HUKE2015

demo/play-in-silent.md

@@ -0,0 +1,33 @@
+---
+title: 5.Play in silent
+order: 5
+---
+
+```jsx
+import React, { Component } from 'react';
+import ReactDOM from 'react-dom';
+import ReactAudioSpectrum from 'react-audio-spectrum';
+
+function App() {
+  return (
+    <div>
+      <audio id="audio-element5"
+        src="https://reader.guru/medias/How-Long-Will-I-Love-You.mp3"
+        autoPlay
+        crossOrigin='anonymous'
+        controls
+      >
+      </audio>
+      <ReactAudioSpectrum
+        silent
+        id="audio-canvas5"
+        audioId={'audio-element5'}
+      />
+    </div>
+  );
+}
+
+ReactDOM.render((
+  <App />
+), mountNode);
+```

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-audio-spectrum",
-  "version": "0.1.4",
+  "version": "0.1.5",
   "description": "a component for displaying audio spectrum",
   "files": [
     "demo/",

src/index.tsx

@@ -19,6 +19,7 @@ type ComponentProps = {
   meterColor?: string | ColorItem[],
   meterCount?: number,
   gap?: number,
+  silent?: boolean,
 };
 
 enum PLAY_STATUS {
@@ -39,6 +40,7 @@ export default function ReactAudioSpectrum(props: ComponentProps) {
     ],
     gap=10,
     meterCount=160, meterWidth=2,
+    silent=false
   } = props;
   const _audioEleRef = useRef<HTMLElement>()
   const _audioCanvasRef = useRef<HTMLCanvasElement>()
@@ -85,7 +87,9 @@ export default function ReactAudioSpectrum(props: ComponentProps) {
       // @ts-ignore
       _mediaEleSourceRef.current = _audioContextRef.current.createMediaElementSource(audioEle)
       _mediaEleSourceRef.current.connect(_audioAnalyserRef.current)
-      _mediaEleSourceRef.current.connect(_audioContextRef.current.destination);
+      if (!silent) {
+        _mediaEleSourceRef.current.connect(_audioContextRef.current.destination);
+      }
     }
   }