@jwplayer/jwplayer-react-native 1.0.0 → 1.0.2

package/.github/CODEOWNERS

@@ -1,2 +1,2 @@
 # SDK Team
-@jwplayer/team_sdks
+* @jwplayer/team_sdks

package/.github/ISSUE_TEMPLATE/bug_report.md

@@ -2,8 +2,8 @@
 name: Bug report
 about: Create a report to help us improve
 title: "[BUG]"
-labels: ''
-assignees: ''
+labels: "needs-grooming"
+assignees: '@jwplayer/team_sdks'
 
 ---
 
@@ -36,3 +36,13 @@ If you are having a build issue, we would like to know about your machine.
 
 **Additional context**
 Add any other context about the problem here.
+
+**JWP Ticketing**
+To expedite resolution and maintain confidentiality, submit a JWP [request](https://support.jwplayer.com/hc/en-us/requests/new) in addition to this new `Issue`.  A JWP request offers the following benefits:
+* Associates the `Issue` with your company
+* Permits securely share sensitive information related to the bug, request, or question
+* Enhances JWP's ability to track progress and provide timely updates
+* Enables you to track and manage multiple issues through a single platform 
+
+| ℹ️ While `Issues` are valuable for open-source collaboration, a JWP request ensures that you will receive clear timelines and efficient support. |
+|:---|

package/.github/ISSUE_TEMPLATE/feature_request.md

@@ -2,8 +2,8 @@
 name: Feature request
 about: Suggest an idea for this project
 title: "[FEAT]"
-labels: ''
-assignees: ''
+labels: 'needs-grooming'
+assignees: '@jwplayer/team_sdks'
 
 ---
 
@@ -18,3 +18,13 @@ A clear and concise description of any alternative solutions or features you've
 
 **Additional context**
 Add any other context or screenshots about the feature request here.
+
+**JWP Ticketing**
+To expedite resolution and maintain confidentiality, submit a JWP [request](https://support.jwplayer.com/hc/en-us/requests/new) in addition to this new `Issue`.  A JWP request offers the following benefits:
+* Associates the `Issue` with your company
+* Permits securely share sensitive information related to the bug, request, or question
+* Enhances JWP's ability to track progress and provide timely updates
+* Enables you to track and manage multiple issues through a single platform 
+
+| ℹ️ While `Issues` are valuable for open-source collaboration, a JWP request ensures that you will receive clear timelines and efficient support. |
+|:---|

package/.github/ISSUE_TEMPLATE/implement.md

@@ -0,0 +1,26 @@
+---
+name: Implementation
+about: Request an implementation of a native feature or upgrade of SDK
+title: "[IMPLEMENT]"
+labels: 'needs-grooming'
+assignees: '@jwplayer/team_sdks'
+
+---
+
+**What needs to be implemented**
+
+**How should it be implemented**
+
+**Acceptance Criteria**
+
+**Additional context**
+
+**JWP Ticketing**
+To expedite resolution and maintain confidentiality, submit a JWP [request](https://support.jwplayer.com/hc/en-us/requests/new) in addition to this new `Issue`.  A JWP request offers the following benefits:
+* Associates the `Issue` with your company
+* Permits securely share sensitive information related to the bug, request, or question
+* Enhances JWP's ability to track progress and provide timely updates
+* Enables you to track and manage multiple issues through a single platform 
+
+| ℹ️ While `Issues` are valuable for open-source collaboration, a JWP request ensures that you will receive clear timelines and efficient support. |
+|:---|

package/.github/ISSUE_TEMPLATE/question.md

@@ -2,10 +2,20 @@
 name: Question
 about: Ask a question about the project or product
 title: "[ASK]"
-labels: ''
-assignees: ''
+labels: 'needs-grooming'
+assignees: '@jwplayer/team_sdks'
 
 ---
 
 **What isn't clear?**
 What information are we not providing that you think we should?
+
+**JWP Ticketing**
+To expedite resolution and maintain confidentiality, submit a JWP [request](https://support.jwplayer.com/hc/en-us/requests/new) in addition to this new `Issue`.  A JWP request offers the following benefits:
+* Associates the `Issue` with your company
+* Permits securely share sensitive information related to the bug, request, or question
+* Enhances JWP's ability to track progress and provide timely updates
+* Enables you to track and manage multiple issues through a single platform 
+
+| ℹ️ While `Issues` are valuable for open-source collaboration, a JWP request ensures that you will receive clear timelines and efficient support. |
+|:---|

package/README.md

@@ -49,8 +49,9 @@ Follow these steps to add the library to your Android project:
            }
    ```
 
+For more details and guidance regarding configuration and requirements, see the [JWP Android SDK documentation](https://docs.jwplayer.com/players/docs/android-overview#requirements).
 
-<br /><br />
+<br />
 
 ### iOS
 
@@ -71,6 +72,8 @@ Follow these steps to add the library to your iOS project:
    pod install
    ```
 
+For more details and guidance regarding configuration and requirements, see the [JWP iOS SDK documentation](https://docs.jwplayer.com/players/docs/ios-overview#requirements).
+
 <br /><br />
 
 ## Usage
@@ -138,7 +141,7 @@ Follow these steps to configure the media playback experience in your app:
         : 'YOUR_IOS_SDK_KEY',
     backgroundAudioEnabled: true,
     autostart: true,
-    styling: {
+    styling: { // only (mostly) compatible with iOS
       colors: {
         timeslider: {
           rail: "0000FF",
@@ -175,6 +178,7 @@ Follow these steps to configure the media playback experience in your app:
       onPlayerError={event => this.onPlayerError(event)}
       onBuffer={() => this.onBuffer()}
       onTime={event => this.onTime(event)}
+      onLoaded={event => this.onLoaded(event)}
       onFullScreen={() => this.onFullScreen()}
       onFullScreenExit={() => this.onFullScreenExit()}
     />
@@ -238,7 +242,7 @@ Follow these steps to run the example project:
 
 ## Advanced Topics
 
-[Advertising](#advertising) | [Background Audio](#background-audio) | [Casting](#casting) | [DRM](#drm) | [Picture in Picture (PiP)](#picture-in-picture-pip)
+[Advertising](#advertising) | [Background Audio](#background-audio) | [Casting](#casting) | [DRM](#drm) | [Picture in Picture (PiP)](#picture-in-picture-pip) | [Styling](#styling)
 
 <br />
 
@@ -408,6 +412,24 @@ If you use a different provider for DRM or this does not work for your use case,
 
 <br /><br />
 
+### Styling
+
+[Android](#android-styling) | [iOS](#ios-styling)
+
+#### Android Styling
+The `styling` prop will not work when using the modern prop convention that matches the JWP Delivery API. Even when using the `forceLegacyConfig` prop, Android may not respect your choices.
+
+Android styling is best handled through overring JWP IDs in your apps resources files. See the documentation [here](https://docs.jwplayer.com/players/docs/android-styling-guide). 
+
+A sample of overring a color via XML can be seen in this [colors file](Example/android/app/src/main/res/values/colors.xml). The color specified here is the default, but if you wish to change it, the color will be updated on the player.
+
+<br />
+
+#### iOS Styling
+You can use the styling elements as defined in the [Legacy Readme](/docs/legacy_readme.md#styling). 
+
+<br /><br />
+
 ## Contributing
 
 - All contributions should correlate to an open issue. We hope to avoid doubling the work between contributors. 

package/RNJWPlayer.podspec

@@ -12,7 +12,7 @@ Pod::Spec.new do |s|
   s.platform     = :ios, "14.0"
   s.source       = { :git => "https://github.com/jwplayer/jwplayer-react-native.git", :tag => "v#{s.version}" }
   s.source_files  = "ios/RNJWPlayer/*.{h,m,swift}"
-  s.dependency   'JWPlayerKit', '~> 4.18.0'
+  s.dependency   'JWPlayerKit', '>= 4.19.0'
   s.dependency   'React-Core'
   s.static_framework = true
   s.info_plist = {
@@ -35,7 +35,7 @@ Pod::Spec.new do |s|
   end
   if defined?($RNJWPlayerUseGoogleIMA)
     Pod::UI.puts "RNJWPlayer: enable IMA SDK"
-    s.dependency 'GoogleAds-IMA-iOS-SDK', '~>3.19.1'
+    s.dependency 'GoogleAds-IMA-iOS-SDK', '~> 3.22'
     s.pod_target_xcconfig = {
       'OTHER_SWIFT_FLAGS' => '$(inherited) -D USE_GOOGLE_IMA'
     }

package/android/.gradle/buildOutputCleanup/cache.properties

@@ -1,2 +1,2 @@
-#Fri Apr 19 13:27:57 PDT 2024
-gradle.version=8.1.1
+#Tue Aug 06 14:41:55 PDT 2024
+gradle.version=8.9

package/android/build.gradle

@@ -66,7 +66,7 @@ allprojects {
     }
 }
 
-def jwPlayerVersion = "4.16.2"
+def jwPlayerVersion = "4.18.3"
 def exoplayerVersion = "2.18.7" // Deprecated. Use Media3 when targeting JW SDK > 4.16.0
 def media3ExoVersion = "1.1.1"
 
@@ -82,7 +82,7 @@ dependencies {
 
     // Ad dependencies
     if (useIMA) {
-        implementation 'com.google.ads.interactivemedia.v3:interactivemedia:3.31.0'
+        implementation 'com.google.ads.interactivemedia.v3:interactivemedia:3.33.0'
         implementation 'com.google.android.gms:play-services-ads-identifier:18.0.1'
     }
 

package/android/src/main/AndroidManifest.xml

@@ -9,11 +9,13 @@
     <uses-permission android:name="android.permission.ACCESS_WIFI_STATE"/>
     <uses-permission android:name="android.permission.CHANGE_WIFI_STATE"/>
     <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>
+    <uses-permission android:name="android.permission.FOREGROUND_SERVICE_MEDIA_PLAYBACK" />
     <!--    READ_MEDIA_IMAGES, READ_MEDIA_VIDEO or READ_MEDIA_AUDIO.-->
 
     <application>
         <service
             android:name="com.jwplayer.pub.api.background.MediaService"
+            android:foregroundServiceType="mediaPlayback"
             android:exported="false">
             <intent-filter>
                 <action android:name="android.intent.action.MEDIA_BUTTON" />

package/android/src/main/java/com/jwplayer/rnjwplayer/RNJWPlayerView.java

@@ -2,7 +2,10 @@ package com.jwplayer.rnjwplayer;
 
 
 import android.app.Activity;
+import android.content.BroadcastReceiver;
 import android.content.Context;
+import android.content.Intent;
+import android.content.IntentFilter;
 import android.content.pm.ActivityInfo;
 import android.graphics.Color;
 import android.graphics.PorterDuff;
@@ -12,11 +15,15 @@ import android.media.AudioAttributes;
 import android.media.AudioFocusRequest;
 import android.media.AudioManager;
 import android.os.Build;
+import android.os.Handler;
+import android.os.Looper;
 import android.util.Log;
+import android.view.Choreographer;
 import android.view.View;
 import android.view.ViewGroup;
 import android.view.Window;
 import android.view.WindowManager;
+import android.widget.FrameLayout;
 import android.widget.LinearLayout;
 import android.widget.RelativeLayout;
 
@@ -96,7 +103,12 @@ import com.jwplayer.pub.api.events.listeners.AdvertisingEvents;
 import com.jwplayer.pub.api.events.listeners.CastingEvents;
 import com.jwplayer.pub.api.events.listeners.PipPluginEvents;
 import com.jwplayer.pub.api.events.listeners.VideoPlayerEvents;
+import com.jwplayer.pub.api.fullscreen.ExtensibleFullscreenHandler;
+import com.jwplayer.pub.api.fullscreen.FullscreenDialog;
 import com.jwplayer.pub.api.fullscreen.FullscreenHandler;
+import com.jwplayer.pub.api.fullscreen.delegates.DeviceOrientationDelegate;
+import com.jwplayer.pub.api.fullscreen.delegates.DialogLayoutDelegate;
+import com.jwplayer.pub.api.fullscreen.delegates.SystemUiDelegate;
 import com.jwplayer.pub.api.license.LicenseUtil;
 import com.jwplayer.pub.api.media.playlists.PlaylistItem;
 import com.jwplayer.ui.views.CueMarkerSeekbar;
@@ -106,6 +118,7 @@ import java.util.Arrays;
 import java.util.HashMap;
 import java.util.List;
 import java.util.Map;
+import java.util.Objects;
 
 import org.json.JSONObject;
 
@@ -183,6 +196,7 @@ public class RNJWPlayerView extends RelativeLayout implements
     Boolean fullScreenOnLandscape = false;
     Boolean portraitOnExitFullScreen = false;
     Boolean exitFullScreenOnPortrait = false;
+    Boolean playerInModal = false;
 
     Number currentPlayingIndex;
 
@@ -212,6 +226,7 @@ public class RNJWPlayerView extends RelativeLayout implements
     private ThemedReactContext mThemedReactContext;
 
     private MediaServiceController mMediaServiceController;
+    private PipHandlerReceiver mReceiver = null;
 
     private void doBindService() {
         if (mMediaServiceController != null) {
@@ -233,7 +248,7 @@ public class RNJWPlayerView extends RelativeLayout implements
     }
 
     private static Context getNonBuggyContext(ThemedReactContext reactContext,
-            ReactApplicationContext appContext) {
+                                              ReactApplicationContext appContext) {
         Context superContext = reactContext;
         if (!contextHasBug(appContext.getCurrentActivity())) {
             superContext = appContext.getCurrentActivity();
@@ -290,6 +305,8 @@ public class RNJWPlayerView extends RelativeLayout implements
 
     public void destroyPlayer() {
         if (mPlayer != null) {
+            unRegisterReceiver();
+            mPlayer.deregisterActivityForPip();
             mPlayer.stop();
 
             mPlayer.removeListeners(this,
@@ -348,7 +365,7 @@ public class RNJWPlayerView extends RelativeLayout implements
                     EventType.PIP_OPEN
             );
 
-            mPlayer  = null;
+            mPlayer = null;
             mPlayerView = null;
 
             getReactContext().removeLifecycleEventListener(this);
@@ -427,12 +444,116 @@ public class RNJWPlayerView extends RelativeLayout implements
                     EventType.PIP_OPEN
             );
 
-            mPlayer.setFullscreenHandler(new fullscreenHandler());
+            if (playerInModal) {
+                mPlayer.setFullscreenHandler(createModalFullscreenHandler());
+            } else {
+                mPlayer.setFullscreenHandler(new fullscreenHandler());
+            }
 
             mPlayer.allowBackgroundAudio(backgroundAudioEnabled);
         }
     }
 
+    /**
+     * Helper to build the a generic `ExtensibleFullscreenHandler` with small tweaks to play nice with Modals
+     * @return {@link ExtensibleFullscreenHandler}
+     */
+    private ExtensibleFullscreenHandler createModalFullscreenHandler() {
+        DeviceOrientationDelegate delegate = getDeviceOrientationDelegate();
+        FullscreenDialog dialog = new FullscreenDialog(
+                mActivity,
+                mActivity,
+                android.R.style.Theme_Black_NoTitleBar_Fullscreen
+        );
+
+        return new ExtensibleFullscreenHandler(
+                new DialogLayoutDelegate(
+                        mPlayerView,
+                        dialog
+                ),
+                delegate,
+                new SystemUiDelegate(
+                        mActivity,
+                        mActivity.getLifecycle(),
+                        new Handler(),
+                        dialog.getWindow().getDecorView()
+                )
+        ) {
+            @Override
+            public void onFullscreenRequested() {
+                // if landscape is priorty we have to turn off full-screen portrait before allowing
+                // the default call for full-screen
+                mPlayer.allowFullscreenPortrait(!landscapeOnFullScreen);
+                super.onFullscreenRequested();
+                // safely set it back on UI thread after work can be finished
+                final Handler handler = new Handler(Looper.getMainLooper());
+                handler.postDelayed(() -> {
+                    if (mPlayer != null) {
+                        mPlayer.allowFullscreenPortrait(true);
+                    }
+                }, 100);
+                WritableMap eventEnterFullscreen = Arguments.createMap();
+                eventEnterFullscreen.putString("message", "onFullscreenRequested");
+                getReactContext().getJSModule(RCTEventEmitter.class).receiveEvent(
+                        getId(),
+                        "topFullScreenRequested",
+                        eventEnterFullscreen);
+            }
+
+            @Override
+            public void onFullscreenExitRequested() {
+                super.onFullscreenExitRequested();
+
+                WritableMap eventExitFullscreen = Arguments.createMap();
+                eventExitFullscreen.putString("message", "onFullscreenExitRequested");
+                getReactContext().getJSModule(RCTEventEmitter.class).receiveEvent(
+                        getId(),
+                        "topFullScreenExitRequested",
+                        eventExitFullscreen);
+            }
+        };
+    }
+
+    /**
+     * Add logic here for your custom orientation implementation
+     *
+     * @return Default {@link DeviceOrientationDelegate}
+     */
+    private DeviceOrientationDelegate getDeviceOrientationDelegate() {
+        DeviceOrientationDelegate delegate = new DeviceOrientationDelegate(
+                mActivity,
+                mActivity.getLifecycle(),
+                new Handler()
+        ) {
+            @Override
+            public void setFullscreen(boolean fullscreen) {
+                super.setFullscreen(fullscreen);
+            }
+
+            @Override
+            public void onAllowRotationChanged(boolean allowRotation) {
+                super.onAllowRotationChanged(allowRotation);
+            }
+
+            @Override
+            protected void doRotation(boolean fullscreen, boolean allowFullscreenPortrait) {
+                super.doRotation(fullscreen, allowFullscreenPortrait);
+            }
+
+            @Override
+            protected void doRotationListener() {
+                super.doRotationListener();
+            }
+
+            @Override
+            public void onAllowFullscreenPortrait(boolean allowFullscreenPortrait) {
+                super.onAllowFullscreenPortrait(allowFullscreenPortrait);
+            }
+        };
+        delegate.onAllowRotationChanged(true);
+        return delegate;
+    }
+
     private class fullscreenHandler implements FullscreenHandler {
         ViewGroup mPlayerViewContainer = (ViewGroup) mPlayerView.getParent();
         private View mDecorView;
@@ -504,8 +625,15 @@ public class RNJWPlayerView extends RelativeLayout implements
                     mPlayerViewContainer.addView(mPlayerView, new ViewGroup.LayoutParams(
                             ViewGroup.LayoutParams.MATCH_PARENT,
                             ViewGroup.LayoutParams.MATCH_PARENT));
-                    mPlayerView.layout(mPlayerViewContainer.getLeft(), mPlayerViewContainer.getTop(),
-                            mPlayerViewContainer.getRight(), mPlayerViewContainer.getBottom());
+                    // returning from full-screen portrait requires a different measure
+                    if (mActivity.getResources().getConfiguration().orientation == ActivityInfo.SCREEN_ORIENTATION_PORTRAIT
+                    ) {
+                        mPlayerView.layout(mPlayerView.getLeft(), mPlayerViewContainer.getTop(),
+                                mPlayerViewContainer.getMeasuredWidth(), mPlayerViewContainer.getBottom());
+                    } else {
+                        mPlayerView.layout(mPlayerViewContainer.getLeft(), mPlayerViewContainer.getTop(),
+                                mPlayerViewContainer.getRight(), mPlayerViewContainer.getBottom());
+                    }
                 }
             });
 
@@ -519,12 +647,12 @@ public class RNJWPlayerView extends RelativeLayout implements
 
         @Override
         public void onAllowRotationChanged(boolean b) {
-            Log.e(TAG, "onAllowRotationChanged: " + b );
+            Log.e(TAG, "onAllowRotationChanged: " + b);
         }
 
         @Override
         public void onAllowFullscreenPortraitChanged(boolean allowFullscreenPortrait) {
-            Log.e(TAG, "onAllowFullscreenPortraitChanged: " + allowFullscreenPortrait );
+            Log.e(TAG, "onAllowFullscreenPortraitChanged: " + allowFullscreenPortrait);
         }
 
         @Override
@@ -540,10 +668,96 @@ public class RNJWPlayerView extends RelativeLayout implements
         }
     }
 
+    private ArrayList<Integer> rootViewChildrenOriginalVisibility = new ArrayList<Integer>();
+
+    private class PipHandlerReceiver extends BroadcastReceiver {
+
+        @Override
+        public void onReceive(Context context, Intent intent) {
+            if (intent == null) {
+                return;
+            }
+            if (Objects.equals(intent.getAction(), "onPictureInPictureModeChanged")) {
+                if (intent.hasExtra("newConfig") && intent.hasExtra("isInPictureInPictureMode")) {
+                    // Tell the JWP SDK we are toggling so it can handle toolbar / internal setup
+                    mPlayer.onPictureInPictureModeChanged(intent.getBooleanExtra("isInPictureInPictureMode", false), intent.getParcelableExtra("newConfig"));
+
+                    View decorView = mActivity.getWindow().getDecorView();
+                    ViewGroup rootView = decorView.findViewById(android.R.id.content);
+
+                    ViewGroup.LayoutParams layoutParams = new ViewGroup.LayoutParams(
+                            ViewGroup.LayoutParams.MATCH_PARENT,
+                            ViewGroup.LayoutParams.MATCH_PARENT);
+
+                    if (intent.getBooleanExtra("isInPictureInPictureMode", false)) {
+                        // Going into Picture in Picture
+                        ViewGroup parent = (ViewGroup) mPlayerView.getParent();
+
+                        // Remove the player view temporarily
+                        if (parent != null) {
+                            parent.removeView(mPlayerView);
+                        }
+
+                        // Hide all views but player view and keep a handle on them for later
+                        for (int i = 0; i < rootView.getChildCount(); i++) {
+                            if (rootView.getChildAt(i) != mPlayerView) {
+                                rootViewChildrenOriginalVisibility.add(rootView.getChildAt(i).getVisibility());
+                                rootView.getChildAt(i).setVisibility(View.GONE);
+                            }
+                        }
+                        // Add player view back (This is safe since the JWP SDK has already calculated the PiP size/aspect off the View)
+                        rootView.addView(mPlayerView, layoutParams);
+                    } else {
+                        // Exiting Picture in Picture
+
+                        // Toggle controls to ensure we don't lose them -- weird UX bug fix where controls got lost
+                        mPlayer.setForceControlsVisibility(true);
+                        mPlayer.setForceControlsVisibility(false);
+
+                        // Strip player view
+                        rootView.removeView(mPlayerView);
+
+                        // Add visibility back to  any other controls
+                        for (int i = 0; i < rootView.getChildCount(); i++) {
+                            rootView.getChildAt(i).setVisibility(rootViewChildrenOriginalVisibility.get(i));
+                        }
+                        // Clear our list of views
+                        rootViewChildrenOriginalVisibility.clear();
+                        // Add player view back in main spot
+                        addView(mPlayerView, 0, layoutParams);
+                    }
+                }
+            }
+        }
+    }
+
+    private void registerReceiver() {
+        mReceiver = new PipHandlerReceiver();
+        IntentFilter intentFilter = new IntentFilter("onPictureInPictureModeChanged");
+        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.O) {
+            if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.TIRAMISU) {
+                // Must be Exported to get intents
+                mActivity.registerReceiver(mReceiver, intentFilter, Context.RECEIVER_EXPORTED);
+            } else {
+                mActivity.registerReceiver(mReceiver, intentFilter); // Safe API level < 34
+            }
+        } else {
+            mActivity.registerReceiver(mReceiver, intentFilter); // Safe API level < 34
+        }
+    }
+
+    private void unRegisterReceiver() {
+        if (mReceiver != null) {
+            mActivity.unregisterReceiver(mReceiver);
+            mReceiver = null;
+        }
+
+    }
+
     public void setConfig(ReadableMap prop) {
         if (mConfig == null || !mConfig.equals(prop)) {
             if (mConfig != null && isOnlyDiff(prop, "playlist") && mPlayer != null) { // still safe check, even with JW
-                                                                                      // JSON change
+                // JSON change
                 PlayerConfig oldConfig = mPlayer.getConfig();
                 PlayerConfig config = new PlayerConfig.Builder()
                         .autostart(oldConfig.getAutostart())
@@ -610,7 +824,7 @@ public class RNJWPlayerView extends RelativeLayout implements
 
     boolean playlistNotTheSame(ReadableMap prop) {
         return prop.hasKey("playlist") && mPlaylistProp != prop.getArray("playlist") && !Arrays
-                .deepEquals(new ReadableArray[] { mPlaylistProp }, new ReadableArray[] { prop.getArray("playlist") });
+                .deepEquals(new ReadableArray[]{mPlaylistProp}, new ReadableArray[]{prop.getArray("playlist")});
     }
 
     private void setupPlayer(ReadableMap prop) {
@@ -621,7 +835,7 @@ public class RNJWPlayerView extends RelativeLayout implements
         PlayerConfig jwConfig = null;
         Boolean forceLegacy = prop.hasKey("forceLegacyConfig") ? prop.getBoolean("forceLegacyConfig") : false;
         Boolean isJwConfig = false;
-        if(!forceLegacy){
+        if (!forceLegacy) {
             try {
                 obj = MapUtil.toJSONObject(prop);
                 jwConfig = JsonHelper.parseConfigJson(obj);
@@ -761,6 +975,18 @@ public class RNJWPlayerView extends RelativeLayout implements
             mPlayerView.fullScreenOnLandscape = fullScreenOnLandscape;
         }
 
+        if (prop.hasKey("landscapeOnFullScreen")) {
+            landscapeOnFullScreen = prop.getBoolean("landscapeOnFullScreen");
+        }
+
+        if (prop.hasKey("portraitOnExitFullScreen")) {
+            portraitOnExitFullScreen = prop.getBoolean("fullScreenOnLandscape");
+        }
+
+        if (prop.hasKey("playerInModal")) {
+            playerInModal = prop.getBoolean("playerInModal");
+        }
+
         if (prop.hasKey("exitFullScreenOnPortrait")) {
             exitFullScreenOnPortrait = prop.getBoolean("exitFullScreenOnPortrait");
             mPlayerView.exitFullScreenOnPortrait = exitFullScreenOnPortrait;
@@ -778,14 +1004,19 @@ public class RNJWPlayerView extends RelativeLayout implements
         if (mActivity != null && prop.hasKey("pipEnabled")) {
             boolean pipEnabled = prop.getBoolean("pipEnabled");
             if (pipEnabled) {
+                registerReceiver();
                 mPlayer.registerActivityForPip(mActivity, mActivity.getSupportActionBar());
             } else {
                 mPlayer.deregisterActivityForPip();
+                unRegisterReceiver();
             }
         }
 
         // Legacy
-        // This isn't the ideal way to do this on Android
+        // This isn't the ideal way to do this on Android. All drawables/colors/themes shoudld
+        // be targed using styling. See `https://docs.jwplayer.com/players/docs/android-styling-guide`
+        // for more information on how best to override the JWP styles using XML. If you are unsure of a 
+        // color/drawable/theme, open an `Ask` issue.
         if (mColors != null) {
             if (mColors.hasKey("backgroundColor")) {
                 mPlayerView.setBackgroundColor(Color.parseColor("#" + mColors.getString("backgroundColor")));
@@ -1266,6 +1497,13 @@ public class RNJWPlayerView extends RelativeLayout implements
             doBindService();
             requestAudioFocus();
         }
+        WritableMap onFirstFrame = Arguments.createMap();
+        onFirstFrame.putString("message", "onLoaded");
+        onFirstFrame.putDouble("loadTime", firstFrameEvent.getLoadTime());
+        getReactContext().getJSModule(RCTEventEmitter.class).receiveEvent(
+                getId(),
+                "topFirstFrame",
+                onFirstFrame);
     }
 
     @Override
@@ -1448,6 +1686,16 @@ public class RNJWPlayerView extends RelativeLayout implements
         event.putBoolean("active", castEvent.isActive());
         event.putBoolean("available", castEvent.isAvailable());
         getReactContext().getJSModule(RCTEventEmitter.class).receiveEvent(getId(), "topCasting", event);
+        // stop/start the background audio service if it's running and we're casting
+        if (castEvent.isActive()) {
+            doUnbindService();
+        } else {
+            if (backgroundAudioEnabled) {
+                mMediaServiceController = new MediaServiceController.Builder((AppCompatActivity) mActivity, mPlayer)
+                        .build();
+                doBindService();
+            }
+        }
     }
 
     // LifecycleEventListener