Getting Started

Contents

This guide provides you with an overview of the key objects you'll use in the Programmable Video API to build your video application with the Twilio Programmable Video iOS SDK.

Note: If you haven’t already done so, then take a look at the Twilio Video iOS QuickStart Application [Swift, Objective-C]. Once you've played with the QuickStart, come back to this guide for more detail on how to add video to your own app.

If you’ve worked with WebRTC in the past, you’ll find that Programmable Video provides a simple wrapper around WebRTC’s lower-level APIs to make it easy to build rich audio and video applications. You can still access lower-level primitives, but that’s not required to get started.

Additionally, Programmable Video provides the missing pieces required to use WebRTC to build sophisticated applications: Global STUN/TURN relays, media services for large-scale group conferences and recording, and signaling infrastructure are all included.

Video API overview

Let’s start with an overview of the Programmable Video API:

  • A Room represents a real-time audio, video, and/or screen-share session, and is the basic building block for a Programmable Video application.
  • In a Peer-to-peer Room, media flows directly between participants. Supports up to 10 participants in a mesh topology.
  • In a Group Room, media is routed through Twilio's Media Servers. Supports up to 50 participants.
  • Participants represent client applications that are connected to a Room and sharing audio and/or video media with one another.
  • Tracks represent the individual audio and video media streams that are shared within a Room.
  • LocalTracks represent the audio and video captured from the local microphone and camera.
  • RemoteTracks represent the audio and video tracks from other participants connected to the Room.

The following code samples illustrate common tasks that you as a developer may wish to perform related to a Room and its Participants.

Prerequisites

To start using the iOS Programmable Video SDK in your apps, you need to perform a few basic tasks first.

1. Get the Programmable Video iOS SDK

The iOS Video framework can be installed using CocoaPods or manually, as you prefer.

CocoaPods
source 'https://github.com/CocoaPods/Specs'

platform :ios, '8.1'

target 'TARGET_NAME' do
    pod 'TwilioVideo', '~> 1.0'
end

Then run pod install to install the dependencies to your project.

Note: As of 1.0.0 we are now publishing exclusively to the CocoaPods Master Spec Repo. Older 1.0.0-beta releases can be found in Twilio's CocoaPods Spec Repo.

Manual

TwilioVideo.framework is distributed as a dynamic iOS framework that you can drag and drop into your existing projects.

Download the Video framework here

Once you've downloaded and unpacked the framework, navigate to your Xcode project's General settings page. Drag and drop TwilioVideo.framework onto the Embedded Binaries section. Ensure that "Copy items if needed" is checked and press Finish. This will add TwilioVideo.framework to both the Embedded Binaries and Linked Frameworks and Libraries sections.

Next, you will need to open your project's Linked Frameworks and Libraries configuration. You should see the TwilioVideo.framework there already. Add the following frameworks to that list:

  • AudioToolbox.framework
  • VideoToolbox.framework
  • AVFoundation.framework
  • CoreTelephony.framework
  • GLKit.framework
  • CoreMedia.framework
  • SystemConfiguration.framework
  • libc++.tbd

In your Build Settings, you will also need to modify "Other Linker Flags" to include -ObjC.

Before distributing your app to the  App Store, you will need to strip the simulator binaries from the embedded framework. Navigate to your target's Build Phases screen and create a new "Run Script Phase". Ensure that this new run script phase is after the Embed Frameworks phase. Paste the following command in the script text field:

/bin/bash "${BUILT_PRODUCTS_DIR}/${FRAMEWORKS_FOLDER_PATH}/TwilioVideo.framework/remove_archs"
Supported Devices

The iOS SDK supports iOS 8.1 or higher. It is built for armv7, arm64, x86 and x86_64 architectures with Bitcode slices for armv7 and arm64 devices. Devices based on the A5 SoC (iPhone 4s, iPad 2, iPad Mini 1, iPod Touch 5G) are not supported, and the SDK will not perform well on them.

2. Get an API Key

API Keys represent credentials to access the Twilio API. They are used for two purposes:

For the purposes of this guide, we will create our API Key from the Twilio Console.

  • Go to the API Keys section under Tools in the Twilio Console.
  • Click on “Create a New API Key”, add a friendly name and save your Key and Secret.

3. Generate an Access Token

To execute the code samples below, you can use the Testing Tools page in the Twilio Console to generate an Access Token. An Access Token is a short-lived credential used to authenticate your client-side application to Twilio.

