> ## Documentation Index
> Fetch the complete documentation index at: https://developers.vidbeo.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Methods

> The methods exposed by the Player API

<Tip>
  Methods return a
  [Promise](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise).
  As shown below, you can handle the response to see if the request succeeded.
</Tip>

### play()

Play the video.

```javascript theme={null}
player
  .play()
  .then(function () {
    console.log("Success");
  })
  .catch(function (error) {
    console.error("Error", error);
  });
```

### pause()

Pause the video.

```javascript theme={null}
player
  .pause()
  .then(function () {
    console.log("Success");
  })
  .catch(function (error) {
    console.error("Error", error);
  });
```

### ready()

Check if the player is ready.

<Tip>
  You don't need to chain this yourself when calling other methods as we check
  the player is ready internally.
</Tip>

```javascript theme={null}
player
  .ready()
  .then(function () {
    console.log("Success");
  })
  .catch(function (error) {
    console.error("Error", error);
  });
```

### requestFullscreen()

Enter fullscreen mode.

Be aware that if you toggle fullscreen mode using an external button, that button will of course be covered up by the player once it goes fullscreen.

```javascript theme={null}
player
  .requestFullscreen()
  .then(function () {
    console.log("Success");
  })
  .catch(function (error) {
    console.error("Error", error);
  });
```

### exitFullscreen()

Exit fullscreen mode.

```javascript theme={null}
player
  .exitFullscreen()
  .then(function () {
    console.log("Success");
  })
  .catch(function (error) {
    console.error("Error", error);
  });
```

## Getters

These are the methods that return a value.

### getColour()

Get the colour of the player, as a six-character hex. A blank value means the default colour is used. The value is a string.

For example:
`74b9ff`

```javascript theme={null}
player
  .getColour()
  .then(function (data) {
    console.log("Success", data);
  })
  .catch(function (error) {
    console.error("Error", error);
  });
```

### getCurrentTime()

Get the current time. The value is a number in seconds.

For example:
`11.4`

```javascript theme={null}
player
  .getCurrentTime()
  .then(function (data) {
    console.log("Success", data);
  })
  .catch(function (error) {
    console.error("Error", error);
  });
```

### getDuration()

Get the duration of the video, once it's known. It will only be known once the video's metadata is loaded. The value is a number in seconds.

For example:
`12`

```javascript theme={null}
player
  .getDuration()
  .then(function (data) {
    console.log("Success", data);
  })
  .catch(function (error) {
    console.error("Error", error);
  });
```

### getEmbed()

Get an embed code for the video. It is a string which is a snippet of HTML.

```javascript theme={null}
player
  .getEmbed()
  .then(function (data) {
    console.log("Success", data);
  })
  .catch(function (error) {
    console.error("Error", error);
  });
```

### getEnded()

Check if the video has ended. This is a boolean.

For example:
`false`

```javascript theme={null}
player
  .getEnded()
  .then(function (data) {
    console.log("Success", data);
  })
  .catch(function (error) {
    console.error("Error", error);
  });
```

### getFullscreen()

Check if the video is fullscreen. This is a boolean.

For example:
`false`

```javascript theme={null}
player
  .getFullscreen()
  .then(function (data) {
    console.log("Success", data);
  })
  .catch(function (error) {
    console.error("Error", error);
  });
```

### getHeight()

Get the height of the video (not the height it is embeddeed at). This is a number.

It is only known once the video's metadata has downloaded.

For example:
`720`

```javascript theme={null}
player
  .getHeight()
  .then(function (data) {
    console.log("Success", data);
  })
  .catch(function (error) {
    console.error("Error", error);
  });
```

### getId()

Get the ID of the embedded video. This is a string.

For example:
`abcdefgh1234567`

```javascript theme={null}
player
  .getId()
  .then(function (data) {
    console.log("Success", data);
  })
  .catch(function (error) {
    console.error("Error", error);
  });
```

### getLoop()

Check if the video is set to loop (restart when it ends). This is a boolean.

For example:
`false`

```javascript theme={null}
player
  .getLoop()
  .then(function (data) {
    console.log("Success", data);
  })
  .catch(function (error) {
    console.error("Error", error);
  });
```

