silvermine / videojs-quality-selector

MIT License
180 stars 55 forks source link

How to set Quality track by code? #108

Closed fguillen closed 4 months ago

fguillen commented 4 months ago

I have a player with several quality <source> elements.

I can change them by the controlBar tab. But now I need to change it by code.

I can use the native video.src(url) but this won't change the label in the controlBar and firing the event qualitySelected which I need to happen.

I am missing a setter like:

player.setQuality("quality_label");
yokuze commented 4 months ago

The documentation in the README shows two ways to set the label:

https://github.com/silvermine/videojs-quality-selector?tab=readme-ov-file#using-source

Either of those methods will work.

fguillen commented 4 months ago

Sorry, I'll try to explain it better.

I have all the sources/qualities added to the video element.

What I want is to change from one to another directly from the code. In the same way, I can do it through the selector in the UI.

If I have this video element:

<video id="video_1" class="video-js vjs-default-skin" controls preload="auto" width="640" height="268">
   <source src="https://example.com/video_720.mp4" type="video/mp4" label="720P">
   <source src="https://example.com/video_480.mp4" type="video/mp4" label="480P" selected="true">
   <source src="https://example.com/video_360.mp4" type="video/mp4" label="360P">
</video>

I want, at any moment, to change the quality from 480P to 720P for example. Through script.