Comments (3)
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?
from videojs-sprite-thumbnails.
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)); }
from videojs-sprite-thumbnails.
From the plugin perspective the configuration is updated/merged as described here:
- when the plugin is loaded.
- 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.
from videojs-sprite-thumbnails.
Related Issues (20)
- Dynamic sources HOT 3
- Optionally use NetworkInformation to disable sprite loading over slow connections
- Ensure loading of sprite image does not interfere with playback
- TypeError: player.spriteThumbnails is not a function
- Unable to get Plugin to execute HOT 2
- Plugin does not respect videojs.Vhs.xhr.beforeRequest HOT 3
- Strange behavior when "&" is part of sprite URL HOT 1
- Thumbnail does not appear under chrome HOT 3
- Thumbnail not appear on Control Bar HOT 13
- TypeError: Class constructor Plugin cannot be invoked without 'new' HOT 6
- Can't get thumbnails to show HOT 2
- time tooltip out of bounds on the right of player HOT 2
- The plugin loads successfully but the thumbnail is not displayed HOT 7
- feat: load sprite images on demand
- feat: support multiple sprites and individual thumbnails HOT 1
- Refactor and improve verification of component tree
- ES6 Import videojs-sprite-thumbnails in TS React app HOT 1
- mobile device support? HOT 1
- Recommended method for creating sprite image HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from videojs-sprite-thumbnails.