Skip to main content

Events Introduction

Events are added using the addEventListener method on the Speechify API widget object. This method looks like:

SpeechifyWidget.addEventListener((event: SpeechifyExperienceEvent, playerState?: PlayerState) => void)

Example

Here's an example that listens to play and pause events and logs to the console accordingly:

import(
"https://storage.googleapis.com/speechify-api-cdn/speechifyapi.min.mjs"
).then(async (speechifyWidget) => {
// initialize and mount the widget
const widget = speechifyWidget.makeSpeechifyExperience({
rootElement: document.getElementById("article"),
useSpeechifyRoot: true,
});
await widget.mount();

// log to the console whenever the article is played or paused
widget.addEventListener((event, playerState) => {
if(event.type === 'play') {
console.log("The Speechify API is playing.");
}
else if(event.type === 'pause') {
console.log("The Speechify API was paused.");
}
});

});

Event Object

The event object passed into each callback is the SpeechifyPlayerState object, which is documented on the Player State page.

This object includes useful information like whether the player is playing or paused, the current audio progress, and whether the player is visible.

Available Events

Below are links to all the events that can be listened to in the Speechify API.