### getMuted()

Check if the video is muted. This is a boolean.

For example:
`false`

```javascript theme={null}
player
  .getMuted()
  .then(function (data) {
    console.log("Success", data);
  })
  .catch(function (error) {
    console.error("Error", error);
  });
```

### getPaused()

Check if the video is paused. This is a boolean.

For example:
`false`

```javascript theme={null}
player
  .getPaused()
  .then(function (data) {
    console.log("Success", data);
  })
  .catch(function (error) {
    console.error("Error", error);
  });
```

### getPlaybackRate()

Get the playback rate. It's returned as a number. The default is 1 (meaning 1x). The range is 0.5 to 2.

For example:
`0.5`

```javascript theme={null}
player
  .getPlaybackRate()
  .then(function (data) {
    console.log("Success", data);
  })
  .catch(function (error) {
    console.error("Error", error);
  });
```

### getPlayed()

Get the time period(s) during which the video has been played. This is a 2D array. All values are in seconds.

For example:
`[[0,4.367],[6,8.738]]`

```javascript theme={null}
player
  .getPlayed()
  .then(function (data) {
    console.log("Success", data);
  })
  .catch(function (error) {
    console.error("Error", error);
  });
```

### getProgress()

Get the part(s) of the video that have been buffered. The data is returned as a 2D array with the values in seconds.

For example:
`[[0,8]]`

```javascript theme={null}
player
  .getBuffered()
  .then(function (data) {
    console.log("Success", data);
  })
  .catch(function (error) {
    console.error("Error", error);
  });
```

### getQualities()

Get the available qualities/renditions. At a minimum there is an "auto" quality however once the video's metadata is loaded and so the qualities are known, you may want to manually set a particular quality to be used. You would send one of these values. Each value is a string.

For example:
`["360p","720p","1080p","auto"]`

```javascript theme={null}
player
  .getQualities()
  .then(function (data) {
    console.log("Success", data);
  })
  .catch(function (error) {
    console.error("Error", error);
  });
```

### getQuality()

Get the currently selected quality/rendition. The default value is "auto" which means it is left up to the player to decide the quality (depending on the connection speed). However you may have manually selected a particular quality. The value is returned as a string.

For example:
`"720p"`

```javascript theme={null}
player
  .getQuality()
  .then(function (data) {
    console.log("Success", data);
  })
  .catch(function (error) {
    console.error("Error", error);
  });
```

### getSeekable()

Get the time period(s) that are seekable within. This is a 2D array with each element being an array of *\[start,end]*. All values are in seconds.

For example:
`[[0,11.4]]`

```javascript theme={null}
player
  .getSeekable()
  .then(function (data) {
    console.log("Success", data);
  })
  .catch(function (error) {
    console.error("Error", error);
  });
```

### getSeeking()

Is the video *currently* seeking? The value is a boolean.

For example:
`false`

```javascript theme={null}
player
  .getSeeking()
  .then(function (data) {
    console.log("Success", data);
  })
  .catch(function (error) {
    console.error("Error", error);
  });
```

### getTracks()

Get the available subtitle/closed caption tracks. This is an array of objects. If the video does not have any tracks, it will be empty.

For example:
`[{"id":"abcdefgh1234567","kind":"captions","language":"en","label":"English","mode":"disabled"}]`

```javascript theme={null}
player
  .getTracks()
  .then(function (data) {
    console.log("Success", data);
  })
  .catch(function (error) {
    console.error("Error", error);
  });
```

### getTitle()

Get the title of the embedded video. It is a string.

For example:
`"Example video"`

```javascript theme={null}
player
  .getTitle()
  .then(function (data) {
    console.log("Success", data);
  })
  .catch(function (error) {
    console.error("Error", error);
  });
```

### getUrl()

Get a URL to the video that can be shared or emailed. It is a string.

For example:
`"https://watch.vidbeo.com/abcdefghiklmnop"`

```javascript theme={null}
player
  .getUrl()
  .then(function (data) {
    console.log("Success", data);
  })
  .catch(function (error) {
    console.error("Error", error);
  });
```

### getVolume()

Get the current volume. It is returned as a number between 0 and 1.

For example:
`0.3`

