​

Sync Audio SDK for iOS: Customization

After you add the SDK using the Quickstart, use this guide to further customize your setup.

Use a secret API key

Aircore uses two types of API keys: publishable and secret. See Authentication for an overview of each.

The Quickstart uses a publishable API key for simplicity. For more detailed security controls, you can use a secret API key instead.

When you use a secret API key, your backend gets session auth tokens from the Aircore provisioning service. These tokens expire.

When using a secret API key, you need to do the following:

  • Request and use a session auth token when you create the client.

  • Update tokens that are about to expire or have expired.

Create the client

Request a session auth token and use this syntax for create():

import AircoreMediaPanel

// Use a session auth token from your backend to create the client.
let client = Client.create(authToken: authToken, userID: userID)

The token determines whether the user can publish audio.

Update expiring and expired tokens

When you receive either of these notifications, replace the token:

Use updateAuthToken() to do this:

client.on(.sessionAuthTokenNearingExpiry) { channelID, userID in
    // Get a new token from your backend and update the client.
    // Make sure to add error handling in case getting the new token fails.
    client.updateAuthToken(token: TOKEN, forChannelID: CHANNEL_ID)
}

client.on(.sessionAuthTokenInvalid) { channelID, userID in
    // Get a new token from your backend and update the client.
    // Make sure to add error handling in case getting the new token fails.
    client.updateAuthToken(token: TOKEN, forChannelID: CHANNEL_ID)
}

You can also change the permissions by updating the token. For example, you can have a user without permission to publish audio join a channel. To give the user permission later, you can provide a new token.

Customize the UI text

Use the MediaPanelConfiguration object to change any text on the panel.

let stringsConfig = MediaPanelConfiguration.Strings(
    joinButton: "Join",
    joiningButton: "Joining...",
    joinButtonTooltip: "Tap Join to start the audio session",
    leaveButton: "Leave",
    retryButton: "Retry",
    emptyCallTitle: "No one is on the call yet.",
    emptyCallSubtitle: "Tap Join below to be the first!",
    channelIsFullLabel: "The channel is full",
    genericErrorLabel: "Something went wrong..."
)

let config = MediaPanelConfiguration(
    ...
    strings: stringsConfig
    ...
)

You can also customize the collapsed and expanded states separately.

To do this, change the properties in CollapsedStateOptions and ExpandedStateOptions.

let config = MediaPanelConfiguration(
    ...
    collapsedStateOptions: MediaPanelConfiguration.CollapsedStateOptions(
        maxAvatars: 3,
        panelTitle: "Collapsed Title",
        panelSubtitle: "Collapsed Subtitle",
        joinButton: "Collapsed Join"
       ...
    ),
    expandedStateOptions: MediaPanelConfiguration.ExpandedStateOptions(
        panelTitle: "Expanded Title",
        panelSubtitle: "Expanded Subtitle",
        joinButton: "Expanded Join"
        ...
    )
    ...
)

Customize the theme

You can create a Theme object to customize elements on the panel.

You can also reuse this object when you create MediaPanel instances.

let myTheme = Theme(
    backgroundColor: UIColor.yellow,
    primaryColor: .blue,
    dangerColor: UIColor.red,
    borderRadius: 24,
    borderWidth: 2,
    borderColor: .green,
    fontFamily: UIFont(name: "Helvetica", size: 14)!,
    textColor: .red,
    subtextColor: UIColor.green,
    primaryContrastColor: .darkGray,
    dangerContrastColor: UIColor.purple,
    avatar: Theme.Avatar(
        background: .cyan,
        borderShape: Theme.BorderShape.circle(),
        spacing: 10
    )
)

Examples

More info