Make call

This section provides detailed instructions on how to make a call using the ConpeekClient instance.

Step 1: Implement ClientDelegate methods

Implement the necessary methods from the ClientDelegate protocol in the ClientViewModel class. These methods handle various client events such as call success, disconnect success, and state changes.

class ClientViewModel: ObservableObject, ClientDelegate {
    var dialog: Dialog?
    var client: ConpeekClient?

    @Published var showCallView: Bool? = false

    // Initialize the client and set up necessary configurations.
    init() {
        initializeClient()
    }

   private func initializeClient() {
      do {
            client = try ClientBuilder()
                .setTenantPluginAPIURL("https://tenantpluginapiserver1.example.conpeek.com")
                .setSdkUUID("f7kca40c-aml4-8182-b9cd-6054970e614e")
                .setConfigurationID("664c996333f5de4528e15690")
                .setAvailableMedia(["chat","audio", "video"])
                .setDeviceID(UUID().uuidString)
                .setDelegate(self)
                .build()
        } catch {
            print("Error initializing client: \(error.localizedDescription)")
      }
   }

    private func updateUI(_ update: @escaping () -> Void) {
        DispatchQueue.main.async {
            update()
        }
    }

    // Example methods implementation
    func onMakeCallSuccess(_ dialog: Dialog) {
        DispatchQueue.main.async {
            self.dialog = dialog
            self.showCallView = true
        }
    }

    func onMakeCallFailure() {
        // Handle make call failure
    }

    func onDialogDisconnectSuccess() {
        DispatchQueue.main.async {
            self.dialog = nil
            self.showCallView = false
        }
    }

    func onDialogStateChanged(state: String, closeReason: String?) {
        if state == Dialog.STATE_CLOSED {
             DispatchQueue.main.async {
                self.dialog = nil
                self.showCallView = false
            }
        }
    }

    // Add other delegate methods
}

Example content view

Step 1: Define the ContentView structure

Create a new SwiftUI view that will manage the UI for make and display video call.

import SwiftUI
import WebRTC

/// View representing the main content of the application.
struct ContentView: View {
    // View model managing the client functionality.
    @StateObject private var viewModel = ClientViewModel()

    // Renderer for local video.
    @State private var localRenderer: RTCMTLVideoView?

    // Renderer for remote video.
    @State private var remoteRenderer: RTCMTLVideoView?

    var body: some View {
        VStack {
            // Check if a call is not in progress.
            if viewModel.showCallView == false {
                Button(action: {
                    viewModel.client?.makeCall(["video", "chat"])
                }) {
                    Text("Video call")
                }
                .padding()
            } else {
                VStack {
                    // Display local video renderer.
                    if let localRenderer = localRenderer {
                        VideoRenderView(renderer: localRenderer)
                            .frame(width: 100, height: 100)
                            .background(Color.black)
                    }
                    // Display remote video renderer.
                    if let remoteRenderer = remoteRenderer {
                        VideoRenderView(renderer: remoteRenderer)
                            .frame(width: 300, height: 300)
                            .background(Color.black)
                    }
                    Button(action: {
                        viewModel.dialog?.disconnect()
                    }) {
                        Text("Disconnect")
                    }
                }
                .onAppear {
                    // Initialize and assign local video renderer.
                    let localRenderer = RTCMTLVideoView(frame: .zero)
                    localRenderer.videoContentMode = .scaleAspectFill
                    self.localRenderer = localRenderer
                    viewModel.dialog?.setLocalRenderer(localRenderer)

                    // Initialize and assign remote video renderer.
                    let remoteRenderer = RTCMTLVideoView(frame: .zero)
                    remoteRenderer.videoContentMode = .scaleAspectFill
                    self.remoteRenderer = remoteRenderer
                    viewModel.dialog?.setRemoteRenderer(remoteRenderer)
                    }
                .onDisappear {
                    // Clear remote video renderer.
                    self.remoteRenderer = nil
                    viewModel.dialog?.setRemoteRenderer(nil)

                    // Clear local video renderer.
                    self.localRenderer = nil
                    viewModel.dialog?.setLocalRenderer(nil)
                }
            }
        }
        .padding()
    }
}

// UIViewRepresentable wrapper for RTCMTLVideoView.
struct VideoRenderView: UIViewRepresentable {
    let renderer: RTCMTLVideoView

    func makeUIView(context: Context) -> RTCMTLVideoView {
        return renderer
    }

    func updateUIView(_ uiView: RTCMTLVideoView, context: Context) {}
}

Sample application using Conpeek iOS SDK

Below is a screenshot of a sample application that was created using the Conpeek iOS SDK. You can develop advanced features in your application via integrating with Conpeek platform thanks to iOS SDK.

Proceed to the next step: Class/Methods