react-native-theoplayer 2.9.0 → 2.11.0

package/CHANGELOG.md

@@ -2,9 +2,42 @@
 
 All notable changes to this project will be documented in this file.
 
-The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/)
+The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.1.0/)
 and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.html).
 
+## [2.11.0] - 23-08-10
+
+### Added
+
+- Added DAI support through iOS Native pipeline, using new THEOplayerGoogleIMAIntegration functionality
+- Added `TextTrackStyle` API for iOS and Android.
+
+### Fixed
+
+- Fixed an issue on Android where the player would sometimes crash when requesting the current active video track.
+
+### Changed
+
+- Switched to 'displayIconUri' in sourceDescription.metadata as primary field for artwork selection in NowplayingInfo/MediaSession, 'poster' in sourceDescription is now the fallback.
+- Removed the play/pause icon in the PiP window on Android while playing an ad.
+
+## [2.10.0] - 23-07-25
+
+### Fixed
+
+- Fixed an issue on Android where the media button receiver would not accept button events in case multiple receivers are registered.
+- Fixed an issue on Android where `react-native-theoplayer` would not build when depending on Android player SDK v5.6.0.
+- Fixed an issue on Android where a `pause` event would not be dispatched when putting the app to the background during play-out of an ad, while background playback is enabled. The ad would also restart when bringing the app back to the foreground.
+
+### Changed
+
+- Removed restrictions on media session playback actions for AndroidTV.
+- Upgraded `react-native` version of the example app to `react-native-tvos@0.71.12-0`.
+
+### Added
+
+- Added a `version` property to `THEOplayer` for querying the `player` version (e.g., `'5.5.0'`) and `playerSuite` (e.g., `'2023.3.0'`) versions.
+
 ## [2.9.0] - 23-06-16
 
 ### Changed

package/README.md

@@ -55,14 +55,15 @@ React Native works to speed up the way of working with THEOplayer React Native S
 The `react-native-theoplayer` package can be combined with any number of connectors to provide extra
 functionality. Currently, the following connectors are available:
 