In a production application, your back-end server will need to generate an Access Token for every user in your application. An Access Token is a short-lived credential used to authenticate your client-side application to Twilio. Visit the User Identity and Access Token guide to learn more.

Connect to a Room

Call TwilioVideo.connect() to connect to a Room from your iOS application. Once connected, you can send and receive audio and video streams with other Participants who are connected to the Room.

@IBAction func createARoom(sender: AnyObject) {
    let connectOptions = TVIConnectOptions.init(token: accessToken) { (builder) in
        builder.roomName = "my-room"
    }
    room = TwilioVideo.connect(with: connectOptions, delegate: self)
}

// MARK: TVIRoomDelegate

func didConnectToRoom(room: TVIRoom) {
    print("Did connect to Room")
}

You must pass the Access Token when connecting to a Room. You may also optionally pass the following:

  • Local audio or video tracks, to begin sharing pre-created local media with other Participants in the Room upon connecting.
  • A room name, which allows you to dynamically specify the name of the Room you wish to join. (Note: You can also encode the Room name in the Access Token, which will allow the user to connect to only the Room specified in the token.)
  • An ICE transport policy, which allows you to force calls through TURN relay for testing purposes.

The name of the Room specifies which Room you wish to join. If a Room by that name does not already exist, it will be created upon connection. If a Room by that name is already active, you'll be connected to the Room and receive notifications from any other Participants also connected to the same Room. Room names must be unique within an account.

You can also create a Room using the Rooms REST API. Look at the REST API Rooms resource docs for more details.

Example: Create a Room called DailyStandup

 curl -XPOST 'https://video.twilio.com/v1/Rooms' \
 -u '{API Key SID}:{API Secret}' \
 -d 'UniqueName=DailyStandup'

Note: If you don’t specify a Type attribute, then Twilio will create a Group Room by default.

Default Room Settings

You can also set the room type from the Room Settings page in the Twilio Video Console. Twilio will use the room type set on Room Settings page, when you create a room from the client-side or the REST API.

Note: Twilio will set the Room Type as Group by default on the Room Settings page.

Once a Room is created, Twilio will fire a room-created webhook event, if the StatusCallback URL is set. You can set the StatusCallback URL on the Room Settings page, if you want create a room from the client-side. If you create a room using the REST API, then you need to provide a StatusCallback URL while creating the room.

 curl -XPOST 'https://video.twilio.com/v1/Rooms' \
 -u '{API Key SID}:{API Secret}' \
 -d 'UniqueName=DailyStandup' \
 -d 'StatusCallback=https://hooks.yoursite.com/room-events' \
 -d 'StatusCallbackMethod=POST' \
 -d 'Type=group'

Enabling Room Recordings

Recordings can be enabled only on Group Rooms. Set Recordings to Enabled to record participants when they connect to a Group Room. Recordings can also be enabled on Group Rooms through via the Rest API at Room creation time by setting the RecordParticipantsOnConnect property to true.

curl -XPOST 'https://video.twilio.com/v1/Rooms' \
-u 'SKXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX:your_api_key_secret' \
-d 'UniqueName=DailyStandup' \
-d 'Type=group' \
-d 'RecordParticipantsOnConnect=true' \
-d 'StatusCallback=http://example.org'

Join a Room

If you'd like to join a Room you know already exists, you handle that exactly the same way as creating a room: just pass the Room name to the connect method. Once in a Room, you'll receive a room:participantDidConnect: callback for each Participant that successfully joins. Querying the participants getter will return any existing Participants who have already joined the Room.

@IBAction func joinRoom(sender: AnyObject) {
    let connectOptions = TVIConnectOptions.init(block: { (builder) in
        builder.roomName = "existing-room"
    })
    room = TwilioVideo.connect(with: connectOptions, delegate: self)
}

// MARK: TVIRoomDelegate

func didConnectToRoom(room: TVIRoom) {
    print("Did connect to room")
}

Setup local media

You can capture local media from your device's microphone, camera or screen-share on different platforms in the following ways:

In an iOS application, begin capturing audio data by creating a TVILocalAudioTrack, and begin capturing video by creating a TVILocalVideoTrack with an associated TVIVideoCapturer. The iOS Video SDK provides customizable video capturers for both camera and screen capture.

// Create an audio track
var localAudioTrack = TVILocalAudioTrack()

// Create a Capturer to provide content for the video track
var localVideoTrack : TVILocalVideoTrack?

// Create a video track with the capturer.
if let camera = TVICameraCapturer(source: .frontCamera) {
    localVideoTrack = TVILocalVideoTrack.init(capturer: camera)
}

