apm-react-audio-player 1.0.16 → 1.0.17

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/dist/index.js +36 -7
  2. package/package.json +1 -1
package/dist/index.js CHANGED
@@ -94,16 +94,42 @@ var useAudioPlayer = function useAudioPlayer(audioRef, progressBarRef, volumeCtr
94
94
  isMuted = _useState10[0],
95
95
  setIsMuted = _useState10[1];
96
96
  var isStream = audioRef.current && audioRef.current.currentSrc.includes('stream');
97
+
98
+ // Add a new state variable
99
+ var _useState11 = React.useState(false),
100
+ _useState12 = _slicedToArray(_useState11, 2),
101
+ isAudioReady = _useState12[0],
102
+ setIsAudioReady = _useState12[1];
103
+ console.log('🟡 audioRef', audioRef);
104
+ console.log('🟡 progressBarRef', progressBarRef);
105
+ console.log(' audioRef.current ', audioRef.current);
97
106
  React.useEffect(function () {
98
107
  if (currentTime === Number(duration)) {
99
108
  // restart()
100
109
  setIsFinishedPlaying(true);
110
+ console.log('🟡 audioRef', audioRef);
111
+ console.log('⚪️ progressBarRef', progressBarRef);
112
+ if (progressBarRef.current) {
113
+ progressBarRef.current.style.setProperty('--seek-before-width', '0%');
114
+ }
101
115
  }
102
- }, [currentTime]);
116
+ var audio = audioRef.current;
117
+
118
+ // Define a function to set isAudioReady to true when the audio is ready
119
+ var handleCanPlayThrough = function handleCanPlayThrough() {
120
+ setIsAudioReady(true);
121
+ };
122
+ audio.addEventListener('canplaythrough', handleCanPlayThrough);
123
+
124
+ // Clean up the event listener on unmount
125
+ return function () {
126
+ audio.removeEventListener('canplaythrough', handleCanPlayThrough);
127
+ };
128
+ }, [isPlaying]);
103
129
  var onLoadedMetadata = function onLoadedMetadata() {
104
130
  var seconds = Math.floor(audioRef.current.duration);
105
131
  setDuration(seconds);
106
- if (!isStream) {
132
+ if (seconds !== Infinity) {
107
133
  progressBarRef.current.max = seconds;
108
134
  }
109
135
  };
@@ -138,10 +164,13 @@ var useAudioPlayer = function useAudioPlayer(audioRef, progressBarRef, volumeCtr
138
164
  // }
139
165
 
140
166
  var play = function play() {
141
- setIsPlaying(true);
142
- setIsFinishedPlaying(false);
143
- audioRef.current.play();
144
- if (!isStream) {
167
+ if (isAudioReady) {
168
+ // if (!isStream) {
169
+ // animationRef.current = window.requestAnimationFrame(whilePlaying)
170
+ // }
171
+ setIsPlaying(true);
172
+ setIsFinishedPlaying(false);
173
+ audioRef.current.play();
145
174
  animationRef.current = window.requestAnimationFrame(whilePlaying);
146
175
  }
147
176
  };
@@ -298,7 +327,7 @@ var ReactAudioPlayerInner = function ReactAudioPlayerInner(props) {
298
327
  }, /*#__PURE__*/React__default.createElement("audio", {
299
328
  ref: audioPlayerRef,
300
329
  src: audioSrc,
301
- preload: "none",
330
+ preload: "metadata",
302
331
  onLoadedMetadata: onLoadedMetadata,
303
332
  muted: isMuted
304
333
  }), /*#__PURE__*/React__default.createElement("div", {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "apm-react-audio-player",
3
- "version": "1.0.16",
3
+ "version": "1.0.17",
4
4
  "author": "Jason Phan <jphan@mpr.org>",
5
5
  "license": "MIT",
6
6
  "private": false,