search

chrisboustead / videojs-hls-quality-selector

Adds a quality selector menu for HLS sources played in videojs. Requires `videojs-contrib-quality-levels` plugin.
MIT License
140 stars 103 forks source link

How to use it with in Webpack (vanilla javascript) #54

Open the-conqueror-97 opened 3 years ago

the-conqueror-97 commented 3 years ago

It would be really cool to make a complete demo of this because i dont understand how to use it :/

I'm importing with

import videojs from video.js; import("videojs-hls-quality-selector/dist/videojs-hls-quality-selector"); import("videojs-contrib-quality-levels");

let sourceList = []; sources.forEach((element) => { sourceList.push({ src: element.getAttribute("src"), quality: element.getAttribute("quality"), type: element.getAttribute("type") }) });

let video = videojs(e, { playbackRates: [0.5, 1, 1.5, 2], aspectRatio: "640:400", preload: "auto", muted: true, controls: true, fluid: true, autoplay: true, sources: sourceList });

video.hlsQualitySelector({ displayCurrentQuality: true, });

And now i'm stuck...

I have my source list, and each of them have different qualities. I need to make them selectable.

Thanks for the help

sahilkashyap64 commented 3 years ago

Give this a try I tested with multiple plugins and made demo players with it code: https://github.com/sahilkashyap64/hls demo: https://sahilkashyap64.github.io/hls/index3.html