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(
"{CDNLinkToLibrary}"
).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.
📄️ Listening & Progress
We provide several events for listening and progress, primarily an event for whenever the progress of the article changes as well as when the article finishes playing.
📄️ Play, Pause, & Skip
These events can be massively useful for analytics purposes and for building any custom UI you'd like around Speechify's API functionality.
📄️ Voice & Speed
These events encompass a variety of features around voice and speed, and can be particularly useful in logging analytics to see the most popular voices and speeds users are listening with, and ultimately how much users are benefiting from the Speechify API.
📄️ Player Visibility
These events are helpful to know what's visible on the Speechify API to change your UI accordingly.
📄️ Mount & Unmount
These two events can be useful for doing any initial setup and deconstruction when the player is mounted and unmounted, respectively.