Allow callback for H264 codec not support for Android Devices (#596)

* support checking h264 and notifying user

* add boolean to toggle enableH264Encoding and add docs

* address commas and semicolons in failing test

* remove unnecessary comma

* pass encodingParameters

* remove spacing

* address comments

* move map builder

* be more explicit in comment

* move it to a different place

* Change to return a list of supported codecs

Author: brycnguyen

android/src/main/java/com/twiliorn/library/CustomTwilioVideoView.java

@@ -71,10 +71,16 @@
 import com.twilio.video.Video;
 import com.twilio.video.VideoDimensions;
 import com.twilio.video.VideoFormat;
+import com.twilio.video.VideoCodec;
 
 import org.webrtc.voiceengine.WebRtcAudioManager;
 
 import tvi.webrtc.Camera1Enumerator;
+import tvi.webrtc.HardwareVideoEncoderFactory;
+import tvi.webrtc.HardwareVideoDecoderFactory;
+import tvi.webrtc.VideoCodecInfo;
+import com.twilio.video.H264Codec;
+import com.twilio.video.Vp8Codec;
 
 import java.lang.annotation.Retention;
 import java.lang.annotation.RetentionPolicy;
@@ -103,6 +109,7 @@
 import static com.twiliorn.library.CustomTwilioVideoView.Events.ON_STATS_RECEIVED;
 import static com.twiliorn.library.CustomTwilioVideoView.Events.ON_VIDEO_CHANGED;
 import static com.twiliorn.library.CustomTwilioVideoView.Events.ON_DOMINANT_SPEAKER_CHANGED;
+import static com.twiliorn.library.CustomTwilioVideoView.Events.ON_LOCAL_PARTICIPANT_SUPPORTED_CODECS;
 
 public class CustomTwilioVideoView extends View implements LifecycleEventListener, AudioManager.OnAudioFocusChangeListener {
     private static final String TAG = "CustomTwilioVideoView";
@@ -117,6 +124,7 @@ public class CustomTwilioVideoView extends View implements LifecycleEventListene
     private static String backFacingDevice;
     private boolean maintainVideoTrackInBackground = false;
     private String cameraType = "";
+    private boolean enableH264Codec = false;
 
     @Retention(RetentionPolicy.SOURCE)
     @StringDef({Events.ON_CAMERA_SWITCHED,
@@ -140,7 +148,8 @@ public class CustomTwilioVideoView extends View implements LifecycleEventListene
             Events.ON_PARTICIPANT_DISABLED_AUDIO_TRACK,
             Events.ON_STATS_RECEIVED,
             Events.ON_NETWORK_QUALITY_LEVELS_CHANGED,
-            Events.ON_DOMINANT_SPEAKER_CHANGED
+            Events.ON_DOMINANT_SPEAKER_CHANGED,
+            Events.ON_LOCAL_PARTICIPANT_SUPPORTED_CODECS,
     })
     public @interface Events {
         String ON_CAMERA_SWITCHED = "onCameraSwitched";
@@ -165,6 +174,7 @@ public class CustomTwilioVideoView extends View implements LifecycleEventListene
         String ON_STATS_RECEIVED = "onStatsReceived";
         String ON_NETWORK_QUALITY_LEVELS_CHANGED = "onNetworkQualityLevelsChanged";
         String ON_DOMINANT_SPEAKER_CHANGED = "onDominantSpeakerDidChange";
+        String ON_LOCAL_PARTICIPANT_SUPPORTED_CODECS = "onLocalParticipantSupportedCodecs";
     }
 
     private final ThemedReactContext themedReactContext;
@@ -435,7 +445,8 @@ public void connectToRoomWrapper(
             boolean enableNetworkQualityReporting,
             boolean dominantSpeakerEnabled,
             boolean maintainVideoTrackInBackground,
-            String cameraType
+            String cameraType,
+            boolean enableH264Codec
     ) {
         this.roomName = roomName;
         this.accessToken = accessToken;
@@ -444,6 +455,7 @@ public void connectToRoomWrapper(
         this.dominantSpeakerEnabled = dominantSpeakerEnabled;
         this.maintainVideoTrackInBackground = maintainVideoTrackInBackground;
         this.cameraType = cameraType;
+        this.enableH264Codec = enableH264Codec;
 
         // Share your microphone
         localAudioTrack = LocalAudioTrack.create(getContext(), enableAudio);
@@ -487,6 +499,48 @@ public void connectToRoom() {
             connectOptionsBuilder.dataTracks(Collections.singletonList(localDataTrack));
         }
 
+        // H264 Codec Support Detection: https://www.twilio.com/docs/video/managing-codecs
+        HardwareVideoEncoderFactory hardwareVideoEncoderFactory = new HardwareVideoEncoderFactory(null, true, true);
+        HardwareVideoDecoderFactory hardwareVideoDecoderFactory = new HardwareVideoDecoderFactory(null);
+
+        boolean h264EncoderSupported = false;
+        for (VideoCodecInfo videoCodecInfo : hardwareVideoEncoderFactory.getSupportedCodecs()) {
+            if (videoCodecInfo.name.equalsIgnoreCase("h264")) {
+                h264EncoderSupported = true;
+                break;
+            }
+        }
+        boolean h264DecoderSupported = false;
+        for (VideoCodecInfo videoCodecInfo : hardwareVideoDecoderFactory.getSupportedCodecs()) {
+            if (videoCodecInfo.name.equalsIgnoreCase("h264")) {
+                h264DecoderSupported = true;
+                break;
+            }
+        }
+
+        boolean isH264Supported = h264EncoderSupported && h264DecoderSupported;
+
+        Log.d("RNTwilioVideo", "H264 supported by hardware: " + isH264Supported);
+
+        WritableArray supportedCodecs = new WritableNativeArray();
+
+        VideoCodec videoCodec =  new Vp8Codec();
+        // VP8 is supported on all android devices by default
+        supportedCodecs.pushString(videoCodec.toString());
+
+        if (isH264Supported && this.enableH264Codec) {
+            videoCodec = new H264Codec();
+            supportedCodecs.pushString(videoCodec.toString());
+        }
+
+        WritableMap event = new WritableNativeMap();
+
+        event.putArray("supportedCodecs", supportedCodecs);
+
+        pushEvent(CustomTwilioVideoView.this, ON_LOCAL_PARTICIPANT_SUPPORTED_CODECS, event);
+
+        connectOptionsBuilder.preferVideoCodecs(Collections.singletonList(videoCodec));
+
         connectOptionsBuilder.enableDominantSpeaker(this.dominantSpeakerEnabled);
 
         if (enableNetworkQualityReporting) {

android/src/main/java/com/twiliorn/library/CustomTwilioVideoViewManager.java

@@ -11,6 +11,7 @@
 import android.support.annotation.Nullable;
 
 import com.facebook.react.bridge.ReadableArray;
+import com.facebook.react.bridge.ReadableMap;
 import com.facebook.react.common.MapBuilder;
 import com.facebook.react.uimanager.SimpleViewManager;
 import com.facebook.react.uimanager.ThemedReactContext;
@@ -40,7 +41,7 @@
 import static com.twiliorn.library.CustomTwilioVideoView.Events.ON_STATS_RECEIVED;
 import static com.twiliorn.library.CustomTwilioVideoView.Events.ON_NETWORK_QUALITY_LEVELS_CHANGED;
 import static com.twiliorn.library.CustomTwilioVideoView.Events.ON_DOMINANT_SPEAKER_CHANGED;
-
+import static com.twiliorn.library.CustomTwilioVideoView.Events.ON_LOCAL_PARTICIPANT_SUPPORTED_CODECS;
 
 public class CustomTwilioVideoViewManager extends SimpleViewManager<CustomTwilioVideoView> {
     public static final String REACT_CLASS = "RNCustomTwilioVideoView";
@@ -83,6 +84,8 @@ public void receiveCommand(CustomTwilioVideoView view, int commandId, @Nullable
                 boolean dominantSpeakerEnabled = args.getBoolean(6);
                 boolean maintainVideoTrackInBackground = args.getBoolean(7);
                 String cameraType = args.getString(8);
+                ReadableMap encodingParameters = args.getMap(9);
+                boolean enableH264Codec = encodingParameters.getBoolean("enableH264Codec");
                 view.connectToRoomWrapper(
                     roomName,
                     accessToken,
@@ -92,7 +95,8 @@ public void receiveCommand(CustomTwilioVideoView view, int commandId, @Nullable
                     enableNetworkQualityReporting,
                     dominantSpeakerEnabled,
                     maintainVideoTrackInBackground,
-                    cameraType
+                    cameraType,
+                    enableH264Codec
                   );
                 break;
             case DISCONNECT:
@@ -166,7 +170,8 @@ public Map getExportedCustomDirectEventTypeConstants() {
         ));
 
         map.putAll(MapBuilder.of(
-                ON_PARTICIPANT_REMOVED_DATA_TRACK, MapBuilder.of("registrationName", ON_PARTICIPANT_REMOVED_DATA_TRACK)
+                ON_PARTICIPANT_REMOVED_DATA_TRACK, MapBuilder.of("registrationName", ON_PARTICIPANT_REMOVED_DATA_TRACK),
+                ON_LOCAL_PARTICIPANT_SUPPORTED_CODECS, MapBuilder.of("registrationName", ON_LOCAL_PARTICIPANT_SUPPORTED_CODECS)
         ));
 
         map.putAll(MapBuilder.of(

docs/README.md

@@ -70,6 +70,8 @@ onCameraDidStopRunning | func | no |  | Called when the camera has stopped runin
 onStatsReceived | func | no |  | Called when stats are received (after calling getStats)
 onNetworkQualityLevelsChanged | func | no |  | Called when the network quality levels of a participant have changed (only if enableNetworkQualityReporting is set to True when connecting)
 onDominantSpeakerDidChange | func | no |  | Called when dominant speaker changes @param {{ participant, room }} dominant participant
+onLocalParticipantSupportedCodecs | func | no |  | Always called on android with @param {{ supportedCodecs }} after connecting to the room
+
 -----
 
 **src/TwilioVideoLocalView.android.js**

index.d.ts

@@ -84,6 +84,12 @@ declare module "react-native-twilio-video-webrtc" {
 
   export type DominantSpeakerChangedCb = (d: DominantSpeakerChangedEventArgs) => void;
 
+  export type LocalParticipantSupportedCodecsCbEventArgs = {
+    supportedCodecs: Array<string>;
+  }
+
+  export type LocalParticipantSupportedCodecsCb = (d: LocalParticipantSupportedCodecsCbEventArgs) => void;
+
   export type TwilioVideoProps = ViewProps & {
     onCameraDidStart?: () => void;
     onCameraDidStopRunning?: (err: any) => void;
@@ -105,6 +111,7 @@ declare module "react-native-twilio-video-webrtc" {
     onRoomParticipantDidConnect?: ParticipantEventCb;
     onRoomParticipantDidDisconnect?: ParticipantEventCb;
     onNetworkQualityLevelsChanged?: NetworkLevelChangeEventCb;
+    onLocalParticipantSupportedCodecs?: LocalParticipantSupportedCodecsCb;
 
     onStatsReceived?: (data: any) => void;
     onDataTrackMessageReceived?: DataTrackEventCb;
@@ -137,6 +144,9 @@ declare module "react-native-twilio-video-webrtc" {
     enableAudio?: boolean;
     enableVideo?: boolean;
     enableRemoteAudio?: boolean;
+    encodingParameters?: {
+      enableH264Codec?: boolean;
+    };
     enableNetworkQualityReporting?: boolean;
     maintainVideoTrackInBackground?: boolean;
   };

src/TwilioVideo.android.js

@@ -144,7 +144,11 @@ const propTypes = {
      * Called when dominant speaker changes
      * @param {{ participant, room }} dominant participant and room
      */
-  onDominantSpeakerDidChange: PropTypes.func
+  onDominantSpeakerDidChange: PropTypes.func,
+  /**
+     * Callback that is called after determining what codecs are supported
+     */
+  onLocalParticipantSupportedCodecs: PropTypes.func
 }
 
 const nativeEvents = {
@@ -174,7 +178,8 @@ class CustomTwilioVideoView extends Component {
     enableRemoteAudio = true,
     enableNetworkQualityReporting = false,
     dominantSpeakerEnabled = false,
-    maintainVideoTrackInBackground = false
+    maintainVideoTrackInBackground = false,
+    encodingParameters = {}
   }) {
     this.runCommand(nativeEvents.connectToRoom, [
       roomName,
@@ -185,7 +190,8 @@ class CustomTwilioVideoView extends Component {
       enableNetworkQualityReporting,
       dominantSpeakerEnabled,
       maintainVideoTrackInBackground,
-      cameraType
+      cameraType,
+      encodingParameters
     ])
   }
 
@@ -292,7 +298,8 @@ class CustomTwilioVideoView extends Component {
       'onParticipantDisabledAudioTrack',
       'onStatsReceived',
       'onNetworkQualityLevelsChanged',
-      'onDominantSpeakerDidChange'
+      'onDominantSpeakerDidChange',
+      'onLocalParticipantSupportedCodecs'
     ].reduce((wrappedEvents, eventName) => {
       if (this.props[eventName]) {
         return {