public class | source

Player

Direct Subclass:

NetflixPlayer, SoundCloudPlayer, SpotifyPlayer, TidalPlayer, YouTubeMusicPlayer, YouTubePlayer

A class that wraps around HTMLMediaElement

It sends to the Host all relevant media events (ie: play, pause, etc)

This class should be extended in order to give provider specific support. By default all getter and setters interact with the media element, this can be overwritten by extending this class so it gets and sets by interacting with the relevant places for each provider.

Test:

Player tests

Constructor Summary

Public Constructor
public	constructor(page: Page, host: Host, element: HTMLMediaElement) Create a new instance of player

Member Summary

Public Members
public	URL: Object A URL with the media baseURI It's updated in refresh whenever metadata changes
public	element: HTMLMediaElement The media element
public	host: Host The Host to communicate with
public	page: Page The Page that holds the player

Method Summary

Public Methods
public	getArtists(): Array<string> Get the artists of the player
public	getCover(): string Get the cover of the player.
public	getId(): null \| string Get the id of the player
public	getLength(): number Length is expected in microseconds by host
public	getPosition(): number Get the current time of the media
public	getRate(): number Get the playback rate
public	getSiteDomain(): string Get the site domain (host)
public	getTitle(): null \| string Get the title of the player.
public	getUrl(): null \| string Get the elements url
public	getVolume(): number If media is muted return 0
public	initDefaultMediaListeners() Add listeners on this.element so we propagate all necessary events to the this.host
public	isHidden(): boolean Check if element is visible to the user
public	isLooping(): boolean Is the media looping?
public	isMuted(): boolean Is the media muted?
public	isPaused(): boolean Returns true if the media is paused.
public	isPlaying(): boolean Returns true if the media is not paused
public	isStopped(): boolean Return true if the media is paused and current time is 0.
public	isValid(): boolean
public	pause() Pause media element
public	play(): * Play media element
public	playPause() If media is playing then pause else play it
public	refresh() Update this.URL so getter read the correct data.
public	seek(offset: number) seek by an offset to position
public	setLoop(loop: boolean) Should media loop when it reaches the end.
public	setPosition(position: number) Set the position of playback
public	setRate(rate: number) Set the playback rate
public	setVolume(volume: number) Set the volume of the media
public	stop() Pause media and set position to 0
public	toggleFullScreen() Toogle the fullscreen state of the media.

Public Constructors

public constructor(page: Page, host: Host, element: HTMLMediaElement) source

Create a new instance of player

Params:

Name	Type	Attribute	Description
page	Page
host	Host
element	HTMLMediaElement

Public Members

public URL: Object source

A URL with the media baseURI It's updated in refresh whenever metadata changes

public element: HTMLMediaElement source

The media element

public host: Host source

The Host to communicate with

public page: Page source

The Page that holds the player

Public Methods

public getArtists(): Array<string> source

Get the artists of the player

Return:

Array<string>

Test:

Player tests The artists are parsed correctly from the url

public getCover(): string source

Get the cover of the player.

Using logo.clearbit.com API seems to work quite nicely. The other alternative is to get the logo from the page's favicon ({@link this.page.getIcon()})