```javascript theme={null}
player
  .getVolume()
  .then(function (data) {
    console.log("Success", data);
  })
  .catch(function (error) {
    console.error("Error", error);
  });
```

### getWidth()

Get the width of the video. This is only known once the video's metadata has been downloaded. It is returned as a number.

For example:
`1920`

```javascript theme={null}
player
  .getWidth()
  .then(function (data) {
    console.log("Success", data);
  })
  .catch(function (error) {
    console.error("Error", error);
  });
```

## Setters

For these methods you need to pass a value as its parameter.

### setColour(colour: String)

Set the colour of the player. We generally use a neutral look which works well on most sites but you can apply an accent colour. It should be a six-character string using the hex format.

For example:
`00ffff`

Any returned data parameter will simply echo back the same colour.

```javascript theme={null}
player
  .setColour("00ffff")
  .then(function (data) {
    console.log("Success", data);
  })
  .catch(function (error) {
    console.error("Error", error);
  });
```

### setCurrentTime(time: Float)

Seek to a particular time. The value should be a time in seconds. It must be greater than 0, and less than the duration of the video

For example:
`7`

Any returned data parameter will simply echo back the same time.

```javascript theme={null}
player
  .setCurrentTime(7)
  .then(function (data) {
    console.log("Success", data);
  })
  .catch(function (error) {
    console.error("Error", error);
  });
```

### setLoop(loop: Boolean)

Set whether the video should loop when it ends. The value should be a boolean.

For example:
`true`

Any returned data parameter will simply echo back the same value.

```javascript theme={null}
player
  .setLoop(true)
  .then(function (data) {
    console.log("Success", data);
  })
  .catch(function (error) {
    console.error("Error", error);
  });
```

### setMuted(muted: Boolean)

Set whether the video should be muted. The value should be a boolean.

For example:
`true`

Any returned data parameter will simply echo back the same value.

```javascript theme={null}
player
  .setMuted(true)
  .then(function (data) {
    console.log("Success", data);
  })
  .catch(function (error) {
    console.error("Error", error);
  });
```

### setPlaybackRate(rate: Float)

Set the playback speed. Since browsers do not reliably support some speeds, currently the value should be one of these numbers: *0.5*, *1*, *1.5*, *2*.

For example:
`1.5`

Any returned data parameter will simply echo back the same value.

```javascript theme={null}
player
  .setPlaybackRate(1.5)
  .then(function (data) {
    console.log("Success", data);
  })
  .catch(function (error) {
    console.error("Error", error);
  });
```

### setQuality(quality: String)

Set the quality. The default is "auto" which leaves the player to optimise the quality based on the available connection speed. However you can manually set a quality (from those available, as reported by *getQualities()*) such as "1080p" to override that.

For example:
`1080p`

Any returned data parameter will simply echo back the same value.

```javascript theme={null}
player
  .setQuality("1080p")
  .then(function (data) {
    console.log("Success", data);
  })
  .catch(function (error) {
    console.error("Error", error);
  });
```

### setVolume(volume: Float)

Set the volume. It should be a number between 0 and 1.

For example:
`0.5`

Any returned data parameter will simply echo back the same value.

```javascript theme={null}
player
  .setVolume(0.5)
  .then(function (data) {
    console.log("Success", data);
  })
  .catch(function (error) {
    console.error("Error", error);
  });
```

## Event listener

To listen for one of the [events](/player-api/v1/reference/events) use the *on* method to register a callback function and the *off* method to remove it.

<Tip>Unlike the methods above, these do not return a *Promise*.</Tip>

### on(event: String, callback: Function)

Here we are listening for the *playing* event. The second parameter needs to be a function. That is the callback which is run when that event is fired:

```javascript theme={null}
player.on("playing", function (data) {
  console.log("playing", data);
});
```

### off(event: String, callback: Function)

Here we are no longer listening for the *playing* event and want to remove *all* callbacks:

```javascript theme={null}
player.off("playing");
```

If you want to remove a specific callback function, pass that function as the optional second parameter:

```javascript theme={null}
const onPlaying = function (data) {
  console.log("playing", data);
};
player.off("playing", onPlaying);
```

Find out all of the possible [events](/player-api/v1/reference/events).