AudioPlayer Duration Not Working

So, pretty simple question. I have an AudioPlayer that is connected to an external URL through a dataset.

export function dataset_ready() {
   let item = $w('#dataset').getCurrentItem()
   const audioPlayer = $w('#audioPlayer')
   audioPlayer.src = item.audioURL
}

This works fine, the url is correct and the audioPlayer is able to play from the url. The problem I’m having is that the audioPlayer’s duration property is incorrect. I thought it might be because the audio hadn’t loaded yet, but even when I try to read the duration during the audioPlayer’s onProgress function.

export function audioPlayer_progress(event) {
    const audioPlayer = $w('#audioPlayer')
    console.log("current: " + $w('#audioPlayer').currentTime + ", duration: " + $w('#audioPlayer').duration)
}

This does not ever return the correct duration, but always returns the correct currentTime. In fact, it’s always returning 64 (seconds) as the duration when in fact the audio is over 23 minutes.

I’m at my wit’s end with trying to figure out what is going on. Does anyone have any suggestions?

I suggest when collecting your audio, use the Upload Button so you can collect metadata about the audio file that you can store along with the audioURL into the collection.

Reference

If you were to have a simple function like so, you’d able to collect the file’s duration in milliseconds upon completion of the upload.

export async function uploadButton_change(){
	const f=await $w("#uploadButton").value
    if(f.length>0){
		$w("#uploadVideo").uploadFiles()
		.then((files)=>{
			let audioURL=files[0].fileUrl
			let audioDuration=files[0].duration
			let audioTitle=files[0].originalFileName
			wixData.insert("Collection",{"audioURL":audioURL,"duration":audioDuration,"title":audioTitle})
		})
	}
}

Then, if needed, you can add an extra function to convert milliseconds into seconds.


export async function uploadButton_change(){
	const f=await $w("#uploadButton").value
    if(f.length>0){
		$w("#uploadVideo").uploadFiles()
		.then((files)=>{
			let audioURL=files[0].fileUrl
			let audioDurationMilliSeconds=files[0].duration
			let audioDurationSeconds=Math.round(audioDurationMilliSeconds/1000)
			let audioTitle=files[0].originalFileName
			wixData.insert("Collection",{"audioURL":audioURL,"duration":audioDurationSeconds,"title":audioTitle})
		})
	}
}

Finally, store the newly acquired duration into your collection. Be sure the collection’s key type for “duration” is numerical, elsewise you could have some issues (none that you can’t fix though). Hopefully it’s still relevant… cheers!