Is it possible to set the interval dynamically?

[mbaljeetsingh]

I'm using videojs-sprite-thumbnails plugin with https://github.com/surmon-china/videojs-player.

I'm trying to update interval for plugin dynamically based on some json data, but it doesn't seem to work. <video-player controls :src="src" :poster="poster" :loop="true" :volume="0.6" :plugins="{ spriteThumbnails: { interval: spriteInfo.interval, width: 160, height: 90, url: spriteUrl, }, }" :height="380" :width="680" />

It only works if I pass hardcoded value like interval: 2. Any solutions?

[phloxic]

So spriteUrl works? - Have you tried to pass something like interval: spriteInterval? I.e., an integer variable instead of a value of this spriteInfo object. Or the other way round, i.e., spriteInfo.spriteUrl.

Of course I can only guess, but both interval and url are plugin options, so presumably the handling notation in your app should be structurally/hierarchically the same, no?

Did you try to set up other videojs plugins this way?

[mbaljeetsingh]

Hi @phloxic I got it working with the following, when I get sprite info, only then I'm adding the config to plugins. When I pass the plugin options at first, it always takes that config, and doesn't take the updated interval value.

Not sure if it is the correct approach, but works for now

async function fetchSpriteInfo() { fetch(spriteInfoUrl) .then((res) => res.json()) .then((res) => { const { interval } = res; plugins.value = { ...plugins.value, spriteThumbnails: { interval, width: 160, height: 90, url: spriteUrl, }, }; }) .catch((err) => console.error(err)); }

[phloxic]

From the plugin perspective the configuration is updated/merged as described here:

1) when the plugin is loaded. 2) when a video is loaded on loadstart as in the playlist example.

The second method – loading (parts of) the config as a src object - should work. It updates the configuration at runtime, once loadstart is triggered, one cannot change the config anymore while this video is playing. Whether the json parsing of your app allows the video to be loaded that way, I don't know (my guess it that you just use the source property of the video tag). It could be that you have better control of your app's timing with your current approach.