Communication

Default settings

Proceed with project setting for each platform before communication.

Development

The RemonCll class provides functions for communication. The communication function can be used with the connect() function of the RemonCall class.

Please refer to the following for the overall configuration and flow

pageFlow pageStructure

View 등록

To view the communication, the viewer must connect the view in which the actual video is drawn. Register the Local View to see himself/herself, and register the Remote View to make the other.

<!-- local view -->
<video id="localVideo" autoplay muted></video>
<!-- remote view -->
<video id="remoteVideo" autoplay></video>

<!-- local view -->
<com.remotemonster.sdk.PercentFrameLayout
    android:id="@+id/perFrameLocal"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <org.webrtc.SurfaceViewRenderer
        android:id="@+id/surfRendererLocal"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
</com.remotemonster.sdk.PercentFrameLayout>

<!-- remote view -->
<com.remotemonster.sdk.PercentFrameLayout
    android:id="@+id/perFrameRemote"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <org.webrtc.SurfaceViewRenderer
        android:id="@+id/surfRendererRemote"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
</com.remotemonster.sdk.PercentFrameLayout>

Please refer to the following for the details.

pageWeb - View pageAndroid - View pageiOS - View

Make a call

You can create a communication using RemonCast's connectChannel() function. When the connectChannel() function is called, a channel that allows other users to connect to Remon's media server is created. At this point, a channel is created and returns its channelId, which allows the other to access it.

// <video id="localVideo" autoplay muted></video>
// <video id="remoteVideo" autoplay></video>
let myChid

const config = {
  credential: {
    serviceId: 'MY_SERVICE_ID',
    key: 'MY_SERVICE_KEY'
  },
  view: {
    local: '#localVideo',
    remote: '#remoteVideo'
  }
}

const listener = {
  onConnect(channelId) {
    myChannelId = channelId
  },
  onComplete() {
    // Do something
  }
}

const caller = new Remon({ listener, config })
caller.connectCall()

caller = RemonCall.builder()
    .serviceId("MY_SERVICE_ID")
    .key("MY_SERVICE_KEY")
    .context(CallActivity.this)
    .localView(surfRendererLocal)
    .remoteView(surfRendererRemote)
    .build();

caller.onConnect((channelId) -> {
    myChannelId = channelId  // Callee need chid from Caller for connect
});

caller.onComplete(() -> {
    // Caller-Callee connect each other. Do something
});

caller.connect();

let caller = RemonCall()

caller.onConnect { (channelId) in
    let myChannelId = channelId          // Callee need channelId from Caller for connect
}

caller.onComplete {
    // Caller-Callee connect each other. Do something
}

caller.connect()

RemonCall *caller = [[RemonCall alloc] init];

[caller onConnectWithBlock:^(NSString * _Nullable channelId) {
// Callee need channelId from Caller for connect
    [self setMyChannelId:channelId];
}];

[caller onCompleteWithBlock:^{
    // Caller-Callee connect each other. Do something
}];

[caller connect:chId :nil];

Get a call

RemonCall's connectChannel(channelId) function allows you to participate in the communication. At this time, it is necessary to inform the channelId of the desired channel.

// <video id="localVideo" autoplay muted></video>
// <video id="remoteVideo" autoplay></video>
const config = {
  credential: {
    serviceId: 'MY_SERVICE_ID',
    key: 'MY_SERVICE_KEY'
  },
  view: {
    local: '#localVideo',
    remote: '#remoteVideo'
  }
}

const listener = {
  onComplete() {
    // Do something
  }
}

const callee = new Remon({ listener, config })
callee.connectCall('MY_CHANNEL_ID')

callee = RemonCall.builder()
    .serviceId("MY_SERVICE_ID")
    .key("MY_SERVICE_KEY")
    .context(CallActivity.this)
    .localView(surfRendererLocal)
    .remoteView(surfRendererRemote)
    .build();

callee.onComplete(() -> {
    // Caller-Callee connect each other. Do something
});

callee.connect("MY_CHANNEL_ID");

let callee = RemonCall()

callee.onComplete {
    // Caller-Callee connect each other. Do something
}

callee.connect("MY_CHANNEL_ID")

RemonCall *callee = [[RemonCall alloc] init];

[callee onCompleteWithBlock:^{
    // Caller-Callee connect each other. Do something
}];

[callee connect:chId :nil];

Callbacks

Callbacks are provided to assist in tracking various states during development.

const listener = {
  onInit(token) {
    // Things to do when remon is initialized, such as UI processing, etc.
  },
  
  onConnect(channelId) {
    // Make a call then wait the callee
  },

  onComplete() {
    // Start between Caller and Callee
  },
  
  onClose() {
    // End calling
  }
}

remonCall = RemonCall.builder().build();

remonCall.onInit((token) -> {
    // Things to do when remon is initialized, such as UI processing, etc.
});

remonCall.onConnect((channelId) -> {
    // Make a call then wait the callee
});

remonCall.onComplete(() -> {
    // Start between Caller and Callee
});

remonCall.onClose(() -> {
    // End calling
});

let remonCall = RemonCall()

remonCall.onInit { (token) in
    // Things to do when remon is initialized, such as UI processing, etc.
}

remonCall.onConnect { (channelId) in
    // Make a call then wait the callee
}

remonCall.onComplete {
    // Start between Caller and Callee
}

remonCast.onClose {
    // End calling
}

RemonCall *remonCall = [[RemonCall alloc] init];

[remonCall onInitWithBlock:^{
    // Things to do when remon is initialized, such as UI processing, etc.
}];

[remonCallter onConnectWithBlock:^(NSString * _Nullable chId) {
    // Make a call then wait the callee
}];

[remonCall onCompleteWithBlock:^{
    // Start between Caller and Callee
}];

[remonCall onCloseWithBlock:^{
    // End calling
}];

Please refer to the following for more information.

pageCallbacks

Channel

When you create a communication, a channel is created with a unique channelId. This channelId allows the other to access the created communication. At this time, the list of all channels being communication can be viewed as follows.

const remonCall = new Remon()
const calls = await remonCall.fetchCalls()

remonCall = RemonCall.builder().build();

remonCall.fetchCalls();
remonCall.onFetch(calls -> {
    // Do something
});

let remonCall = RemonCall()

remonCall.fetchCalls { (error, results) in
    // Do something
}

RemonCall *remonCall = [[RemonCall alloc]init];
[remonCall fetchCastsWithIsTest:YES
              complete:^(NSArray<RemonSearchResult *> * _Nullable chs) {
                            // Do something
}];

Please refer to the following for more information.

pageChannel

Termination

When all communication is finished, it is necessary to close the RemonCall object with close(). All communication resources and media stream resources are released by close().

const remonCast = new Remon()
remonCast.close()

remonCall = RemonCall.builder().build();
remonCall.close();

let remonCall = RemonCall()
remonCall.close()

RemonCall *remonCall = [[RemonCall alloc]init];
[remonCall closeRemon:YES];

Setting

If you need more detailed settings when creating or watching a communication, please refer to the following.

pageConfig

PreviousLivecast NextCallbacks

Last updated 5 years ago