mirror of
https://github.com/discordjs/discord.js.git
synced 2026-03-11 09:03:29 +01:00
* feat: initial attempt at porting legacy guide * feat: completion of legacy guide backport * chore: lockfile shenanigans * fix: handle svgs * fix: replace svg with mermaid integration * chore: format * chore: remove unnecssary bullet * chore: cleanup code highlights * chore: explicit return * chore: move display components after interactive components in sidebar * chore: voice * top link should be installation * add docs link to sidebar * feat: subguide-based accent styles * chore: don't list faq twice * chore: mention display components in interactive components * fix: remove unoccs/order rule from guide * chore: redirect to legacy guide instead of /guide root * refactor: use `<kbd>` * refactor: more kbd use * Update apps/guide/content/docs/legacy/app-creation/handling-events.mdx Co-authored-by: Naiyar <137700126+imnaiyar@users.noreply.github.com> * chore: fix typos Co-authored-by: Qjuh <76154676+Qjuh@users.noreply.github.com> * chore: fix typos * chore: fix links regarding secret stores across coding platforms * chore: fix typo * chore: link node method directly Co-authored-by: Qjuh <76154676+Qjuh@users.noreply.github.com> * chore: typos Co-authored-by: Vlad Frangu <me@vladfrangu.dev> * chore: typo Co-authored-by: Vlad Frangu <me@vladfrangu.dev> * fix: prevent v14 changes from being listed twice * chore: prefer relative links * chore: missed link conversion * chore: missed link conversion * chore: fix link * chore: remove legacy code highlight markers * chore: rephrase and extend contributing guidelines * feat(setup): suggest cli flag over dotenv package * chore: move introduction in sidebar better navigation experience if the 'next page' in intro refers to getting started vs. updating/faq * fix: replace outdated link * fix: update voice dependencies * chore: update node install instructions * fix: list in missing access callout * chore: match bun env file format * chore: restore ffmpeg disclaimer * fix: lockfile conflict * chore: action row typo Co-authored-by: Vlad Frangu <me@vladfrangu.dev> * chore: no longer use at-next for pino --------- Co-authored-by: Jiralite <33201955+Jiralite@users.noreply.github.com> Co-authored-by: Qjuh <76154676+Qjuh@users.noreply.github.com> Co-authored-by: Naiyar <137700126+imnaiyar@users.noreply.github.com> Co-authored-by: Vlad Frangu <me@vladfrangu.dev>
70 lines
2.6 KiB
Plaintext
70 lines
2.6 KiB
Plaintext
---
|
||
title: Life Cycles
|
||
---
|
||
|
||
Two of the main components that you'll interact with when using `@discordjs/voice` are:
|
||
|
||
- **VoiceConnection** – maintains a network connection to a Discord voice server
|
||
- **AudioPlayer** – plays audio resources across a voice connection
|
||
|
||
Both voice connections and audio players are _stateful_, and you can subscribe to changes in their state as they progress through their respective life cycles.
|
||
|
||
It's important to listen for state change events, as they will likely require you to take some action. For example, a voice connection entering the `Disconnected` state will probably require you to attempt to reconnect it.
|
||
|
||
Their individual life cycles with descriptions of their states are documented on their respective pages.
|
||
|
||
Listening to changes in the life cycles of voice connections and audio players can be done in two ways:
|
||
|
||
## Subscribing to individual events
|
||
|
||
```js
|
||
const { VoiceConnectionStatus, AudioPlayerStatus } = require('@discordjs/voice');
|
||
|
||
connection.on(VoiceConnectionStatus.Ready, (oldState, newState) => {
|
||
console.log('Connection is in the Ready state!');
|
||
});
|
||
|
||
player.on(AudioPlayerStatus.Playing, (oldState, newState) => {
|
||
console.log('Audio player is in the Playing state!');
|
||
});
|
||
```
|
||
|
||
<Callout>
|
||
One advantage of listening for transitions to individual states is that it becomes a lot easier to write sequential logic. This is made easy using our [state transition helper](https://github.com/discordjs/discord.js/blob/main/packages/voice/src/util/entersState.ts). An example is shown below.
|
||
|
||
```js
|
||
const { AudioPlayerStatus, entersState } = require('@discordjs/voice');
|
||
|
||
async function start() {
|
||
player.play(resource);
|
||
try {
|
||
await entersState(player, AudioPlayerStatus.Playing, 5_000);
|
||
// The player has entered the Playing state within 5 seconds
|
||
console.log('Playback has started!');
|
||
} catch (error) {
|
||
// The player has not entered the Playing state and either:
|
||
// 1) The 'error' event has been emitted and should be handled
|
||
// 2) 5 seconds have passed
|
||
console.error(error);
|
||
}
|
||
}
|
||
|
||
void start();
|
||
```
|
||
|
||
</Callout>
|
||
|
||
## Subscribing to all state transitions
|
||
|
||
If you would prefer to keep a single event listener for all possible state transitions, then you can also listen to the `stateChange` event:
|
||
|
||
```js
|
||
connection.on('stateChange', (oldState, newState) => {
|
||
console.log(`Connection transitioned from ${oldState.status} to ${newState.status}`);
|
||
});
|
||
|
||
player.on('stateChange', (oldState, newState) => {
|
||
console.log(`Audio player transitioned from ${oldState.status} to ${newState.status}`);
|
||
});
|
||
```
|