Implementé la función de imagen en imagen para mi proyecto web en angular.

Este es el componente básico para ello.

 export class PlayerPipComponent implements OnInit { @Input() video!: HTMLVideoElement; isPlayerErrorOpen = false; constructor(@Inject(DOCUMENT) private document: Document, private dialog: MatDialog) {} ngOnInit(): void {} async togglePip(): Promise<void> { try { if (this.document.pictureInPictureEnabled) { if (this.video !== this.document.pictureInPictureElement) { await this.video.requestPictureInPicture(); } else { await this.document.exitPictureInPicture(); } } else { this.showGeneralError('000', "This browser doesn't have Picture in Picture enabled."); } } catch (error) { console.log('Error', error); this.showGeneralError('000', error); } }

Estaba tratando de agregar los controles para la búsqueda hacia adelante y hacia atrás, pero por alguna razón parece que no funcionan. Pero los controles de pista anterior y pista siguiente funcionan bien.

 navigator.mediaSession.setActionHandler('previoustrack', (details) => { // Go to previous track console.log('previostrack', details); }); navigator.mediaSession.setActionHandler('nexttrack', (details) => { // Go to next track console.log('nextrack', details); });

Solo agregando estas pocas líneas, muestra los controles en la imagen en imagen. Pero si agrega estos siguientes, no muestra los controles de búsqueda hacia atrás o hacia adelante.

 navigator.mediaSession.setActionHandler('seekbackward', function (details) { // Do something }); navigator.mediaSession.setActionHandler('seekforward', function (details) { //Do something });

¿Alguien sabe si simplemente no son compatibles? O si pudieras indicarme que estoy haciendo mal te lo agradeceria mucho.