Difference between onSubscribe / onError and videoEnabled / videoDisabled

[webdif]

In a component using opentok-react, I'm currently doing something like this:

const settings = {
  eventHandlers: {
    videoDisabled: () => this.props.actions.enableVideo(false),
    videoEnabled: () => this.props.actions.enableVideo(true),
  }
  // ...
}

// ...

<OTPublisher {...settings} />

I'm glad to see that 0.4.0 add some error handling support and other event stuff, like onPublish and onError. But I'm not sure to understand the difference between the two and videoDisabled / videoEnabled.

Can you help, please? 🙏

[aiham]

@webdif I don't believe you can use videoDisabled and videoEnabled with a Publisher. Those are events on the Subscriber. Please see:

https://tokbox.com/developer/sdks/js/reference/Subscriber.html#.event:videoEnabled
https://tokbox.com/developer/sdks/js/reference/Subscriber.html#.event:videoDisabled

These two Subscriber events are explained in detail in the above links. Is there something confusing you about them?

As for the Publisher callback props, onPublish is called when a publisher successfully publishes to the session, equivalent to the callback of Session#publish(). And onError is called when there is an error either initialising the publisher or publishing to the session.

If this is still confusing, maybe you can describe what you're trying to achieve and I can suggest the correct usage.

[webdif]

Thanks a lot for your response and your help 👍

Indeed, I have these events on <OTSubscriber>, but I mixed things up reading the docs and in the code on this issue. Sorry about that! But I'm still want to understand better the difference of these events and onSubscribe / onError.

What I'm trying to achieve is to update my UI when something is changing.

Currently, I fire redux actions on videoEnabled and videoDisabled, to tell my user something like "Hey, the video has been disabled to preserve audio".

It's working, but I often have some errors in console. I saw that 0.4.0 add some sucess/error handlings with convenient callback, so I'm trying to implement these, and have a better management of errors, disconnect, reconnect. For example, a log in chrome console that showing errors or warning that are not catched yet:

[aiham]

Sure, no problem.

The onSubcribe and onError props will be called on success/failure of the Session#subscribe() call, but this only happens once at the start of a subscription.

videoEnabled and videoDisabled may be emitted multiple times after a successful subscription. They can be emitted for a few reasons (publishVideo, subscribeToVideo, quality) but these are all events that happen on purpose, either decided by the publisher, subscriber or OpenTok Media Router.

They will not be called for connectivity issues. You'll likely want to listen for Session events such as sessionConnected, sessionDisconnected, sessionReconnected and sessionReconnecting. Then pass down the event to OTSubscriber child components. I did something similar in the example app.

The session events are defined here:

https://github.com/aiham/opentok-react/blob/93941b69f86da8aa5f5f8feac58d6cb418080acf/example/components/App.js#L18

They are passed into OTSession here:

https://github.com/aiham/opentok-react/blob/93941b69f86da8aa5f5f8feac58d6cb418080acf/example/components/App.js#L42

And the connectivity state is passed down to the child component here:

https://github.com/aiham/opentok-react/blob/93941b69f86da8aa5f5f8feac58d6cb418080acf/example/components/App.js#L46

[webdif]

Thanks a lot for all this! I have some docs to read 🤓