¿Cómo implementar el selector de calidad de video para dash.js?
Código HTML:
<script src="https://reference.dashif.org/dash.js/latest/dist/dash.all.debug.js"></script> <video data-dashjs-player autoplay width="100%" height="450" src="https://dash.akamaized.net/akamai/bbb_30fps/bbb_30fps.mpd" controls="true"></video>NOTA: EL ARCHIVO MPEG DASH TIENE MÚLTIPLES BITRATES [1080P, 720P, etc....]
Por favor, cualquier persona con conocimiento en dash.js me ayuda a resolver esto
El reproductor de referencia dash.js en realidad tiene esto incorporado; vea una captura de pantalla a continuación:
Lo anterior está en https://reference.dashif.org/dash.js/nightly/samples/dash-if-reference-player/index.html y el código está aquí: https://github.com/Dash-Industry -Foro/dash.js
La sección que le interese probablemente sea 'contrib/akamai/controlbar/ControlBar.js'; si busca 'bitrateListBtn' en este archivo, puede ver cómo está configurado el botón y los oyentes, etc.
El HTML5 relevante está en: dash.js/contrib/akamai/controlbar/snippet.html. Puede ver cómo se configura el botón de tasa de bits como parte del controlador de video:
<div id="videoController" class="video-controller unselectable"> <div id="playPauseBtn" class="btn-play-pause" title="Play/Pause"> <span id="iconPlayPause" class="icon-play"></span> </div> <span id="videoTime" class="time-display">00:00:00</span> <div id="fullscreenBtn" class="btn-fullscreen control-icon-layout" title="Fullscreen"> <span class="icon-fullscreen-enter"></span> </div> <div id="bitrateListBtn" class="control-icon-layout" title="Bitrate List"> <span class="icon-bitrate"></span> </div> <input type="range" id="volumebar" class="volumebar" value="1" min="0" max="1" step=".01"/> <div id="muteBtn" class="btn-mute control-icon-layout" title="Mute"> <span id="iconMute" class="icon-mute-off"></span> </div> . . .