vidstack / player

UI components and hooks for building video/audio players on the web. Robust, customizable, and accessible. Modern alternative to JW Player and Video.js.
https://vidstack.io
MIT License
1.89k stars 114 forks source link

Request for 'player ready' event. #1274

Closed wplit closed 2 months ago

wplit commented 2 months ago

There are situations where I'm finding that I need an event to trigger when the player is ready. Because before then, we can't use the 'subscribe' as it doesn't yet exist.

For example, when using custom loading for the media.. We can't use the 'can-load' or 'can-play', because these are dependant on the 'load' prop, but need a reliable way to be able to subscribe to different states as soon as 'subscribe' is available in the player, regardless of how the media is going to load.

Something like this..

document.querySelector("media-player").addEventListener('player-ready', () => {

const instance = document.querySelector("media-player"); instance.subscribe(({ }) => {...});

})

Without a 'player-ready' event, the subscribe function may not yet exist depending on when the vidstack JS was added.

Wrote more about it here, and the current workaround i'm using - https://discord.com/channels/742612686679965696/1107494438684606554/threads/1235473630096527361

mihar-22 commented 2 months ago
await customElements.whenDefined('media-player');