UNPKG

react-use-audio-player

Version:

React hook for building custom audio playback controls

2 lines 6.92 kB
"use strict";var n=Object.defineProperty,v=Object.defineProperties,A=Object.getOwnPropertyDescriptor,x=Object.getOwnPropertyDescriptors,O=Object.getOwnPropertyNames,b=Object.getOwnPropertySymbols;var g=Object.prototype.hasOwnProperty,F=Object.prototype.propertyIsEnumerable;var S=(r,e,t)=>e in r?n(r,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):r[e]=t,u=(r,e)=>{for(var t in e||(e={}))g.call(e,t)&&S(r,t,e[t]);if(b)for(var t of b(e))F.call(e,t)&&S(r,t,e[t]);return r},h=(r,e)=>v(r,x(e));var C=(r,e)=>{for(var t in e)n(r,t,{get:e[t],enumerable:!0})},_=(r,e,t,a)=>{if(e&&typeof e=="object"||typeof e=="function")for(let o of O(e))!g.call(r,o)&&o!==t&&n(r,o,{get:()=>e[o],enumerable:!(a=A(e,o))||a.enumerable});return r};var L=r=>_(n({},"__esModule",{value:!0}),r);var E={};C(E,{AudioPlayerProvider:()=>R,context:()=>y,useAudioPlayer:()=>w,useAudioPlayerContext:()=>M});module.exports=L(E);var p=require("react");var i=require("react");var P=require("howler"),f=class{constructor(){this._cache=new Map}create(e){let t=e.src;if(this._cache.has(t))return this._cache.get(t);let a=new P.Howl(e);return this._cache.set(t,a),a}set(e,t){this._cache.set(e,t)}get(e){return this._cache.get(e)}clear(e){this._cache.delete(e)}destroy(e){let t=this.get(e);t&&(t.unload(),this.clear(e))}reset(){this._cache.values().forEach(e=>e.unload()),this._cache.clear()}},k=new f,m=k;var d={isUnloaded:!0,isLoading:!1,isReady:!1,isLooping:!1,isPlaying:!1,isStopped:!1,isPaused:!1,duration:0,rate:1,volume:1,isMuted:!1,error:void 0},c=class{updateSnapshot(e){this.snapshot=u(u({},this.snapshot),e),this.subscriptions.forEach(t=>t())}updateSnapshotFromHowlState(e){this.updateSnapshot(u({},this.getSnapshotFromHowl(e)))}initHowl(e){var a,o;let t=m.create(e);this.src=e.src,this.howl=t,this.updateSnapshot(h(u({},this.getSnapshotFromHowl(t)),{error:void 0})),t._html5&&((a=t._sounds[0])!=null&&a._node)&&((o=t._sounds[0])==null?void 0:o._node).addEventListener("canplaythrough",()=>{this.updateSnapshotFromHowlState(t)}),t.on("load",()=>this.updateSnapshotFromHowlState(t)),t.on("play",()=>this.updateSnapshotFromHowlState(t)),t.on("end",()=>this.updateSnapshotFromHowlState(t)),t.on("pause",()=>this.updateSnapshotFromHowlState(t)),t.on("stop",()=>this.updateSnapshotFromHowlState(t)),t.on("mute",()=>this.updateSnapshotFromHowlState(t)),t.on("volume",()=>this.updateSnapshotFromHowlState(t)),t.on("rate",()=>this.updateSnapshotFromHowlState(t)),t.on("seek",()=>this.updateSnapshotFromHowlState(t)),t.on("fade",()=>this.updateSnapshotFromHowlState(t)),t.on("loaderror",(s,l)=>{console.error(`Howl load error: ${l}`),this.updateSnapshotFromHowlState(t),this.updateSnapshot({error:"Failed to load audio source"})}),t.on("playerror",(s,l)=>{console.error(`Howl playback error: ${l}`),this.updateSnapshotFromHowlState(t),this.updateSnapshot({error:"Failed to play audio source"})})}getSnapshotFromHowl(e){if(e.state()==="unloaded")return d;let t=e.state(),a=e.playing(),o=e.mute();return{isUnloaded:t==="unloaded",isLoading:t==="loading",isReady:t==="loaded",isLooping:e.loop(),isPlaying:a,isStopped:!a&&e.seek()===0,isPaused:!a&&e.seek()>0,duration:e.duration(),rate:e.rate(),volume:e.volume(),isMuted:typeof o=="object"?!1:o}}constructor(e){this.howl=null,this.src=null,this.subscriptions=new Set,this.snapshot=d,e!==void 0&&this.initHowl(e)}load(e){this.howl!==null&&this.destroy(),this.initHowl(e)}destroy(){this.src&&this.howl&&(this.howl.off("load"),this.howl.off("play"),this.howl.off("end"),this.howl.off("pause"),this.howl.off("stop"),this.howl.off("mute"),this.howl.off("volume"),this.howl.off("rate"),this.howl.off("seek"),this.howl.off("fade"),this.howl.off("loaderror"),this.howl.off("playerror"),m.destroy(this.src),this.src=null,this.howl=null)}subscribe(e){return this.subscriptions.add(e),()=>this.subscriptions.delete(e)}getSnapshot(){return this.snapshot}play(){if(this.howl){if(this.howl.playing())return;this.howl.play()}}pause(){this.howl&&this.howl.pause()}togglePlayPause(){this.snapshot.isPlaying?this.pause():this.play()}stop(){this.howl&&this.howl.stop()}setVolume(e){this.howl&&this.howl.volume(e)}setRate(e){this.howl&&this.howl.rate(e)}loopOn(){this.howl&&(this.howl.loop(!0),this.updateSnapshotFromHowlState(this.howl))}loopOff(){this.howl&&(this.howl.loop(!1),this.updateSnapshotFromHowlState(this.howl))}toggleLoop(){this.snapshot.isLooping?this.loopOff():this.loopOn()}mute(){this.howl&&this.howl.mute(!0)}unmute(){this.howl&&this.howl.mute(!1)}toggleMute(){this.snapshot.isMuted?this.unmute():this.mute()}seek(e){this.howl&&this.snapshot.duration!==1/0&&this.howl.seek(e)}getPosition(){return this.howl?this.howl.seek():0}fade(e,t,a){this.howl&&this.howl.fade(e,t,a)}};function w(r,e){let t=(0,i.useRef)(new c);r&&t.current&&r!==t.current.src&&t.current.load(u({src:r,format:e==null?void 0:e.format,html5:e==null?void 0:e.html5,autoplay:e==null?void 0:e.autoplay,loop:e==null?void 0:e.loop,volume:e==null?void 0:e.initialVolume,mute:e==null?void 0:e.initialMute,rate:e==null?void 0:e.initialRate},e));let a=(0,i.useSyncExternalStore)(t.current.subscribe.bind(t.current),t.current.getSnapshot.bind(t.current),()=>d);(0,i.useEffect)(()=>(r&&t.current.src===null&&t.current.load(u({src:r,format:e==null?void 0:e.format,html5:e==null?void 0:e.html5,autoplay:e==null?void 0:e.autoplay,loop:e==null?void 0:e.loop,volume:e==null?void 0:e.initialVolume,mute:e==null?void 0:e.initialMute,rate:e==null?void 0:e.initialRate},e)),()=>{t.current&&t.current.destroy()}),[]);let o=(0,i.useCallback)((s,l)=>{t.current.load(u({src:s,format:l==null?void 0:l.format,html5:l==null?void 0:l.html5,autoplay:l==null?void 0:l.autoplay,loop:l==null?void 0:l.loop,volume:l==null?void 0:l.initialVolume,mute:l==null?void 0:l.initialMute,rate:l==null?void 0:l.initialRate},l))},[]);return h(u({},a),{player:t.current.howl,src:t.current.src,load:r?void 0:o,play:t.current.play.bind(t.current),pause:t.current.pause.bind(t.current),togglePlayPause:t.current.togglePlayPause.bind(t.current),stop:t.current.stop.bind(t.current),setVolume:t.current.setVolume.bind(t.current),fade:t.current.fade.bind(t.current),mute:t.current.mute.bind(t.current),unmute:t.current.unmute.bind(t.current),toggleMute:t.current.toggleMute.bind(t.current),setRate:t.current.setRate.bind(t.current),seek:t.current.seek.bind(t.current),loopOn:t.current.loopOn.bind(t.current),loopOff:t.current.loopOff.bind(t.current),toggleLoop:t.current.toggleLoop.bind(t.current),getPosition:t.current.getPosition.bind(t.current),cleanup:t.current.destroy.bind(t.current)})}var H=require("react/jsx-runtime"),y=(0,p.createContext)(null),M=()=>{let r=(0,p.useContext)(y);if(r===null)throw new Error("useAudioPlayerContext must be used within an AudioPlayerProvider");return r};function R({children:r}){let e=w();return(0,H.jsx)(y.Provider,{value:e,children:r})}0&&(module.exports={AudioPlayerProvider,context,useAudioPlayer,useAudioPlayerContext}); //# sourceMappingURL=index.cjs.map