vue-youtube / docs

Documentation for VueYoutube
https://vue-youtube.github.io/docs/
MIT License
5 stars 0 forks source link

PlayerVars option "start" must be integer number #5

Open suterma opened 8 months ago

suterma commented 8 months ago

This is maybe more a documentation issue, because the limitation might be stemming from the underlying IFrame player.

When using the usePlayer constructor with the composition API, as documented here: https://vue-youtube.github.io/docs/usage/composable#configuration, the start value MUST be an integer (whole) number.

If fractions are used (e.g. value 500.1), the value is not applied and the video starts from the beginning.

The solution for this issue might be to document this limitation in the appropriate place, maybe with some simplified example code.

A working example:

const {
    onReady,
    onStateChange,
    onError,
    // togglePlay,
    // toggleMute,
    // toggleLoop,
    instance,
} = usePlayer(videoId, youtubePlayerElement, {
    /** See https://developers.google.com/youtube/player_parameters#Parameters */
    playerVars: {
        autoplay: 0,
        disablekb: 1 /* replayer handles keyboard events on it's own*/,
        enablejsapi: 1,
        color: 'white',
        controls: 1,
        // Setting the playlist to the one video enables looping the single video itself
        // See https://stackoverflow.com/a/25781957/79485
        playlist: videoId.value,
        start: 500, // startPosition, MUST be an integer number,
        rel: 0,
    },
    cookie: true,
});
Techassi commented 8 months ago

The playerVars.start field is typed via TS as number. This is sadly a short-coming in TS/JS. It doesn't allow specifying which kind of number, like int or float.

I will move this issue to the https://github.com/vue-youtube/docs repo add will add more documentation for this.

Techassi commented 8 months ago

I added a temporary note to the docs, see https://github.com/vue-youtube/docs/pull/8. Any feedback can be provided in the PR.

Techassi commented 8 months ago

I merged the PR. I will keep this issue open to track the progress for the TS/JSDoc integration.