Class that encapsulates the work that needs to be done to render a MediaOverlay
.
To create custom overlays, create a new class that extends this,
and register it with the media player. Then, create a MediaOverlay
object with your newly registered overlay type and any custom parameters,
and add it to a MediaUnit
.
Constructor
new OverlayController(overlay) → {OverlayController}
Constructs a new OverlayController
instance.
Parameters:
-
overlay
( MediaOverlay )The owner overlay instance.
Example
class CustomOverlayController extends OverlayController {
load() {
// Set the overlay's width and height
this.overlay.width = 'auto';
this.overlay.height = 'auto';
// Create an image
this.imageView = document.createElement('img');
this.imageView.src = imageUrl;
// Add the image to the overlay's element
this.view.appendChild(this.imageView);
}
}
player.controllerRegistry.registerOverlayController(CustomOverlayController, 'customc');
const unit = new MediaUnit(videoUrl);
const overlay = new MediaOverlay('customc');
unit.addOverlay(overlay);
Members
overlay :MediaOverlay
The MediaOverlay
object that owns this controller.
(readonly) view :HTMLElement
The HTML div that this controller can manipulate.
This is automatically positioned on top of the player
active area depending on settings in the MediaOverlay
.
(readonly) wasAddedToDOM :boolean
Has the controller view been attached to the browser DOM?
Methods
(async) .load()
Method that gets invoked when the overlay starts running.
Override this in your OverlayController
extension to do the work
that needs to be done when your overlay needs to be displayed during
media playback.
(async) .overlayWillBeRemoved()
Method that gets invoked before the overlay is removed from
rendering. Override this in your OverlayController
extension
to do cleanup work when the overlay is done displaying.
(async) .preload()
Method that gets invoked when the overlay starts preloading.
Override this in your OverlayController
extension to do the work
that needs to be done when your overlay gets preloaded during
media playback.
(async) .update()
Method that gets invoked every second, while the overlay is
displayed. Override this in your OverlayController
extension
to do recurring work or update the view elements displayed.