Specify tracks at connect time

When the client joins a Room, the client can specify which Tracks they wish to share with other Participants. Imagine we want to share the audio and video Tracks we created earlier.

let connectOptions = TVIConnectOptions.init(token: accessToken) { (builder) in
    builder.roomName = "my-room"

    if let audioTrack = localAudioTrack {
        builder.audioTracks = [ audioTrack ]
    }
    if let videoTrack = localVideoTrack {
        builder.videoTracks = [ videoTrack ]
    }
}

var room = TwilioVideo.connect(with: connectOptions, delegate: self)

Working with Remote Participants

Handle Connected Participants

When you join a Room, Participants may already be present. You can check for existing Participants in the roomDidConnect: callback by using the participants getter.

room = TwilioVideo.connect(with: connectOptions, delegate: self)

// MARK: TVIRoomDelegate

func didConnect(to room: TVIRoom) {
    // The Local Participant
    if let localParticipant = room.localParticipant {
        print("Local identity \(localParticipant.identity)")
    }

    // Connected participants
    let participants = room.participants;
    print("Number of connected Participants \(participants.count)")
}

func room(_ room: TVIRoom, participantDidConnect participant: TVIRemoteParticipant) {
    print ("Participant \(participant.identity) has joined Room \(room.name)")
}

func room(_ room: TVIRoom, participantDidDisconnect participant: TVIRemoteParticipant) {
    print ("Participant \(participant.identity) has left Room \(room.name)")
}

Handle Participant Connection Events

When Participants connect to or disconnect from a Room that you're connected to, you'll be notified via an event listener: Similar to Room Events, Twilio will fire Participant events if the StatusCallback webhook URL is set when the Room is created. These events help your application keep track of the participants who join or leave a Room.

// MARK: TVIRoomDelegate

// First, we set a Participant Delegate when a Participant first connects:
func room(_ room: TVIRoom, participantDidConnect participant: TVIParticipant) {
    print("Participant connected: \(participant.identity!)")
    participant.delegate = self
}

Display a Remote Participant's Video

To see the Video Tracks being sent by remote Participants, we need to render them to the screen:

// MARK: TVIParticipantDelegate

/* 
 * In the Participant Delegate, we can respond when the Participant adds a Video
 * Track by rendering it on screen.
 */
func participant(_ participant: TVIParticipant, addedVideoTrack videoTrack: TVIVideoTrack) {
    print("Participant \(participant.identity) added video track")

    self.remoteView = TVIVideoView(frame: self.view.bounds, delegate: self)
    videoTrack.addRenderer(self.remoteView)

    self.view.addSubview(self.remoteView!)
}

// MARK: TVIVideoViewDelegate

// Lastly, we can subscribe to important events on the VideoView
func videoView(_ view: TVIVideoView, videoDimensionsDidChange dimensions: CMVideoDimensions) {
    print("The dimensions of the video track changed to: \(dimensions.width)x\(dimensions.height)")
    self.view.setNeedsLayout()
}

Participating in a Room

Display a Camera Preview

Sometimes you need to make sure you're looking fantastic before entering a Room. We get it. The iOS SDK provides a means to render a local camera preview outside the context of an active Room:

// Use TVICameraCapturer to produce video from the device's front camera.

if let camera = TVICameraCapturer(source: .frontCamera),
    let videoTrack = TVILocalVideoTrack(capturer: camera) {

    // TVIVideoView is a TVIVideoRenderer and can be added to any TVIVideoTrack.
    let renderer = TVIVideoView(frame: view.bounds)

    // Add renderer to the video track
    videoTrack.addRenderer(renderer)

    self.localVideoTrack = videoTrack
    self.camera = camera
    self.view.addSubview(renderer)
} else {
    print("Couldn't create TVICameraCapturer or TVILocalVideoTrack")
}

Disconnect from a Room

You can disconnect from a Room you're currently participating in. Other Participants will receive a participantDisconnected event.

// To disconnect from a Room, we call:
room?.disconnect()

// This results in a callback to TVIRoomDelegate#room:didDisconnectWithError

// MARK: TVIRoomDelegate

func room(_ room: TVIRoom, didDisconnectWithError error: Error?) {
    print("Disconnected from room \(room.name)")
}

Server-side control

The Programmable Video REST API allows you to control your video applications from your back-end server via HTTP requests. To learn more check out the Programmable Video REST API docs.

Need some help?

We all do sometimes; code is hard. Get help now from our support team, or lean on the wisdom of the crowd browsing the Twilio tag on Stack Overflow.