Quickstart

This quickstart guide covers the basic setup of atmoky Engage by setting up a Space, joining a Room and publishing a local microphone track. With that you'll be able to hear other remote participants and be heard by them, both with atmoky's spatial audio rendering.

Prerequisites

Before you can start using atmoky Engage you'll need to have a few things in place.

☑️ Project Setup

This guide assumes you have a node project set up. All the code examples are written in TypeScript, but atmoky Engage can be used with plain JavaScript as well.

☑️ Engage Client SDK Installation

npm install @atmokyaudio/engage-client

Currently, atmoky Engage is only available from a private npm registry. To install it, you'll need to have a valid npm token. Please see Installation for more information.

☑️ Access Token

To be able to join a Room, you'll need to create an access token with the correct grants set. See the Token Creation section to learn how to create an access token.

Setting up the Space

import { Space, SpaceEvent } from "@atmokyaudio/engage-client";
 
// setup space
const space = new Space();
 
space.on(SpaceEvent.RoomConnected, (room) => {
    console.log(`Connected to room ${room.name}. Publishing microphone...`);
    room.localParticipant.setMicrophoneEnabled(true).then(() => {
        console.log("Microphone published.");
    });
});

This sets up a new Space instance and registers a listener for the RoomConnected event. This event is fired when the Space successfully connects to a Room and the local microphone can be published.

Joining a room on user-interaction

const joinButton = document.getElementById("joinButton");
 
joinButton.addEventListener("click", async () => {
    space.resumeAudio();
 
    const URL = "<serverURL>";
    const TOKEN = "<token>"; // make sure to fetch the token from your backend in production
 
    const room = space.joinRoom(URL, TOKEN);
});

This section expects a single button with the id joinButton to be present in the HTML document.

<button id="joinButton">Join Room</button>

This code snippet sets up a click listener on the joinButton and joins a Room when the button is clicked. It also calls space.resumeAudio() to make sure that the audio context is resumed.

Browsers usually only allow audio playback after a user interaction. This is why we need to call space.resumeAudio() in a click handler.