react-hooks-audio
Version:
Custom audio playback for React Hooks
2 lines (1 loc) • 1.5 kB
JavaScript
import{useState as e,useRef as r,useCallback as t,useEffect as n}from"react";let u;const a=({value:a,isWebm:c}={})=>{const[d,i]=e(!1),l=r(null),[o,s]=e(0),[m,p]=e(0),E=t((()=>{l.current?.pause(),i(!1),u=null}),[]),v=t((()=>{u?(i(!1),u?.pause(),u=null,u={playing:!0,pause:E}):u={playing:!0,pause:E},l.current?.play(),i(!0)}),[E]),T=t((()=>{u?(i(!1),u?.pause(),u=null,u={playing:!0,pause:E}):u={playing:!0,pause:E},l.current&&(l.current.currentTime=0,l.current.play()),i(!0)}),[E]),y=t((()=>{i(!1),u=null}),[]),L=t((()=>{l.current?.duration!==1/0&&s(l.current.duration)}),[]),A=t((()=>{l.current?.duration!==1/0&&s(l.current?.duration)}),[]),g=t((()=>{p(l.current?.currentTime)}),[]),N=t((e=>{l.current&&(l.current.currentTime=e)}),[]);n((()=>{a&&(l.current=new Audio(a),c&&(l.current.currentTime=Number.MAX_SAFE_INTEGER))}),[c,a]);const _=t((()=>{l.current&&(l.current.addEventListener("ended",y),l.current.addEventListener("loadeddata",L),l.current.addEventListener("loadedmetadata",A),l.current.addEventListener("timeupdate",g))}),[y,L,A,g]);return n((()=>(_(),()=>{E(),l.current?.removeEventListener("ended",y),l.current?.removeEventListener("loadeddata",L),l.current?.removeEventListener("loadedmetadata",A),l.current?.removeEventListener("timeupdate",g)})),[_,y,L,A,E,g]),{init:e=>{e&&(l.current=new Audio(e),c&&(l.current.currentTime=Number.MAX_SAFE_INTEGER),_())},currentTime:m,setCurrentTime:N,audioTime:o,playing:d,play:v,rePlay:T,pause:E,audio:l.current}};export{a as default,a as useAudio};