Picture-in-picture

Picture-in-picture state and actions for the player store

Controls picture-in-picture mode.

State

State	Type	Description
`pip`	`boolean`	Whether picture-in-picture is active
`pipAvailability`	`MediaFeatureAvailability`	Whether PiP is supported

Actions

Action	Description
`requestPictureInPicture()`	Enter picture-in-picture (returns a `Promise`)
`exitPictureInPicture()`	Exit picture-in-picture (returns a `Promise`)

Selector

Pass selectPiP to PlayerController to subscribe to picture-in-picture state. Returns undefined if the PiP feature is not configured.

import { createPlayer, MediaElement, selectPiP } from '@videojs/html';
import { videoFeatures } from '@videojs/html/video';

const { PlayerController, context } = createPlayer({ features: videoFeatures });

class PiPButton extends MediaElement {
  readonly #pip = new PlayerController(this, context, selectPiP);
}

API Reference

Parameters

Parameter	Type	Default	Details
`state*`	`object`	`—`

Return Value

MediaPictureInPictureState | undefined