CODEWITHSUNDEEP
javascriptphpvideo.jsadaptive-bitrate
William Lee
William Lee

Reputation: 1

Why isn't the quality option being included in video.js?

For a couple of hours I've been trying to get video.js to display the quality option just like YouTube for adaptive bitrate streaming, yet every option I've tried has resulted in error.

I'm using Video.js version 8:

<?php
class VideoPlayer {

    private $video;

    public function __construct($video) {
        $this->video = $video;
    }

    public function create($autoPlay) {
        $autoPlayAttr = $autoPlay ? "autoplay" : "";
    
        $filePath = $this->video->getFilePath();

        $dataSetupOptions = json_encode(['autoplay' => $autoPlay]);
    
        echo <<<HTML
        <link href="node_modules/video.js/dist/video-js.min.css" rel="stylesheet">
        <script src="node_modules/video.js/dist/video.min.js"></script>
        <script src="node_modules/@videojs/http-streaming/dist/videojs-http-streaming.js"></script>
        <script src="videojs-hls-quality-selector/dist/videojs-hls-quality-selector.min.js"></script>
        
        <style>
            .video-js {
                max-width: 940px;
                width: 940px;
                padding-top: 56.25%;
                height: 0;
                font-size: 13px;
            }
        </style>
    
        <video id="my-video" class="video-js" $autoPlayAttr controls preload="auto" data-setup='$dataSetupOptions'>
            <source src="$filePath" type="application/x-mpegURL">
        </video>

        <script>
            document.addEventListener('DOMContentLoaded', function() {
                var player = videojs('my-video');
                player.hlsQualitySelector();
            });
        </script>
    HTML;
    }
    

}
?>

Upvotes: 0

Views: 402

Answers (0)

Related Questions