-| Package name                                                                                                     | Purpose                             | Registry                                                                                                                                                      |
-|------------------------------------------------------------------------------------------------------------------|-------------------------------------|---------------------------------------------------------------------------------------------------------------------------------------------------------------|
-| [`@theoplayer/react-native-analytics-adobe`](https://github.com/THEOplayer/react-native-theoplayer-analytics)    | Adobe analytics connector           | [![npm](https://img.shields.io/npm/v/@theoplayer/react-native-analytics-adobe)](https://www.npmjs.com/package/@theoplayer/react-native-analytics-adobe)       |
-| [`@theoplayer/react-native-analytics-comscore`](https://github.com/THEOplayer/react-native-theoplayer-analytics) | Comscore analytics connector        | [![npm](https://img.shields.io/npm/v/@theoplayer/react-native-analytics-comscore)](https://www.npmjs.com/package/@theoplayer/react-native-analytics-comscore) |
-| [`@theoplayer/react-native-analytics-conviva`](https://github.com/THEOplayer/react-native-theoplayer-analytics)  | Conviva analytics connector         | [![npm](https://img.shields.io/npm/v/@theoplayer/react-native-analytics-conviva)](https://www.npmjs.com/package/@theoplayer/react-native-analytics-conviva)   |
-| [`@theoplayer/react-native-analytics-nielsen`](https://github.com/THEOplayer/react-native-theoplayer-analytics)  | Nielsen analytics connector         | [![npm](https://img.shields.io/npm/v/@theoplayer/react-native-analytics-nielsen)](https://www.npmjs.com/package/@theoplayer/react-native-analytics-nielsen)   |
-| [`@theoplayer/react-native-drm`](https://github.com/THEOplayer/react-native-theoplayer-drm)                      | Content protection (DRM) connectors | [![npm](https://img.shields.io/npm/v/@theoplayer/react-native-drm)](https://www.npmjs.com/package/@theoplayer/react-native-drm)                               |
-| [`@theoplayer/react-native-ui`](https://github.com/THEOplayer/react-native-theoplayer-ui)                        | React Native user interface         | [![npm](https://img.shields.io/npm/v/@theoplayer/react-native-ui)](https://www.npmjs.com/package/@theoplayer/react-native-ui)                                 |
+| Package name                                                                                                              | Purpose                                              | Registry                                                                                                                                                      |
+|---------------------------------------------------------------------------------------------------------------------------|------------------------------------------------------|---------------------------------------------------------------------------------------------------------------------------------------------------------------|
+| [`@theoplayer/react-native-analytics-adobe`](https://github.com/THEOplayer/react-native-theoplayer-analytics)             | Adobe analytics connector                            | [![npm](https://img.shields.io/npm/v/@theoplayer/react-native-analytics-adobe)](https://www.npmjs.com/package/@theoplayer/react-native-analytics-adobe)       |
+| [`@theoplayer/react-native-analytics-comscore`](https://github.com/THEOplayer/react-native-theoplayer-analytics)          | Comscore analytics connector                         | [![npm](https://img.shields.io/npm/v/@theoplayer/react-native-analytics-comscore)](https://www.npmjs.com/package/@theoplayer/react-native-analytics-comscore) |
+| [`@theoplayer/react-native-analytics-conviva`](https://github.com/THEOplayer/react-native-theoplayer-analytics)           | Conviva analytics connector                          | [![npm](https://img.shields.io/npm/v/@theoplayer/react-native-analytics-conviva)](https://www.npmjs.com/package/@theoplayer/react-native-analytics-conviva)   |
+| [`@theoplayer/react-native-analytics-nielsen`](https://github.com/THEOplayer/react-native-theoplayer-analytics)           | Nielsen analytics connector                          | [![npm](https://img.shields.io/npm/v/@theoplayer/react-native-analytics-nielsen)](https://www.npmjs.com/package/@theoplayer/react-native-analytics-nielsen)   |
+| [`@theoplayer/react-native-drm`](https://github.com/THEOplayer/react-native-theoplayer-drm)                               | Content protection (DRM) connectors                  | [![npm](https://img.shields.io/npm/v/@theoplayer/react-native-drm)](https://www.npmjs.com/package/@theoplayer/react-native-drm)                               |
+| [`@theoplayer/react-native-ui`](https://github.com/THEOplayer/react-native-theoplayer-ui)                                 | React Native user interface                          | [![npm](https://img.shields.io/npm/v/@theoplayer/react-native-ui)](https://www.npmjs.com/package/@theoplayer/react-native-ui)                                 |
+| [`@theoplayer/react-native-connector-template`](https://github.com/THEOplayer/react-native-theoplayer-connector-template) | A template for `react-native-theoplayer` connectors. | [![npm](https://img.shields.io/npm/v/@theoplayer/react-native-connector-template)](https://www.npmjs.com/package/@theoplayer/react-native-connector-template) |
 
 ## Getting Started
 
@@ -86,6 +87,7 @@ and discussed in the next section. Finally, an overview of features, limitations
   - [Casting with Chromecast and Airplay](./doc/cast.md)
   - [Custom iOS framework](./doc/custom-ios-framework.md)
   - [Digital Rights Management (DRM)](./doc/drm.md)
-  - [Picture-in-Picture (PiP)](./doc/pip.md)
   - [Migrating to `react-native-theoplayer` v2.x](./doc/migrating_v2.md)
+  - [Picture-in-Picture (PiP)](./doc/pip.md)
+  - [Styling subtitles and closed captions](./doc/texttrackstyles.md)
 - [Limitations and known issues](./doc/limitations.md)

package/android/src/main/AndroidManifest.xml

@@ -40,7 +40,7 @@
       </intent-filter>
     </service>
 
-    <receiver android:name="com.theoplayer.media.CustomMediaButtonReceiver"
+    <receiver android:name="androidx.media.session.MediaButtonReceiver"
       android:exported="false">
       <intent-filter>
         <action android:name="android.intent.action.MEDIA_BUTTON" />

package/android/src/main/java/com/theoplayer/PlayerEventEmitter.kt

@@ -6,9 +6,11 @@ import androidx.annotation.StringDef
 import com.facebook.react.bridge.Arguments
 import com.facebook.react.bridge.ReactApplicationContext
 import com.facebook.react.bridge.WritableMap
+import com.facebook.react.bridge.WritableNativeMap
 import com.facebook.react.uimanager.events.ReactEventEmitter
 import com.theoplayer.ads.AdEventAdapter
 import com.theoplayer.ads.AdEventAdapter.AdEventEmitter
+import com.theoplayer.android.api.THEOplayerGlobal
 import com.theoplayer.android.api.error.THEOplayerException
 import com.theoplayer.android.api.event.EventListener
 import com.theoplayer.android.api.event.EventType
@@ -76,6 +78,8 @@ private const val EVENT_VOLUMECHANGE = "onNativeVolumeChange"
 
 private const val EVENT_PROP_TYPE = "type"
 private const val EVENT_PROP_STATE = "state"
+private const val EVENT_PROP_VERSION = "version"
+private const val EVENT_PROP_SUITE_VERSION = "playerSuiteVersion"
 
 @Suppress("UNCHECKED_CAST")
 class PlayerEventEmitter internal constructor(
@@ -273,15 +277,12 @@ class PlayerEventEmitter internal constructor(
         .source(player.source)
         .currentTime(player.currentTime)
         .currentProgramDateTime(player.currentProgramDateTime)
-//        .presentationMode()
         .paused(player.isPaused)
         .playbackRate(player.playbackRate)
         .duration(player.duration)
         .volume(player.volume, player.isMuted)
         .seekable(player.seekable)
         .buffered(player.buffered)
-//        .error(player.error)
-//        .readyState(player.readyState)
         .textTracks(player.textTracks)
         .audioTracks(player.audioTracks)
         .videoTracks(player.videoTracks)
@@ -290,6 +291,10 @@ class PlayerEventEmitter internal constructor(
         .selectedVideoTrack(getSelectedVideoTrack(player))
         .build()
     )
+    payload.putMap(EVENT_PROP_VERSION, WritableNativeMap().apply {
+      putString(EVENT_PROP_VERSION, THEOplayerGlobal.getVersion())
+      putString(EVENT_PROP_SUITE_VERSION, THEOplayerGlobal.getPlayerSuiteVersion())
+    })
 
     // Notify the player is ready
     receiveEvent(EVENT_PLAYER_READY, payload)
@@ -489,7 +494,7 @@ class PlayerEventEmitter internal constructor(
   }
 
   private fun <T : Quality?> activeTrack(tracks: MediaTrackList<T>?): MediaTrack<T>? {
-    return tracks?.first { track ->
+    return tracks?.firstOrNull { track ->
       track.isEnabled
     }
   }

package/android/src/main/java/com/theoplayer/ReactTHEOplayerContext.kt

@@ -1,10 +1,12 @@
 package com.theoplayer
 
+import android.app.UiModeManager
 import android.content.ComponentName
 import android.content.Context
 import android.content.Intent
 import android.content.ServiceConnection
 import android.content.pm.PackageManager
+import android.content.res.Configuration
 import android.os.Handler
 import android.os.IBinder
 import android.os.Looper
@@ -59,6 +61,10 @@ class ReactTHEOplayerContext private constructor(
   val player: Player
     get() = playerView.player
 
+  private val uiModeManager by lazy {
+      reactContext.getSystemService(Context.UI_MODE_SERVICE) as? UiModeManager
+  }
+
   var daiIntegration: GoogleDaiIntegration? = null
   var imaIntegration: GoogleImaIntegration? = null
   var castIntegration: CastIntegration? = null
@@ -66,6 +72,8 @@ class ReactTHEOplayerContext private constructor(
 
   private val isBackgroundAudioEnabled: Boolean
     get() = backgroundAudioConfig.enabled
+  private val isTV: Boolean
+    get() = uiModeManager?.currentModeType == Configuration.UI_MODE_TYPE_TELEVISION
 
   companion object {
     fun create(
@@ -112,6 +120,8 @@ class ReactTHEOplayerContext private constructor(
     config: BackgroundAudioConfig,
     prevConfig: BackgroundAudioConfig?
   ) {
+    playerView.settings.setAllowBackgroundPlayback(config.enabled)
+
     if (prevConfig?.enabled == config.enabled) {
       // No changes
       return
@@ -136,7 +146,7 @@ class ReactTHEOplayerContext private constructor(
     // Reduce allowed set of remote control playback actions for ads & live streams.
     val isLive = player.duration.isInfinite()
     val isInAd = player.ads.isPlaying
-    mediaSessionConnector?.enabledPlaybackActions = if (isInAd || isLive) {
+    mediaSessionConnector?.enabledPlaybackActions = if (isInAd || isLive && !isTV) {
       0
     } else {
       ALLOWED_PLAYBACK_ACTIONS
@@ -312,9 +322,9 @@ class ReactTHEOplayerContext private constructor(
   fun onHostPause() {
     // Keep current playing state when going to background
     wasPlayingOnHostPause = !player.isPaused
-
+    playerView.onPause()
     if (!isBackgroundAudioEnabled) {
-      playerView.onPause()
+      mediaSessionConnector?.setActive(false)
     }
   }
 
@@ -322,10 +332,8 @@ class ReactTHEOplayerContext private constructor(
    * The host activity is resumed.
    */
   fun onHostResume() {
-    if (!isBackgroundAudioEnabled) {
-      mediaSessionConnector?.setActive(true)
-      playerView.onResume()
-    }
+    mediaSessionConnector?.setActive(true)
+    playerView.onResume()
   }
 
   fun destroy() {

package/android/src/main/java/com/theoplayer/player/PlayerModule.kt

@@ -12,11 +12,13 @@ import com.theoplayer.android.api.player.track.texttrack.TextTrackMode
 import com.theoplayer.audio.BackgroundAudioConfigAdapter
 import com.theoplayer.presentation.PipConfigAdapter
 import com.theoplayer.track.QualityListFilter
+import com.theoplayer.track.TextTrackStyleAdapter
 import com.theoplayer.track.emptyQualityList
 import com.theoplayer.util.ViewResolver
 
 private const val TAG = "PlayerModule"
 
+@Suppress("unused")
 class PlayerModule(context: ReactApplicationContext) : ReactContextBaseJavaModule(context) {
   private val viewResolver: ViewResolver
 
@@ -187,4 +189,13 @@ class PlayerModule(context: ReactApplicationContext) : ReactContextBaseJavaModul
       })
     }
   }
+
+  @ReactMethod
+  fun setTextTrackStyle(tag: Int, style: ReadableMap?) {
+    viewResolver.resolveViewByTag(tag) { view: ReactTHEOplayerView? ->
+      view?.player?.let { player ->
+        TextTrackStyleAdapter.applyTextTrackStyle(player.textTrackStyle, style)
+      }
+    }
+  }
 }

package/android/src/main/java/com/theoplayer/presentation/PipUtils.kt

@@ -35,6 +35,7 @@ private const val ACTION_RWD = ACTION_PLAY + 2
 private const val ACTION_FFD = ACTION_PLAY + 3
 private const val ACTION_IGNORE = ACTION_PLAY + 999
 private const val SKIP_TIME = 15
+private const val NO_ICON = -1
 
 private val PIP_ASPECT_RATIO_DEFAULT = Rational(16, 9)
 private val PIP_ASPECT_RATIO_MIN = Rational(100, 239)
@@ -46,8 +47,8 @@ class PipUtils(
 ) {
 
   private var enabled: Boolean = false
-  private var onPlayerAction: EventListener<PlayerEvent<*>>? = null
-  private var onAdAction: EventListener<GoogleImaAdEvent>? = null
+  private var onPlayerAction: EventListener<PlayerEvent<*>>
+  private var onAdAction: EventListener<GoogleImaAdEvent>
   private val playerEvents = listOf(PlayerEventTypes.PLAY, PlayerEventTypes.PAUSE)
   private var adEvents = listOf<GoogleImaAdEventType>()
   private val broadcastReceiver: BroadcastReceiver = buildBroadcastReceiver()
@@ -125,21 +126,24 @@ class PipUtils(
       }
 
       // Play/pause
-      // Always add this button, but send an ACTION_IGNORE if disabled.
+      // Always add this button, but send an ACTION_IGNORE and make invisible if disabled.
+      // If no RemoteActions are added, MediaSession takes over the UI.
       add(
         if (paused) {
           buildRemoteAction(
-            if (enablePlayPause) ACTION_PLAY else ACTION_IGNORE,
+            ACTION_PLAY,
             R.drawable.ic_play,
             R.string.play_pip,
-            R.string.play_desc_pip
+            R.string.play_desc_pip,
+            enablePlayPause
           )
         } else {
           buildRemoteAction(
-            if (enablePlayPause) ACTION_PAUSE else ACTION_IGNORE,
+            ACTION_PAUSE,
             R.drawable.ic_pause,
             R.string.pause_pip,
-            R.string.pause_desc_pip
+            R.string.pause_desc_pip,
+            enablePlayPause
           )
         }
       )
@@ -235,12 +239,15 @@ class PipUtils(
     requestId: Int,
     iconId: Int,
     titleId: Int,
-    descId: Int
+    descId: Int,
+    enabled: Boolean = true
   ): RemoteAction {
-    val intent = Intent(ACTION_MEDIA_CONTROL).putExtra(EXTRA_ACTION, requestId)
+    // Ignore the action if it is disabled
+    val requestCode = if (enabled) requestId else ACTION_IGNORE
+    val intent = Intent(ACTION_MEDIA_CONTROL).putExtra(EXTRA_ACTION, requestCode)
     val pendingIntent =
-      PendingIntent.getBroadcast(reactContext, requestId, intent, PendingIntent.FLAG_IMMUTABLE)
-    val icon: Icon = Icon.createWithResource(reactContext, iconId)
+      PendingIntent.getBroadcast(reactContext, requestCode, intent, PendingIntent.FLAG_IMMUTABLE)
+    val icon: Icon = Icon.createWithResource(reactContext, if (enabled) iconId else NO_ICON)
     val title = reactContext.getString(titleId)
     val desc = reactContext.getString(descId)
     return RemoteAction(icon, title, desc, pendingIntent)

package/android/src/main/java/com/theoplayer/track/TextTrackStyleAdapter.kt

@@ -0,0 +1,79 @@
+package com.theoplayer.track
+
+import android.graphics.Color
+import com.facebook.react.bridge.ReadableMap
+import com.theoplayer.android.api.player.track.texttrack.TextTrackStyle
+
+private val PROP_BACKGROUND_COLOR = "backgroundColor"
+private val PROP_EDGE_STYLE = "edgeStyle"
+private val PROP_FONT_COLOR = "fontColor"
+private val PROP_FONT_FAMILY = "fontFamily"
+private val PROP_FONT_SIZE = "fontSize"
+private val PROP_WINDOW_COLOR = "windowColor"
+private val PROP_MARGIN_LEFT = "marginLeft"
+private val PROP_MARGIN_TOP = "marginTop"
+private val PROP_COLOR_R = "r"
+private val PROP_COLOR_G = "g"
+private val PROP_COLOR_B = "b"
+private val PROP_COLOR_A = "a"
+
+object TextTrackStyleAdapter {
+
+  fun applyTextTrackStyle(style: TextTrackStyle, props: ReadableMap?) {
+    if (props == null) {
+      return
+    }
+    if (props.hasKey(PROP_BACKGROUND_COLOR)) {
+      style.backgroundColor =
+        colorFromBridgeColor(props.getMap(PROP_BACKGROUND_COLOR)) ?: Color.BLACK
+    }
+    if (props.hasKey(PROP_EDGE_STYLE)) {
+      style.edgeType = edgeStyleFromProps(props.getString(PROP_EDGE_STYLE))
+    }
+    if (props.hasKey(PROP_FONT_COLOR)) {
+      style.fontColor = colorFromBridgeColor(props.getMap(PROP_FONT_COLOR)) ?: Color.WHITE
+    }
+    if (props.hasKey(PROP_FONT_FAMILY)) {
+      val family = props.getString(PROP_FONT_FAMILY)
+      if (family != null) {
+        style.setFont(family, TextTrackStyle.FontStyle.NORMAL)
+      } else {
+        style.setFont(TextTrackStyle.FontFamily.DEFAULT, TextTrackStyle.FontStyle.NORMAL)
+      }
+    }
+    if (props.hasKey(PROP_FONT_SIZE)) {
+      style.fontSize = props.getInt(PROP_FONT_SIZE)
+    }
+    if (props.hasKey(PROP_WINDOW_COLOR)) {
+      style.windowColor = colorFromBridgeColor(props.getMap(PROP_WINDOW_COLOR)) ?: Color.TRANSPARENT
+    }
+    if (props.hasKey(PROP_MARGIN_TOP)) {
+      style.marginTop = props.getInt(PROP_MARGIN_TOP)
+    }
+    if (props.hasKey(PROP_MARGIN_LEFT)) {
+      style.marginLeft = props.getInt(PROP_MARGIN_LEFT)
+    }
+  }
+
+  private fun edgeStyleFromProps(style: String?): TextTrackStyle.EdgeType {
+    return when (style) {
+      "dropshadow" -> TextTrackStyle.EdgeType.EDGE_TYPE_DROP_SHADOW
+      "raised" -> TextTrackStyle.EdgeType.EDGE_TYPE_RAISED
+      "depressed" -> TextTrackStyle.EdgeType.EDGE_TYPE_DEPRESSED
+      "uniform" -> TextTrackStyle.EdgeType.EDGE_TYPE_OUTLINE
+      else -> TextTrackStyle.EdgeType.EDGE_TYPE_NONE
+    }
+  }
+
+  private fun colorFromBridgeColor(color: ReadableMap?): Int? {
+    if (color == null) {
+      return null
+    }
+    return Color.argb(
+      color.getInt(PROP_COLOR_A),
+      color.getInt(PROP_COLOR_R),
+      color.getInt(PROP_COLOR_G),
+      color.getInt(PROP_COLOR_B),
+    )
+  }
+}

package/android/src/main/java/com/theoplayer/util/ViewResolver.kt

@@ -6,11 +6,16 @@ import com.facebook.react.uimanager.UIManagerModule
 import com.theoplayer.ReactTHEOplayerView
 
 private const val TAG = "ViewResolver"
+private const val INVALID_TAG = -1
 
 class ViewResolver(private val reactContext: ReactApplicationContext) {
   private var uiManager: UIManagerModule? = null
 
   fun resolveViewByTag(tag: Int, onResolved: (view: ReactTHEOplayerView?) -> Unit) {
+    if (tag == INVALID_TAG) {
+      // Don't bother trying to resolve an invalid tag.
+      onResolved(null)
+    }
     if (uiManager == null) {
       uiManager = reactContext.getNativeModule(UIManagerModule::class.java)
     }
@@ -20,6 +25,7 @@ class ViewResolver(private val reactContext: ReactApplicationContext) {
       } catch (ignore: Exception) {
         // The ReactTHEOplayerView instance could not be resolved: log but do not forward exception.
         Log.w(TAG, "Failed to resolve ReactTHEOplayerView tag $tag")
+        onResolved(null)
       }
     }
   }

package/ios/THEOplayerRCTBridge.m

@@ -108,6 +108,9 @@ RCT_EXTERN_METHOD(setTargetVideoQuality:(nonnull NSNumber *)node
 RCT_EXTERN_METHOD(setPreload:(nonnull NSNumber *)node
                   type:(nonnull NSString *)type)
 
+RCT_EXTERN_METHOD(setTextTrackStyle:(nonnull NSNumber *)node
+                  textTrackStyle:(NSDictionary)textTrackStyle)
+
 @end
 
 // ----------------------------------------------------------------------------

package/ios/THEOplayerRCTPlayerAPI.swift

@@ -10,6 +10,18 @@ let ERROR_MESSAGE_PLAYER_ABR_UNSUPPORTED_FEATURE: String = "Setting an ABRconfig
 let ERROR_MESSAGE_PLAYER_QUALITY_UNSUPPORTED_FEATURE: String = "Setting a target video quality is not supported on iOS/tvOS."
 let ERROR_MESSAGE_PLAYER_FULLSCREEN_UNSUPPORTED_FEATURE: String = "Fullscreen presentationmode should be implemented on the RN level for iOS/tvOS."
 
+let TTS_PROP_BACKGROUND_COLOR = "backgroundColor"
+let TTS_PROP_EDGE_STYLE = "edgeStyle"
+let TTS_PROP_FONT_COLOR = "fontColor"
+let TTS_PROP_FONT_FAMILY = "fontFamily"
+let TTS_PROP_FONT_SIZE = "fontSize"
+let TTS_PROP_MARGIN_LEFT = "marginLeft"
+let TTS_PROP_MARGIN_TOP = "marginTop"
+let TTS_PROP_COLOR_R = "r"
+let TTS_PROP_COLOR_G = "g"
+let TTS_PROP_COLOR_B = "b"
+let TTS_PROP_COLOR_A = "a"
+
 @objc(THEOplayerRCTPlayerAPI)
 class THEOplayerRCTPlayerAPI: NSObject, RCTBridgeModule {
     @objc var bridge: RCTBridge!
@@ -251,4 +263,44 @@ class THEOplayerRCTPlayerAPI: NSObject, RCTBridgeModule {
         }
     }
     
+    @objc(setTextTrackStyle:textTrackStyle:)
+    func setTextTrackStyle(_ node: NSNumber, textTrackStyle: NSDictionary) -> Void {
+        DispatchQueue.main.async {
+            if let theView = self.bridge.uiManager.view(forReactTag: node) as? THEOplayerRCTView,
+               let player = theView.player {
+                if let bgColorMap = textTrackStyle[TTS_PROP_BACKGROUND_COLOR] as? [String:Any],
+                   let r = bgColorMap[TTS_PROP_COLOR_R] as? Int,
+                   let g = bgColorMap[TTS_PROP_COLOR_G] as? Int,
+                   let b = bgColorMap[TTS_PROP_COLOR_B] as? Int,
+                   let a = bgColorMap[TTS_PROP_COLOR_A] as? Int {
+                    let bgColor = UIColor(red: CGFloat(r)/255.0, green: CGFloat(g)/255.0, blue: CGFloat(b)/255.0, alpha: CGFloat(a)/255.0)
+                    player.textTrackStyle?.backgroundColor = [TextTrackStyleRuleColor(bgColor)]
+                }
+                if let fontColorMap = textTrackStyle[TTS_PROP_FONT_COLOR] as? [String:Any],
+                   let r = fontColorMap[TTS_PROP_COLOR_R] as? Int,
+                   let g = fontColorMap[TTS_PROP_COLOR_G] as? Int,
+                   let b = fontColorMap[TTS_PROP_COLOR_B] as? Int,
+                   let a = fontColorMap[TTS_PROP_COLOR_A] as? Int {
+                    let fontColor = UIColor(red: CGFloat(r)/255.0, green: CGFloat(g)/255.0, blue: CGFloat(b)/255.0, alpha: CGFloat(a)/255.0)
+                    player.textTrackStyle?.fontColor = [TextTrackStyleRuleColor(fontColor)]
+                }
+                if let edgeStyle = textTrackStyle[TTS_PROP_EDGE_STYLE] as? String {
+                    player.textTrackStyle?.edgeStyle = [TextTrackStyleRuleString(THEOplayerRCTTypeUtils.textTrackEdgeStyleStringFromString(edgeStyle))]
+                }
+                if let fontFamily = textTrackStyle[TTS_PROP_FONT_FAMILY] as? String {
+                    player.textTrackStyle?.fontFamily = [TextTrackStyleRuleString(fontFamily)]
+                }
+                if let fontSize = textTrackStyle[TTS_PROP_FONT_SIZE] as? Int {
+                    player.textTrackStyle?.fontSize = [TextTrackStyleRuleNumber(fontSize)]
+                }
+                if let marginTop = textTrackStyle[TTS_PROP_MARGIN_TOP] as? Int {
+                    player.textTrackStyle?.marginTop = [TextTrackStyleRuleNumber(marginTop)]
+                }
+                if let marginLeft = textTrackStyle[TTS_PROP_MARGIN_LEFT] as? Int {
+                    player.textTrackStyle?.marginLeft = [TextTrackStyleRuleNumber(marginLeft)]
+                }
+            }
+        }
+    }
+    
 }

package/ios/THEOplayerRCTTypeUtils.swift

@@ -83,4 +83,19 @@ class THEOplayerRCTTypeUtils {
             return "fit"
         }
     }
+    
+    class func textTrackEdgeStyleStringFromString(_ style: String) -> String {
+        switch style {
+        case "dropshadow":
+            return TextTrackStyleEdgeStyle.dropShadow
+        case "raised":
+            return TextTrackStyleEdgeStyle.raised
+        case "depressed":
+            return TextTrackStyleEdgeStyle.depressed
+        case "uniform":
+            return TextTrackStyleEdgeStyle.uniform
+        default:
+            return TextTrackStyleEdgeStyle.none
+        }
+    }
 }

package/ios/THEOplayerRCTView.swift

@@ -87,8 +87,15 @@ public class THEOplayerRCTView: UIView {
     
     private func notifyNativePlayerReady() {
         DispatchQueue.main.async {
+            let versionString = THEOplayer.version
+            let suiteVersionString = THEOplayer.playerSuiteVersion
             if let forwardedNativeReady = self.onNativePlayerReady {
-                forwardedNativeReady([:])
+                forwardedNativeReady([
+                    "version":  [
+                        "version" : versionString,
+                        "playerSuiteVersion": suiteVersionString
+                    ],
+                ])
             }
         }
     }

package/ios/ads/THEOplayerRCTAdsAPI+DAI.swift

@@ -11,7 +11,7 @@ let ERROR_MESSAGE_DAI_GET_SNAPBACK_UNDEFINED = "Undefined dai snapback"
 
 extension THEOplayerRCTAdsAPI {
     
-#if GOOGLE_DAI
+#if GOOGLE_DAI || canImport(THEOplayerGoogleIMAIntegration)
     @objc(daiSnapback:resolver:rejecter:)
     func daiSnapback(_ node: NSNumber, resolve: @escaping RCTPromiseResolveBlock, reject: @escaping RCTPromiseRejectBlock) -> Void {
         DispatchQueue.main.async {

package/ios/ads/THEOplayerRCTSourceDescriptionBuilder+Ads.swift

@@ -77,7 +77,7 @@ extension THEOplayerRCTSourceDescriptionBuilder {
     }
 
     static func buildDAITypedSource(_ typedSourceData: [String:Any], contentProtection: MultiplatformDRMConfiguration?) -> TypedSource? {
-#if GOOGLE_DAI
+#if GOOGLE_DAI || canImport(THEOplayerGoogleIMAIntegration)
         // check for alternative Google DAI SSAI
         if let ssaiData = typedSourceData[SD_PROP_SSAI] as? [String:Any] {
             if let integration = ssaiData[SD_PROP_INTEGRATION] as? String,

package/ios/ads/THEOplayerRCTView+AdsConfig.swift

@@ -72,7 +72,7 @@ extension THEOplayerRCTView {
     
     func parseAdsConfig(configDict: NSDictionary) {}
     
-#if GOOGLE_IMA || canImport(THEOplayerGoogleIMAIntegration)
+#if (GOOGLE_IMA || GOOGLE_DAI) || canImport(THEOplayerGoogleIMAIntegration)
     func playerAdsConfiguration() -> AdsConfiguration? { return AdsConfiguration() }
 #else
     func playerAdsConfiguration() -> AdsConfiguration? { return nil }

package/ios/backgroundAudio/THEOplayerRCTNowPlayingManager.swift

@@ -79,13 +79,13 @@ class THEOplayerRCTNowPlayingManager {
     }
     
     private func getArtWorkUrlStringFromSourceDescription(_ sourceDescription: SourceDescription) -> String? {
-        if let posterUrlString = sourceDescription.poster?.absoluteString {
-            return posterUrlString
-        }
         if let metadata = sourceDescription.metadata,
            let displayIconUrlString = metadata.metadataKeys?["displayIconUri"] as? String {
             return displayIconUrlString
         }
+        if let posterUrlString = sourceDescription.poster?.absoluteString {
+            return posterUrlString
+        }
         
         return nil
     }

package/lib/commonjs/api/player/PlayerVersion.js

@@ -0,0 +1,2 @@
+"use strict";
+//# sourceMappingURL=PlayerVersion.js.map

package/lib/commonjs/api/player/PlayerVersion.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["PlayerVersion.ts"],"sourcesContent":["export interface PlayerVersion {\n  /**\n   * The version of the THEOplayer SDK.\n   *\n   * @public\n   */\n  readonly version: string;\n\n  /**\n   * The player suite version of the THEOplayer SDK.\n   *\n   * @public\n   */\n  readonly playerSuiteVersion: string;\n}\n"],"mappings":""}

package/lib/commonjs/api/player/THEOplayer.js.map

@@ -1 +1 @@
-{"version":3,"names":["AspectRatio","exports"],"sources":["THEOplayer.ts"],"sourcesContent":["import type { EventDispatcher } from '../event/EventDispatcher';\nimport type { PlayerEventMap } from './PlayerEventMap';\nimport type { ABRConfiguration } from '../abr/ABRConfiguration';\nimport type { SourceDescription } from '../source/SourceDescription';\nimport type { AdsAPI } from '../ads/AdsAPI';\nimport type { CastAPI } from '../cast/CastAPI';\nimport type { MediaTrack } from '../track/MediaTrack';\nimport type { TextTrack } from '../track/TextTrack';\nimport type { TimeRange } from '../timeranges/TimeRange';\nimport type { TextTrackStyle } from '../track/TextTrackStyle';\nimport type { PresentationMode } from '../presentation/PresentationMode';\nimport type { PiPConfiguration } from '../pip/PiPConfiguration';\nimport type { BackgroundAudioConfiguration } from '../backgroundAudio/BackgroundAudioConfiguration';\n\nexport type PreloadType = 'none' | 'metadata' | 'auto' | '';\n\n/**\n * Specifies an aspect ratio for the player.\n *\n * <br/> - `FIT` (default): Scales the player so that all content fits inside its bounding box, keeping the original aspect ratio of the content..\n * <br/> - `FILL`: Scales the player so that all content fits inside the bounding box, which will be stretched to fill it entirely.\n * <br/> - `ASPECT_FILL`: Scales the player so that the content fills up the entire bounding box, keeping the original aspect ratio of the content.\n *\n * @public\n * @defaultValue `'FIT'`\n */\nexport enum AspectRatio {\n  FIT = 'fit',\n  FILL = 'fill',\n  ASPECT_FILL = 'aspectFill',\n}\n\nexport type NativeHandleType = unknown;\n\n/**\n * The THEOplayer API.\n */\nexport interface THEOplayer extends EventDispatcher<PlayerEventMap> {\n  /**\n   * The player's adaptive bitrate (ABR) configuration.\n   *\n   * @remarks\n   * <br/> - This property is supported on Android & Web platforms only.\n   */\n  readonly abr: ABRConfiguration | undefined;\n\n  /**\n   * A source description that determines the current media resource.\n   */\n  source: SourceDescription | undefined;\n\n  /**\n   * Start or resume playback.\n   */\n  play(): void;\n\n  /**\n   * Pause playback.\n   */\n  pause(): void;\n\n  /**\n   * Whether the player is paused.\n   */\n  readonly paused: boolean;\n\n  /**\n   * Whether the player should immediately start playback after source change.\n   */\n  autoplay: boolean;\n\n  /**\n   * The preload setting of the player.\n   */\n  preload: PreloadType;\n\n  /**\n   * Returns a list of TimeRanges that represents the ranges of the media resource that are seekable by the player.\n   */\n  seekable: TimeRange[];\n\n  /**\n   * Returns a list of TimeRanges that represents the ranges of the media resource that are buffered by the player.\n   */\n  buffered: TimeRange[];\n\n  /**\n   * Used to set the playback rate of the media.\n   *\n   * @example\n   * <br/> - `playbackRate = 0.70` will slow down the playback rate of the media by 30%.\n   * <br/> - `playbackRate = 1.25` will speed up the playback rate of the media by 25%.\n   *\n   * @remarks\n   * <br/> - Playback rate is represented by a number where `1` is default playback speed.\n   * <br/> - Playback rate must be a positive number.\n   * <br/> - It is recommended that you limit the range to between 0.5 and 4.\n   */\n  playbackRate: number;\n\n  /**\n   * Used to set the volume of the audio.\n   *\n   * @remarks\n   * <br/> - Volume is represented by a floating point number between `0.0` and `1.0`.\n   */\n  volume: number;\n\n  /**\n   * Determines whether audio is muted.\n   */\n  muted: boolean;\n\n  /**\n   * Whether the player is seeking.\n   */\n  readonly seeking: boolean;\n\n  /**\n   * The PresentationMode of the player. Can be switched to: `picture-in-picture`, `fullscreen` or `inline`\n   */\n  presentationMode: PresentationMode;\n\n  /**\n   * List of audio tracks of the current source.\n   */\n  audioTracks: MediaTrack[];\n\n  /**\n   * List of video tracks of the current source.\n   */\n  videoTracks: MediaTrack[];\n\n  /**\n   * List of text tracks of the current source.\n   */\n  textTracks: TextTrack[];\n\n  /**\n   * Used to set the current selected text track by passing its `uid`, or `undefined` to select none.\n   */\n  selectedTextTrack: number | undefined;\n\n  /**\n   * The text track style API.\n   *\n   * @remarks\n   * Only available for Web.\n   */\n  readonly textTrackStyle: TextTrackStyle;\n\n  /**\n   * Used to set the current selected video track by passing its `uid`, or `undefined` to select none.\n   */\n  selectedVideoTrack: number | undefined;\n\n  /**\n   * Used to set the current selected video quality by passing its `uid`, or `undefined` to select none.\n   */\n  targetVideoQuality: number | number[] | undefined;\n\n  /**\n   * Used to set the current selected audio track by passing its `uid`, or `undefined` to select none.\n   */\n  selectedAudioTrack: number | undefined;\n\n  /**\n   * The current playback position of the media, in milliseconds.\n   */\n  currentTime: number;\n\n  /**\n   * Used to set the aspect ratio of the player.\n   *\n   * @remarks\n   * Only available for iOS and Android.\n   */\n  aspectRatio: AspectRatio;\n\n  /**\n   * The active configuration for PiP.\n   */\n  pipConfiguration: PiPConfiguration;\n\n  /**\n   * The active configuration for PiP.\n   */\n  backgroundAudioConfiguration: BackgroundAudioConfiguration;\n\n  /**\n   * The duration of the media, in milliseconds.\n   */\n  readonly duration: number;\n\n  /**\n   * The API for advertisements.\n   */\n  readonly ads: AdsAPI;\n\n  /**\n   * The API for casting devices.\n   */\n  readonly cast: CastAPI;\n\n  /**\n   * Native player handle.\n   */\n  readonly nativeHandle: NativeHandleType;\n}\n"],"mappings":";;;;;;AAgBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA,IAUYA,WAAW;AAAAC,OAAA,CAAAD,WAAA,GAAAA,WAAA;AAAA,WAAXA,WAAW;EAAXA,WAAW;EAAXA,WAAW;EAAXA,WAAW;AAAA,GAAXA,WAAW,KAAAC,OAAA,CAAAD,WAAA,GAAXA,WAAW"}
+{"version":3,"names":["AspectRatio","exports"],"sources":["THEOplayer.ts"],"sourcesContent":["import type { EventDispatcher } from '../event/EventDispatcher';\nimport type { PlayerEventMap } from './PlayerEventMap';\nimport type { ABRConfiguration } from '../abr/ABRConfiguration';\nimport type { SourceDescription } from '../source/SourceDescription';\nimport type { AdsAPI } from '../ads/AdsAPI';\nimport type { CastAPI } from '../cast/CastAPI';\nimport type { MediaTrack } from '../track/MediaTrack';\nimport type { TextTrack } from '../track/TextTrack';\nimport type { TimeRange } from '../timeranges/TimeRange';\nimport type { TextTrackStyle } from '../track/TextTrackStyle';\nimport type { PresentationMode } from '../presentation/PresentationMode';\nimport type { PiPConfiguration } from '../pip/PiPConfiguration';\nimport type { BackgroundAudioConfiguration } from '../backgroundAudio/BackgroundAudioConfiguration';\nimport type { PlayerVersion } from './PlayerVersion';\n\nexport type PreloadType = 'none' | 'metadata' | 'auto' | '';\n\n/**\n * Specifies an aspect ratio for the player.\n *\n * <br/> - `FIT` (default): Scales the player so that all content fits inside its bounding box, keeping the original aspect ratio of the content..\n * <br/> - `FILL`: Scales the player so that all content fits inside the bounding box, which will be stretched to fill it entirely.\n * <br/> - `ASPECT_FILL`: Scales the player so that the content fills up the entire bounding box, keeping the original aspect ratio of the content.\n *\n * @public\n * @defaultValue `'FIT'`\n */\nexport enum AspectRatio {\n  FIT = 'fit',\n  FILL = 'fill',\n  ASPECT_FILL = 'aspectFill',\n}\n\nexport type NativeHandleType = unknown;\n\n/**\n * The THEOplayer API.\n */\nexport interface THEOplayer extends EventDispatcher<PlayerEventMap> {\n  /**\n   * The player's adaptive bitrate (ABR) configuration.\n   *\n   * @remarks\n   * <br/> - This property is supported on Android & Web platforms only.\n   */\n  readonly abr: ABRConfiguration | undefined;\n\n  /**\n   * A source description that determines the current media resource.\n   */\n  source: SourceDescription | undefined;\n\n  /**\n   * Start or resume playback.\n   */\n  play(): void;\n\n  /**\n   * Pause playback.\n   */\n  pause(): void;\n\n  /**\n   * Whether the player is paused.\n   */\n  readonly paused: boolean;\n\n  /**\n   * Whether the player should immediately start playback after source change.\n   */\n  autoplay: boolean;\n\n  /**\n   * The preload setting of the player.\n   */\n  preload: PreloadType;\n\n  /**\n   * Returns a list of TimeRanges that represents the ranges of the media resource that are seekable by the player.\n   */\n  seekable: TimeRange[];\n\n  /**\n   * Returns a list of TimeRanges that represents the ranges of the media resource that are buffered by the player.\n   */\n  buffered: TimeRange[];\n\n  /**\n   * Used to set the playback rate of the media.\n   *\n   * @example\n   * <br/> - `playbackRate = 0.70` will slow down the playback rate of the media by 30%.\n   * <br/> - `playbackRate = 1.25` will speed up the playback rate of the media by 25%.\n   *\n   * @remarks\n   * <br/> - Playback rate is represented by a number where `1` is default playback speed.\n   * <br/> - Playback rate must be a positive number.\n   * <br/> - It is recommended that you limit the range to between 0.5 and 4.\n   */\n  playbackRate: number;\n\n  /**\n   * Used to set the volume of the audio.\n   *\n   * @remarks\n   * <br/> - Volume is represented by a floating point number between `0.0` and `1.0`.\n   */\n  volume: number;\n\n  /**\n   * Determines whether audio is muted.\n   */\n  muted: boolean;\n\n  /**\n   * Whether the player is seeking.\n   */\n  readonly seeking: boolean;\n\n  /**\n   * The PresentationMode of the player. Can be switched to: `picture-in-picture`, `fullscreen` or `inline`\n   */\n  presentationMode: PresentationMode;\n\n  /**\n   * List of audio tracks of the current source.\n   */\n  audioTracks: MediaTrack[];\n\n  /**\n   * List of video tracks of the current source.\n   */\n  videoTracks: MediaTrack[];\n\n  /**\n   * List of text tracks of the current source.\n   */\n  textTracks: TextTrack[];\n\n  /**\n   * Used to set the current selected text track by passing its `uid`, or `undefined` to select none.\n   */\n  selectedTextTrack: number | undefined;\n\n  /**\n   * The text track style API.\n   *\n   * @remarks\n   * Only available for Web.\n   */\n  readonly textTrackStyle: TextTrackStyle;\n\n  /**\n   * Used to set the current selected video track by passing its `uid`, or `undefined` to select none.\n   */\n  selectedVideoTrack: number | undefined;\n\n  /**\n   * Used to set the current selected video quality by passing its `uid`, or `undefined` to select none.\n   */\n  targetVideoQuality: number | number[] | undefined;\n\n  /**\n   * Used to set the current selected audio track by passing its `uid`, or `undefined` to select none.\n   */\n  selectedAudioTrack: number | undefined;\n\n  /**\n   * The current playback position of the media, in milliseconds.\n   */\n  currentTime: number;\n\n  /**\n   * Used to set the aspect ratio of the player.\n   *\n   * @remarks\n   * Only available for iOS and Android.\n   */\n  aspectRatio: AspectRatio;\n\n  /**\n   * The active configuration for PiP.\n   */\n  pipConfiguration: PiPConfiguration;\n\n  /**\n   * The active configuration for PiP.\n   */\n  backgroundAudioConfiguration: BackgroundAudioConfiguration;\n\n  /**\n   * The duration of the media, in milliseconds.\n   */\n  readonly duration: number;\n\n  /**\n   * The API for advertisements.\n   */\n  readonly ads: AdsAPI;\n\n  /**\n   * The API for casting devices.\n   */\n  readonly cast: CastAPI;\n\n  /**\n   * The player version.\n   */\n  readonly version: PlayerVersion;\n\n  /**\n   * Native player handle.\n   */\n  readonly nativeHandle: NativeHandleType;\n}\n"],"mappings":";;;;;;AAiBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA,IAUYA,WAAW;AAAAC,OAAA,CAAAD,WAAA,GAAAA,WAAA;AAAA,WAAXA,WAAW;EAAXA,WAAW;EAAXA,WAAW;EAAXA,WAAW;AAAA,GAAXA,WAAW,KAAAC,OAAA,CAAAD,WAAA,GAAXA,WAAW"}

package/lib/commonjs/api/player/barrel.js

@@ -25,4 +25,15 @@ Object.keys(_PlayerEventMap).forEach(function (key) {
     }
   });
 });
+var _PlayerVersion = require("./PlayerVersion");
+Object.keys(_PlayerVersion).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _PlayerVersion[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _PlayerVersion[key];
+    }
+  });
+});
 //# sourceMappingURL=barrel.js.map