diff --git a/.gitmodules b/.gitmodules index f940d8bb2583..69fadb243778 100644 --- a/.gitmodules +++ b/.gitmodules @@ -27,6 +27,11 @@ url = https://github.com/THEOplayer/react-native-theoplayer.git branch = 9.x shallow = true +[submodule "react-native-v10"] + path = theoplayer_versioned_docs/version-v10/external/react-native-theoplayer + url = https://github.com/THEOplayer/react-native-theoplayer.git + branch = 10.x + shallow = true [submodule "flutter"] path = theoplayer/external/flutter-theoplayer-sdk url = https://github.com/THEOplayer/flutter-theoplayer-sdk.git @@ -46,6 +51,11 @@ url = https://github.com/THEOplayer/flutter-theoplayer-sdk.git branch = 9.x shallow = true +[submodule "flutter-v10"] + path = theoplayer_versioned_docs/version-v10/external/flutter-theoplayer-sdk + url = https://github.com/THEOplayer/flutter-theoplayer-sdk.git + branch = 10.x + shallow = true [submodule "web-connectors"] path = theoplayer/external/web-connectors url = https://github.com/THEOplayer/web-connectors.git @@ -65,6 +75,11 @@ url = https://github.com/THEOplayer/web-connectors.git branch = main shallow = true +[submodule "web-connectors-v10"] + path = theoplayer_versioned_docs/version-v10/external/web-connectors + url = https://github.com/THEOplayer/web-connectors.git + branch = main + shallow = true [submodule "android-connector"] path = theoplayer/external/android-connector url = https://github.com/THEOplayer/android-connector.git @@ -83,6 +98,12 @@ path = theoplayer_versioned_docs/version-v9/external/android-connector url = https://github.com/THEOplayer/android-connector.git branch = 9.x + shallow = true +[submodule "android-connector-v10"] + path = theoplayer_versioned_docs/version-v10/external/android-connector + url = https://github.com/THEOplayer/android-connector.git + branch = 10.x + shallow = true [submodule "ios-connector"] path = theoplayer/external/iOS-Connector url = https://github.com/THEOplayer/iOS-Connector.git @@ -101,6 +122,12 @@ path = theoplayer_versioned_docs/version-v9/external/iOS-Connector url = https://github.com/THEOplayer/iOS-Connector.git branch = 9.x + shallow = true +[submodule "ios-connector-v10"] + path = theoplayer_versioned_docs/version-v10/external/iOS-Connector + url = https://github.com/THEOplayer/iOS-Connector.git + branch = 10.x + shallow = true [submodule "react-native-connectors"] path = theoplayer/external/react-native-connectors url = https://github.com/THEOplayer/react-native-connectors.git @@ -121,6 +148,11 @@ url = https://github.com/THEOplayer/react-native-connectors.git branch = main shallow = true +[submodule "react-native-connectors-v10"] + path = theoplayer_versioned_docs/version-v10/external/react-native-connectors + url = https://github.com/THEOplayer/react-native-connectors.git + branch = main + shallow = true [submodule "web-ui"] path = open-video-ui/external/web-ui url = https://github.com/THEOplayer/web-ui.git @@ -132,4 +164,4 @@ [submodule "react-native-theoplayer-ui"] path = open-video-ui/external/react-native-theoplayer-ui url = https://github.com/THEOplayer/react-native-theoplayer-ui.git - branch = main \ No newline at end of file + branch = main diff --git a/docusaurus.config.ts b/docusaurus.config.ts index 9166045f0905..482735356aec 100644 --- a/docusaurus.config.ts +++ b/docusaurus.config.ts @@ -156,19 +156,25 @@ const config: Config = { path: 'theoplayer', routeBasePath: '/theoplayer', sidebarPath: './sidebarsTheoplayer.ts', - lastVersion: 'current', + lastVersion: 'v10', + includeCurrentVersion: !isProductionDeployment, onlyIncludeVersions: isProductionDeployment ? undefined : // v6 and v7 aren't being updated anymore. // We still have links to v4 and v8 docs, so we always need to build those. - ['current', 'v9', 'v8', 'v4'], + ['current', 'v10', 'v9', 'v8', 'v4'], versions: { current: { label: fs.readFileSync(path.join(__dirname, 'theoplayer/version.txt'), 'utf8').trim(), }, + v10: { + label: fs.readFileSync(path.join(__dirname, 'theoplayer_versioned_docs/version-v10/version.txt'), 'utf8').trim(), + banner: 'none', + noIndex: true, + }, v9: { label: fs.readFileSync(path.join(__dirname, 'theoplayer_versioned_docs/version-v9/version.txt'), 'utf8').trim(), - banner: 'none', + banner: 'unmaintained', noIndex: true, }, v8: { diff --git a/theoplayer/examples/01-basic.mdx b/theoplayer/examples/01-basic.mdx index 13de62f28b54..cea830f2ca52 100644 --- a/theoplayer/examples/01-basic.mdx +++ b/theoplayer/examples/01-basic.mdx @@ -7,7 +7,7 @@ sidebar_custom_props: { icon: '▶️' } import useBaseUrl from '@docusaurus/useBaseUrl'; import styles from './shared.module.css'; - +
Code diff --git a/theoplayer/faq/04-why-does-fullscreen-not-behave-as-expected-on-ios.md b/theoplayer/faq/04-why-does-fullscreen-not-behave-as-expected-on-ios.md index 7621a108f9cb..7d26afdc91f5 100644 --- a/theoplayer/faq/04-why-does-fullscreen-not-behave-as-expected-on-ios.md +++ b/theoplayer/faq/04-why-does-fullscreen-not-behave-as-expected-on-ios.md @@ -8,7 +8,7 @@ THEOplayer's workaround involves playback in full-window, which sets THEOplayer' Note that this solution keeps the THEOplayer UI intact, but doesn't get rid of the address bar as desired in some cases. -Alternatively, developers can use the [allowNativeFullscreen](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerConfiguration.html#allowNativeFullscreen) property mentioned here, which pushes the video element to fullscreen as seen below. +Alternatively, developers can use the [allowNativeFullscreen](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerConfiguration.html#allowNativeFullscreen) property mentioned here, which pushes the video element to fullscreen as seen below. ```js ` -Next, you add a [`FreeWheelAdDescription`](pathname:///theoplayer/v10/api-reference/web/interfaces/FreeWheelAdDescription.html) to your source that specifies the FreeWheel tokens. An example sourceDescription could look like this: +Next, you add a [`FreeWheelAdDescription`](pathname:///theoplayer/v11/api-reference/web/interfaces/FreeWheelAdDescription.html) to your source that specifies the FreeWheel tokens. An example sourceDescription could look like this: ```html ... @@ -57,6 +57,6 @@ The following resources provide more information: 1. [THEOplayer Getting Started Guide](../../getting-started/01-sdks/01-web/00-getting-started.mdx) -2. [FreeWheelAdDescription](pathname:///theoplayer/v10/api-reference/web/interfaces/FreeWheelAdDescription.html) +2. [FreeWheelAdDescription](pathname:///theoplayer/v11/api-reference/web/interfaces/FreeWheelAdDescription.html) 3. [FreeWheel website](https://freewheel.com) diff --git a/theoplayer/how-to-guides/01-ads/08-google-dai.md b/theoplayer/how-to-guides/01-ads/08-google-dai.md index 218ab5e30b53..69f72896c24d 100644 --- a/theoplayer/how-to-guides/01-ads/08-google-dai.md +++ b/theoplayer/how-to-guides/01-ads/08-google-dai.md @@ -23,7 +23,7 @@ To get THEOplayer to work, you only need to do three things: 1. Reference the THEOplayer JavaScript library (and optionally the default CSS styles). 2. Add a container which can hold your video player with HTML. -3. Create your player through JavaScript using our [API](pathname:///theoplayer/v10/api-reference/web/classes/Player.html). +3. Create your player through JavaScript using our [API](pathname:///theoplayer/v11/api-reference/web/classes/Player.html). A basic HTML page with a working THEOplayer could like the following: @@ -190,8 +190,8 @@ theoplayerView.player.addIntegration(daiIntegration) ### Using a Google DAI Source -Use a [GoogleDaiVodConfiguration](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/source/ssai/dai/GoogleDaiVodConfiguration.html) -or [GoogleDaiLiveConfiguration](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/source/ssai/dai/GoogleDaiLiveConfiguration.html) +Use a [GoogleDaiVodConfiguration](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/source/ssai/dai/GoogleDaiVodConfiguration.html) +or [GoogleDaiLiveConfiguration](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/source/ssai/dai/GoogleDaiLiveConfiguration.html) to create a `GoogleDaiTypedSource` to request stream, as demonstrated below: ```kotlin @@ -223,13 +223,13 @@ theoplayerView.player.source = SourceDescription.Builder( The Google DAI integration exposes events through the Ads API. More information is available at ["How to subscribe to ad events"](11-how-to-subscribe-to-ad-events.md#android-sdk). The integration exposes a number of additional methods. -These are available directly on the [`GoogleDaiIntegration`](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/ads/dai/GoogleDaiIntegration.html) object, +These are available directly on the [`GoogleDaiIntegration`](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/ads/dai/GoogleDaiIntegration.html) object, or indirectly through `player.ads.dai` (only for Kotlin). For example: -- [requestStream(StreamRequest, AdsRenderingSettings)]() can be used to request stream through the native Google DAI API. -- [contentTimeForStreamTime(double)]() - / [streamTimeForContentTime(double)]() can be used to convert content time to stream time and vice versa. +- [requestStream(StreamRequest, AdsRenderingSettings)]() can be used to request stream through the native Google DAI API. +- [contentTimeForStreamTime(double)]() + / [streamTimeForContentTime(double)]() can be used to convert content time to stream time and vice versa. ## iOS SDK @@ -263,7 +263,7 @@ THEOplayer SDK and Google DAI are fully pre-integrate to deliver Server-Side Ad Extra resources: -1. [Google DAI Pre-Integration API](pathname:///theoplayer/v10/api-reference/web/interfaces/GoogleDAIConfiguration.html) +1. [Google DAI Pre-Integration API](pathname:///theoplayer/v11/api-reference/web/interfaces/GoogleDAIConfiguration.html) 2. [THEOplayer Getting Started Guide](../../getting-started/01-sdks/01-web/00-getting-started.mdx) 3. [Google DAI website](https://developers.google.com/interactive-media-ads) diff --git a/theoplayer/how-to-guides/01-ads/10-google-ima.md b/theoplayer/how-to-guides/01-ads/10-google-ima.md index 8c62102257e2..10e5577a01c7 100644 --- a/theoplayer/how-to-guides/01-ads/10-google-ima.md +++ b/theoplayer/how-to-guides/01-ads/10-google-ima.md @@ -57,7 +57,7 @@ player.source = { ### Limitations -- There's a known issue within the IMA HTML5 SDK where it does not work well with multiple VPAID ads in a VMAP. More specifically when the `ImaSdkSetting` `vpaidMode` is set to `enabled` and the `AdsRenderingSetting` `enablePreloading` is set to `true`, it will not manage to play all ads (these are the default configurations when using the Google IMA integration in THEOplayer). The production IMA SDK doesn't throw any error in this scenario, the [debug SDK](https://imasdk.googleapis.com/js/sdkloader/ima3_debug.js), however, prints `Vpaid Error: VPAID ad called play on video element before start was called on VPAID manager` in the console in this case. This can be resolved by either using `vpaidMode` `insecure` or by disabling preloading. Both can be achieved by specifying your preference in the [AdsConfiguration](pathname:///theoplayer/v10/api-reference/web/interfaces/AdsConfiguration.html). +- There's a known issue within the IMA HTML5 SDK where it does not work well with multiple VPAID ads in a VMAP. More specifically when the `ImaSdkSetting` `vpaidMode` is set to `enabled` and the `AdsRenderingSetting` `enablePreloading` is set to `true`, it will not manage to play all ads (these are the default configurations when using the Google IMA integration in THEOplayer). The production IMA SDK doesn't throw any error in this scenario, the [debug SDK](https://imasdk.googleapis.com/js/sdkloader/ima3_debug.js), however, prints `Vpaid Error: VPAID ad called play on video element before start was called on VPAID manager` in the console in this case. This can be resolved by either using `vpaidMode` `insecure` or by disabling preloading. Both can be achieved by specifying your preference in the [AdsConfiguration](pathname:///theoplayer/v11/api-reference/web/interfaces/AdsConfiguration.html). ## Android SDK @@ -101,7 +101,7 @@ theoplayerView.player.addIntegration(imaIntegration) ### Use a `GoogleImaAdDescription` -Use a [`GoogleImaAdDescription`](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/source/addescription/GoogleImaAdDescription.html) to schedule advertisements, +Use a [`GoogleImaAdDescription`](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/source/addescription/GoogleImaAdDescription.html) to schedule advertisements, as demonstrated below: ```kotlin @@ -124,9 +124,9 @@ theoplayerView.player.source = sourceDescription The Google IMA integration exposes events through the Ads API. More information is available at ["How to subscribe to ad events"](11-how-to-subscribe-to-ad-events.md#android-sdk). The integration exposes a number of additional methods. -These are available directly on the [`GoogleImaIntegration`](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/ads/ima/GoogleImaIntegration.html) object, or indirectly through `player.ads.ima` (only for Kotlin). -For example, [`schedule()`]() can be used to schedule ads dynamically, -and [`requestAds()`]() can be used to request ads through the native Google IMA API. +These are available directly on the [`GoogleImaIntegration`](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/ads/ima/GoogleImaIntegration.html) object, or indirectly through `player.ads.ima` (only for Kotlin). +For example, [`schedule()`]() can be used to schedule ads dynamically, +and [`requestAds()`]() can be used to request ads through the native Google IMA API. ### Updating the Google IMA SDK diff --git a/theoplayer/how-to-guides/01-ads/11-how-to-subscribe-to-ad-events.md b/theoplayer/how-to-guides/01-ads/11-how-to-subscribe-to-ad-events.md index d3ffe0c4374a..9c6812e4f5a3 100644 --- a/theoplayer/how-to-guides/01-ads/11-how-to-subscribe-to-ad-events.md +++ b/theoplayer/how-to-guides/01-ads/11-how-to-subscribe-to-ad-events.md @@ -21,10 +21,10 @@ If you are scheduling [client-side advertisements](03-how-to-set-up-vast-and-vma #### Web SDK -The `Player` API exposes an [`ads`](pathname:///theoplayer/v10/api-reference/web/classes/ChromelessPlayer.html#ads) property which belongs to the [`Ads`](pathname:///theoplayer/v10/api-reference/web/interfaces/Ads.html) interface. Because this [`Ads`](pathname:///theoplayer/v10/api-reference/web/interfaces/Ads.html) interface inherits from [`EventDispatcher`](pathname:///theoplayer/v10/api-reference/web/interfaces/AdsEventMap.html), +The `Player` API exposes an [`ads`](pathname:///theoplayer/v11/api-reference/web/classes/ChromelessPlayer.html#ads) property which belongs to the [`Ads`](pathname:///theoplayer/v11/api-reference/web/interfaces/Ads.html) interface. Because this [`Ads`](pathname:///theoplayer/v11/api-reference/web/interfaces/Ads.html) interface inherits from [`EventDispatcher`](pathname:///theoplayer/v11/api-reference/web/interfaces/AdsEventMap.html), you can leverage event listeners in this interface. -The ad-related events are documented in [`AdsEventMap`](pathname:///theoplayer/v10/api-reference/web/interfaces/AdsEventMap.html). +The ad-related events are documented in [`AdsEventMap`](pathname:///theoplayer/v11/api-reference/web/interfaces/AdsEventMap.html). To subscribe to an event, you select an event from this page, use the `Ads` interface, call the `addEventListener` method, and set the event as the first parameter, and the callback as the second parameter. @@ -77,9 +77,9 @@ When you do the same for the `csai` ad integration, you get the following events #### Android SDK -The `Player` API exposes an [`getAds()`](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/player/Player.html#getAds--) method which belongs to the [`Ads`](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/ads/Ads.html) interface. Because this `Ads` interface inherits from [`EventDispatcher`](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/event/ads/AdEvent.html),you can leverage event listeners in this interface. +The `Player` API exposes an [`getAds()`](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/player/Player.html#getAds--) method which belongs to the [`Ads`](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/ads/Ads.html) interface. Because this `Ads` interface inherits from [`EventDispatcher`](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/event/ads/AdEvent.html),you can leverage event listeners in this interface. -The Android SDK currently only allows ad playback through [Google IMA](10-google-ima.md#android-sdk). The available events are documented in [`GoogleImaAdEventType`](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/ads/ima/GoogleImaAdEventType.html). +The Android SDK currently only allows ad playback through [Google IMA](10-google-ima.md#android-sdk). The available events are documented in [`GoogleImaAdEventType`](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/ads/ima/GoogleImaAdEventType.html). To subscribe to an event, you select an appropriate `GoogleImaAdEventType` or `AdsEventType`, use the `Ads` interface, call the `addEventListener` method, and set the event as the first parameter, and the callback as the second parameter. @@ -93,10 +93,10 @@ theoPlayer.ads.addEventListener(GoogleImaAdEventType.AD_BREAK_STARTED) { #### iOS/tvOS SDK -The `Player` API exposes an [`ads`](pathname:///theoplayer/v10/api-reference/ios/Classes/THEOplayer.html#/s:13THEOplayerSDK0A0C3adsAA3Ads_pvp) property which belongs to the [`Ads`](pathname:///theoplayer/v10/api-reference/ios/Protocols/Ads.html) interface. Because this `Ads` interface inherits from [`EventDispatcher`](pathname:///theoplayer/v10/api-reference/ios/Ads%20Events.html), +The `Player` API exposes an [`ads`](pathname:///theoplayer/v11/api-reference/ios/Classes/THEOplayer.html#/s:13THEOplayerSDK0A0C3adsAA3Ads_pvp) property which belongs to the [`Ads`](pathname:///theoplayer/v11/api-reference/ios/Protocols/Ads.html) interface. Because this `Ads` interface inherits from [`EventDispatcher`](pathname:///theoplayer/v11/api-reference/ios/Ads%20Events.html), you can leverage event listeners in this interface. -The ad-related events are documented in [AdsEventTypes](pathname:///theoplayer/v10/api-reference/ios/Structs/AdsEventTypes.html). +The ad-related events are documented in [AdsEventTypes](pathname:///theoplayer/v11/api-reference/ios/Structs/AdsEventTypes.html). To subscribe to an event, you select an event from this page, use the `Ads` interface, call the `addEventListener` method, and set the event as the first parameter, and the callback as the second parameter. diff --git a/theoplayer/how-to-guides/01-ads/12-mediatailor.md b/theoplayer/how-to-guides/01-ads/12-mediatailor.md index 9dacd66f1193..59f85d0749b0 100644 --- a/theoplayer/how-to-guides/01-ads/12-mediatailor.md +++ b/theoplayer/how-to-guides/01-ads/12-mediatailor.md @@ -80,7 +80,7 @@ val mediaTailorIntegration = MediaTailorIntegrationFactory.createMediaTailorInte theoplayerView.player.addIntegration(mediaTailorIntegration) ``` -Finally, set a [`MediaTailorSource`](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/source/mediatailor/MediaTailorSource.html) to play. +Finally, set a [`MediaTailorSource`](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/source/mediatailor/MediaTailorSource.html) to play. ```kotlin val mediaTailorSource = MediaTailorSource(src = "/v1/session///") diff --git a/theoplayer/how-to-guides/01-ads/13-custom-ssai-integration.md b/theoplayer/how-to-guides/01-ads/13-custom-ssai-integration.md index aecc4bd1b1d0..1b7e48b7d882 100644 --- a/theoplayer/how-to-guides/01-ads/13-custom-ssai-integration.md +++ b/theoplayer/how-to-guides/01-ads/13-custom-ssai-integration.md @@ -111,7 +111,7 @@ Finally, when the playback of the Ad is completed, `endAd(ad: Ad)` should be cal ### CustomSsaiDescriptionSerializer To hold the configuration parameters specific to your integration, you can create a new class that inherits from `CustomSsaiDescription`. -This allows it to be set on a `TypedSource` through [`TypedSource.Builder.ssai()`](). +This allows it to be set on a `TypedSource` through [`TypedSource.Builder.ssai()`](). Then, register a `CustomSsaiDescriptionSerializer` using the integration ID and provide a way to serialize/deserialize the new `CustomSsaiDescription`. Below is an example of a [YoSpace integration](https://github.com/THEOplayer/android-connector/tree/master/connectors/yospace) showing `YospaceSsaiDescription` extending `CustomSsaiDescription`: diff --git a/theoplayer/how-to-guides/02-analytics/01-moat.md b/theoplayer/how-to-guides/02-analytics/01-moat.md index d0e9def11700..1a05279e9697 100644 --- a/theoplayer/how-to-guides/02-analytics/01-moat.md +++ b/theoplayer/how-to-guides/02-analytics/01-moat.md @@ -84,7 +84,7 @@ new THEOplayer.Player(containerElement, { }); ``` -When you want to make use of Moat for tracking advertisements, you should make use of the [`IMAAdDescription`](pathname:///theoplayer/v10/api-reference/web/interfaces/IMAAdDescription.html). +When you want to make use of Moat for tracking advertisements, you should make use of the [`IMAAdDescription`](pathname:///theoplayer/v11/api-reference/web/interfaces/IMAAdDescription.html). ##### Android (TV) SDK @@ -97,7 +97,7 @@ new THEOplayerConfig.Builder() .build(); ``` -When you want to make use of Moat for tracking advertisements, you should make use of the [GoogleImaAdDescription](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/source/addescription/GoogleImaAdDescription.html). +When you want to make use of Moat for tracking advertisements, you should make use of the [GoogleImaAdDescription](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/source/addescription/GoogleImaAdDescription.html). ##### iOS (/tvOS) SDK @@ -125,6 +125,6 @@ public static var moatPreroll : SourceDescription { ## Related links: - Demo page: [https://demo.theoplayer.com/moat-analytics-pre-integration](https://demo.theoplayer.com/moat-analytics-pre-integration) -- [Analytics API (Web SDK)](pathname:///theoplayer/v10/api-reference/web/interfaces/Analytics.html) -- [Analytics API (Android SDK)](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/source/analytics/package-summary.html) -- [Analytics API (iOS SDK)]() +- [Analytics API (Web SDK)](pathname:///theoplayer/v11/api-reference/web/interfaces/Analytics.html) +- [Analytics API (Android SDK)](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/source/analytics/package-summary.html) +- [Analytics API (iOS SDK)]() diff --git a/theoplayer/how-to-guides/02-analytics/04-agama.md b/theoplayer/how-to-guides/02-analytics/04-agama.md index 0f064b2734c8..e3870362dff0 100644 --- a/theoplayer/how-to-guides/02-analytics/04-agama.md +++ b/theoplayer/how-to-guides/02-analytics/04-agama.md @@ -28,7 +28,7 @@ If you do not have this feature enabled in your SDK, or are unsure, please conta ##### Web SDK -The player configuration should include the [AgamaPlayerConfiguration](pathname:///theoplayer/v10/api-reference/web/interfaces/AgamaPlayerConfiguration.html) object. +The player configuration should include the [AgamaPlayerConfiguration](pathname:///theoplayer/v11/api-reference/web/interfaces/AgamaPlayerConfiguration.html) object. ```js var player = new THEOplayer.Player(element, { @@ -44,7 +44,7 @@ var player = new THEOplayer.Player(element, { Once a player is configured, an Agama EMP client instance is created. -The player's source configuration should include the [AgamaSourceConfiguration](pathname:///theoplayer/v10/api-reference/web/interfaces/AgamaSourceConfiguration.html) object. +The player's source configuration should include the [AgamaSourceConfiguration](pathname:///theoplayer/v11/api-reference/web/interfaces/AgamaSourceConfiguration.html) object. ```js player.source = { @@ -61,7 +61,7 @@ Once the player's source is set, a dynamic streaming session is started, and Aga ##### Android (TV) SDK -The player configuration should include the [AgamaPlayerConfiguration](pathname:///theoplayer/v10/api-reference/web/interfaces/AgamaPlayerConfiguration.html) object: +The player configuration should include the [AgamaPlayerConfiguration](pathname:///theoplayer/v11/api-reference/web/interfaces/AgamaPlayerConfiguration.html) object: ```java public THEOplayerConfig theoplayerConfig = new THEOplayerConfig.Builder() @@ -81,7 +81,7 @@ public THEOplayerView tpv = new THEOplayerView(this, theoplayerConfig) ``` Once the player is configured, an Agama EMP client is created. -The player source configuration should include the [AgamaSourceConfiguration](pathname:///theoplayer/v10/api-reference/web/interfaces/AgamaSourceConfiguration.html) object in the analytics tag while configuring the [SourceDescription](pathname:///theoplayer/v10/api-reference/web/interfaces/SourceDescription.html): +The player source configuration should include the [AgamaSourceConfiguration](pathname:///theoplayer/v11/api-reference/web/interfaces/AgamaSourceConfiguration.html) object in the analytics tag while configuring the [SourceDescription](pathname:///theoplayer/v11/api-reference/web/interfaces/SourceDescription.html): ```java public SourceDescription sourceDescription = @@ -142,7 +142,7 @@ tpv.getPlayer().setSource(agamaSourceDescription); ##### iOS (/tvOS) SDK -The player configuration should include the [AgamaPlayerConfiguration](pathname:///theoplayer/v10/api-reference/web/interfaces/AgamaPlayerConfiguration.html) object: +The player configuration should include the [AgamaPlayerConfiguration](pathname:///theoplayer/v11/api-reference/web/interfaces/AgamaPlayerConfiguration.html) object: ```swift let agamaPlayerConfiguration = AgamaPlayerConfiguration( @@ -157,7 +157,7 @@ var theoplayer = THEOplayer(configuration: THEOplayerConfiguration(..., analytic ``` Once the player is configured, an Agama EMP client is created. -The player source configuration should include the [AgamaSourceConfiguration](pathname:///theoplayer/v10/api-reference/web/interfaces/AgamaSourceConfiguration.html) object in the analytics tag: +The player source configuration should include the [AgamaSourceConfiguration](pathname:///theoplayer/v11/api-reference/web/interfaces/AgamaSourceConfiguration.html) object in the analytics tag: ```swift let agamaSourceConfiguration = AgamaSourceConfiguration( diff --git a/theoplayer/how-to-guides/02-analytics/06-custom-analytics-integration.md b/theoplayer/how-to-guides/02-analytics/06-custom-analytics-integration.md index 9280c9603673..56217018d36f 100644 --- a/theoplayer/how-to-guides/02-analytics/06-custom-analytics-integration.md +++ b/theoplayer/how-to-guides/02-analytics/06-custom-analytics-integration.md @@ -30,7 +30,7 @@ There are two prerequisites in order to continue with this guide: 1. You have a THEOplayer license. You can grab a license at [https://portal.theoplayer.com](https://portal.theoplayer.com). 2. You have some [basic knowledge](../../getting-started/01-sdks/01-web/00-getting-started.mdx) on how to use THEOplayer, - and can navigate comfortable through [the API](pathname:///theoplayer/v10/api-reference/web/) to find [relevant events](http://demo.theoplayer.com/using-events-examples). + and can navigate comfortable through [the API](pathname:///theoplayer/v11/api-reference/web/) to find [relevant events](http://demo.theoplayer.com/using-events-examples). Refer to our [getting started guide](../../getting-started/01-sdks/01-web/00-getting-started.mdx) before advancing to the code samples. @@ -41,9 +41,9 @@ You can access the video data through the THEOplayer API. Through the API, you c For example, when the `ended` event is triggered (meaning: someone completely watched the video), your callback could be that when this happens, you do a request to a remote video analytics service. -Events are organized across interfaces and subinterfaces, as illustrated by the image below. For example, the [`Player`](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html) contains +Events are organized across interfaces and subinterfaces, as illustrated by the image below. For example, the [`Player`](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html) contains general video player events like `play`, `pause` and `ended`. -The [`Ads`](pathname:///theoplayer/v10/api-reference/web/interfaces/AdsEventMap.html) interface contains events related to advertisements, +The [`Ads`](pathname:///theoplayer/v11/api-reference/web/interfaces/AdsEventMap.html) interface contains events related to advertisements, like `adbreakbegin` and `adend`. ![THEOplayer API Interfaces and Events](../../assets/img/analytics-events.png 'THEOplayer API Interfaces and Events') @@ -56,32 +56,32 @@ Below is an (incomplete) list of some common interface event maps. - Player is the interface the represents the video player instance. You use this interface to detect general video events, like a play, a pause, and so on. - - [Web](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html) - - [iOS](pathname:///theoplayer/v10/api-reference/ios/Structs/PlayerEventTypes.html) - - [Android](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/event/player/PlayerEventTypes.html) + - [Web](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html) + - [iOS](pathname:///theoplayer/v11/api-reference/ios/Structs/PlayerEventTypes.html) + - [Android](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/event/player/PlayerEventTypes.html) - Ads is the interface that represents the advertisements. You use this interface to detect when an ad starts and stops. - - [Web](pathname:///theoplayer/v10/api-reference/web/interfaces/AdsEventMap.html) - - [iOS](pathname:///theoplayer/v10/api-reference/ios/Ads%20Events.html) - - [Android](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/event/ads/AdsEventTypes.html) + - [Web](pathname:///theoplayer/v11/api-reference/web/interfaces/AdsEventMap.html) + - [iOS](pathname:///theoplayer/v11/api-reference/ios/Ads%20Events.html) + - [Android](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/event/ads/AdsEventTypes.html) - AudioTrackList is the interface that represents the list of audio tracks. You use this interface to detect when a new audio track is added, or when another audio track becomes active. - - [Web](pathname:///theoplayer/v10/api-reference/web/interfaces/TrackListEventMap.html) - - [iOS](pathname:///theoplayer/v10/api-reference/ios/Structs/AudioTrackListEventTypes.html) - - [Android](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/event/track/mediatrack/audio/list/AudioTrackListEventTypes.html) + - [Web](pathname:///theoplayer/v11/api-reference/web/interfaces/TrackListEventMap.html) + - [iOS](pathname:///theoplayer/v11/api-reference/ios/Structs/AudioTrackListEventTypes.html) + - [Android](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/event/track/mediatrack/audio/list/AudioTrackListEventTypes.html) - VideoTrack is the interface that represents a single video track containing one or more video qualities. You use this interface to detect when another video quality becomes active. - - [Web](pathname:///theoplayer/v10/api-reference/web/interfaces/MediaTrackEventMap.html) + - [Web](pathname:///theoplayer/v11/api-reference/web/interfaces/MediaTrackEventMap.html) - iOS: unavailable due to Apple limitations - - [Android](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/event/track/mediatrack/video/VideoTrackEventTypes.html) + - [Android](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/event/track/mediatrack/video/VideoTrackEventTypes.html) - TextTrackList is comparable AudioTrackList, but for subtitles, closed captions and metadata (e.g. id3, emsg, EventStream, EXT-X-DATERANGE). - - [Web](pathname:///theoplayer/v10/api-reference/web/interfaces/TrackListEventMap.html) - - [iOS](pathname:///theoplayer/v10/api-reference/ios/Structs/TextTrackListEventTypes.html) - - [Android](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/event/track/texttrack/list/TextTrackListEventTypes.html) + - [Web](pathname:///theoplayer/v11/api-reference/web/interfaces/TrackListEventMap.html) + - [iOS](pathname:///theoplayer/v11/api-reference/ios/Structs/TextTrackListEventTypes.html) + - [Android](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/event/track/texttrack/list/TextTrackListEventTypes.html) - Cast is the interface that is used to detect events related to Chromecast and AirPlay. - - [Web](pathname:///theoplayer/v10/api-reference/web/interfaces/VendorCastEventMap.html) - - iOS: [AirPlay](pathname:///theoplayer/v10/api-reference/ios/Structs/AirPlayEventTypes.html) & [Chromecast](pathname:///theoplayer/v10/api-reference/ios/Structs/ChromecastEventTypes.html) - - [Android](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/event/chromecast/package-summary.html) + - [Web](pathname:///theoplayer/v11/api-reference/web/interfaces/VendorCastEventMap.html) + - iOS: [AirPlay](pathname:///theoplayer/v11/api-reference/ios/Structs/AirPlayEventTypes.html) & [Chromecast](pathname:///theoplayer/v11/api-reference/ios/Structs/ChromecastEventTypes.html) + - [Android](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/event/chromecast/package-summary.html) - Network is the interface that is used to intercept HTTP(S) requests and responses. You should only use this API on the THEOplayer Web SDK, and only when you can't use [Service Workers](https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API/Using_Service_Workers) to accomplish the same. - [Web](../08-network/00-introduction.md) @@ -90,7 +90,7 @@ Note that maintaining the above list manually is unfortunately a no-go because o This means that you should research your events through our automatically managed API references at [https://docs.theoplayer.com/](https://docs.theoplayer.com/). For example, interfaces like VR, TextTrackCueList, VideoTrackList, Uplynk and Yospace are omitted because manually maintaining this would be too challenging. -When doing a custom analytics integration, you should also check our [Metrics](pathname:///theoplayer/v10/api-reference/web/interfaces/Metrics.html) API, +When doing a custom analytics integration, you should also check our [Metrics](pathname:///theoplayer/v11/api-reference/web/interfaces/Metrics.html) API, and our articles on [error handling](../07-miscellaneous/04-error/00-introduction.md). ### Video analytics metrics and events @@ -98,40 +98,40 @@ and our articles on [error handling](../07-miscellaneous/04-error/00-introductio Let's discuss some popular metrics, and how you could track it with a video player events. Plays (or Impressions). This metric represents the amount of plays. -You can calculate this event by identifying the first [`playing`](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#playing) event after every [`sourcechange`](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#sourcechange) event. +You can calculate this event by identifying the first [`playing`](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#playing) event after every [`sourcechange`](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#sourcechange) event. Video Startup Time (or Time-to-First-Frame or Join Latency). This metric represents the time it takes your video to start. -You can calculate this event by calculating the difference between the timestamps of the first [`playing`](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#playing) and the first [`play`](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#play) event after every [`sourcechange`](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#sourcechange) event. +You can calculate this event by calculating the difference between the timestamps of the first [`playing`](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#playing) and the first [`play`](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#play) event after every [`sourcechange`](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#sourcechange) event. Seek Time (or Seek Latency). This metric represents the time it takes for your video to resume when you scrub to another position. -You can calculate this event by calculating the difference between the timestamps of the [`seeking`](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#seeking) and the [`seeked`](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#seeked) event. +You can calculate this event by calculating the difference between the timestamps of the [`seeking`](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#seeking) and the [`seeked`](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#seeked) event. Watch Time. This metric represents how much time is spent watching content by your viewers. -You calculate this value by tracking the [`playing`](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#playing) event, -and halting it when the [`waiting`](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#waiting), -[`pause`](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#pause), -[`ended`](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#ended) or -[`error`](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#error) event occurs. +You calculate this value by tracking the [`playing`](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#playing) event, +and halting it when the [`waiting`](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#waiting), +[`pause`](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#pause), +[`ended`](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#ended) or +[`error`](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#error) event occurs. Rebuffer Ratio (or Stalls). This metric represents how often the viewer is watching the "spinner icon" versus the actual video. This metric is closely related to the Watch Time. -You can calculate this event by tracking the [`waiting`](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#waiting) event, which is triggered when the video starts to stall, -and the [`playing`](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#playing) event. +You can calculate this event by tracking the [`waiting`](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#waiting) event, which is triggered when the video starts to stall, +and the [`playing`](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#playing) event. Average Bitrate. This metric represents the average video quality that your viewers are watching. -You can calculate this metric by tracking the [`activequalitychanged`](pathname:///theoplayer/v10/api-reference/web/interfaces/MediaTrackEventMap.html#activequalitychanged) event. +You can calculate this metric by tracking the [`activequalitychanged`](pathname:///theoplayer/v11/api-reference/web/interfaces/MediaTrackEventMap.html#activequalitychanged) event. Average % Complete (or Watched Ratio). This metric represents the relative completion rate of your videos. This metric is related to the Watch Time, and related in a similar fashion. -You could also use the [`duration`](pathname:///theoplayer/v10/api-reference/web/classes/ChromelessPlayer.html#duration) to determine the length of the asset. +You could also use the [`duration`](pathname:///theoplayer/v11/api-reference/web/classes/ChromelessPlayer.html#duration) to determine the length of the asset. Exit Before Video Start. This metric represents how often your viewers aren't able to start the video, even though they had the intent to watch it. -You can calculate this metric by tracking the first [`play`](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#play) event, -and it never getting to the [`playing`](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#playing) event. +You can calculate this metric by tracking the first [`play`](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#play) event, +and it never getting to the [`playing`](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#playing) event. Video Playback Failure. This metric represents how often your viewers have a problem with playback once a video starts. -You can calculate this metric by tracking the [`error`](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#error) event -after the first [`playing`](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#playing) event. +You can calculate this metric by tracking the [`error`](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#error) event +after the first [`playing`](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#playing) event. Note that these proposed calculations are only loosely formulated to help you understand the relationship between video metrics and a video player API. @@ -246,6 +246,6 @@ A custom analytics integration gives you full control over your code, and the da Extra resources: -1. [THEOplayer API](pathname:///theoplayer/v10/api-reference/web/) +1. [THEOplayer API](pathname:///theoplayer/v11/api-reference/web/) 2. [THEOplayer Getting Started Guide](../../getting-started/01-sdks/01-web/00-getting-started.mdx) diff --git a/theoplayer/how-to-guides/03-cast/01-chromecast/00-introduction.md b/theoplayer/how-to-guides/03-cast/01-chromecast/00-introduction.md index a51d82f46a12..e53297f3920f 100644 --- a/theoplayer/how-to-guides/03-cast/01-chromecast/00-introduction.md +++ b/theoplayer/how-to-guides/03-cast/01-chromecast/00-introduction.md @@ -11,9 +11,9 @@ The Chromecast interface is a sub-interface of the Cast interface on THEOplayer The API reference is available through the following links: -- Web SDK: [Chromecast](pathname:///theoplayer/v10/api-reference/web/interfaces/Chromecast.html), which inherits from [VendorCast](pathname:///theoplayer/v10/api-reference/web/interfaces/VendorCast.html) -- Android SDK: [Chromecast](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/cast/chromecast/Chromecast.html) -- iOS SDK: [Chromecast](pathname:///theoplayer/v10/api-reference/ios/Protocols/Chromecast.html) +- Web SDK: [Chromecast](pathname:///theoplayer/v11/api-reference/web/interfaces/Chromecast.html), which inherits from [VendorCast](pathname:///theoplayer/v11/api-reference/web/interfaces/VendorCast.html) +- Android SDK: [Chromecast](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/cast/chromecast/Chromecast.html) +- iOS SDK: [Chromecast](pathname:///theoplayer/v11/api-reference/ios/Protocols/Chromecast.html) Use the API as demonstrated below: diff --git a/theoplayer/how-to-guides/03-cast/01-chromecast/03-how-to-configure-to-a-different-stream.md b/theoplayer/how-to-guides/03-cast/01-chromecast/03-how-to-configure-to-a-different-stream.md index 3e3642949ef5..6036a2c24672 100644 --- a/theoplayer/how-to-guides/03-cast/01-chromecast/03-how-to-configure-to-a-different-stream.md +++ b/theoplayer/how-to-guides/03-cast/01-chromecast/03-how-to-configure-to-a-different-stream.md @@ -28,12 +28,12 @@ You may also be interested in `onJoin` (i.e. joining an existing Chromecast sess #### Web SDK -The snippet below has two [sources](pathname:///theoplayer/v10/api-reference/web/interfaces/SourceDescription.html): +The snippet below has two [sources](pathname:///theoplayer/v11/api-reference/web/interfaces/SourceDescription.html): 1. `senderSource` is intended for playback on your sender device (i.e. your browser) 2. `chromecastSource` is intended for playback on your Chromecast application -The [`ChromecastConnectionCallback`](pathname:///theoplayer/v10/api-reference/web/interfaces/ChromecastConnectionCallback.html) interface is used to: +The [`ChromecastConnectionCallback`](pathname:///theoplayer/v11/api-reference/web/interfaces/ChromecastConnectionCallback.html) interface is used to: 1. Set the `chromecastSource` when Chromecast playback starts through the `onStart` callback. 2. Revert to the `senderSource` when Chromecast playback stops through the `onStop` callback. @@ -72,13 +72,13 @@ The `onJoin` and `onLeave` implementations in the above snippet adhere to the de #### Android SDK -The snippet below has two [sources](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/source/SourceDescription.Builder.html): +The snippet below has two [sources](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/source/SourceDescription.Builder.html): 1. `senderSource` is intended for playback on your sender device (i.e. your Android app) 2. `chromecastSource` is intended for playback on your Chromecast application -The [`setConnectionCallback`](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/cast/chromecast/Chromecast.html#setConnectionCallback-com.theoplayer.android.api.cast.chromecast.ChromecastConnectionCallback-) method is used to -through the [`THEOplayerView'](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/THEOplayerView.html) object: +The [`setConnectionCallback`](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/cast/chromecast/Chromecast.html#setConnectionCallback-com.theoplayer.android.api.cast.chromecast.ChromecastConnectionCallback-) method is used to +through the [`THEOplayerView'](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/THEOplayerView.html) object: 1. Set the `chromecastSource` when Chromecast playback starts through the `onStart` callback. 2. Revert to the `senderSource` when Chromecast playback stops through the `onStop` callback. @@ -120,16 +120,16 @@ The `onJoin` and `onLeave` implementations in the above snippet adhere to the de #### iOS/tvOS SDK and Legacy iOS/tvOS SDK (4.12.x) -To achieve this use case on the iOS SDK, you have to leverage the [`ChromecastConnectionDelegate`]() -of your [`THEOplayer`](pathname:///theoplayer/v10/api-reference/ios/Classes/THEOplayer.html) object. +To achieve this use case on the iOS SDK, you have to leverage the [`ChromecastConnectionDelegate`]() +of your [`THEOplayer`](pathname:///theoplayer/v11/api-reference/ios/Classes/THEOplayer.html) object. The snippet below is an example of how your `ChromecastConnectionDelegate` could look like. -This particular snippet has two [sources](pathname:///theoplayer/v10/api-reference/ios/Classes/SourceDescription.html): +This particular snippet has two [sources](pathname:///theoplayer/v11/api-reference/ios/Classes/SourceDescription.html): 1. `senderSource` is intended for playback on your sender device (i.e. your iOS app) 2. `chromecastSource` is intended for playback on your Chromecast application -The [`ChromecastConnectionCallback`](pathname:///theoplayer/v10/api-reference/web/interfaces/ChromecastConnectionCallback.html) interface is used to: +The [`ChromecastConnectionCallback`](pathname:///theoplayer/v11/api-reference/web/interfaces/ChromecastConnectionCallback.html) interface is used to: 1. Set the `chromecastSource` when Chromecast playback starts through the `onStart` callback. 2. Revert to the `senderSource` when Chromecast playback stops through the `onStop` callback. @@ -221,7 +221,7 @@ class PlayerViewController: UIViewController { ## Chromecast source API -The Chromecast source API is a straightforward technique to configure a different [`source`](pathname:///theoplayer/v10/api-reference/web/interfaces/SourceDescription.html) to be loaded for Chromecast playback. +The Chromecast source API is a straightforward technique to configure a different [`source`](pathname:///theoplayer/v11/api-reference/web/interfaces/SourceDescription.html) to be loaded for Chromecast playback. This API is unmaintained (and deprecated) as of THEOplayer 2.90.0, and developers should use the [ChromecastConnection API](#chromecastconnection-api) instead. @@ -233,7 +233,7 @@ This API is unmaintained (and deprecated) as of THEOplayer 2.90.0, and developer #### Web SDK -The [Chromecast API](pathname:///theoplayer/v10/api-reference/web/interfaces/Chromecast.html) allows you to configure a different source (i.e. [`SourceDescription`](pathname:///theoplayer/v10/api-reference/web/interfaces/SourceDescription.html)) to be Chromecasted. +The [Chromecast API](pathname:///theoplayer/v11/api-reference/web/interfaces/Chromecast.html) allows you to configure a different source (i.e. [`SourceDescription`](pathname:///theoplayer/v11/api-reference/web/interfaces/SourceDescription.html)) to be Chromecasted. The snippet below demonstrates this API. ```js @@ -251,7 +251,7 @@ player.cast.chromecast.source = source; #### Android SDK The [Chromecast API](https://cdn.theoplayer.com/doc/android/2.55.1/com/theoplayer/android/api/cast/chromecast/Chromecast.html#setSource-com.theoplayer.android.api.source.SourceDescription-) allows you to configure a different SourceDescription to be Chromecasted -through the [`Cast`](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/cast/Cast.html) of your [`THEOplayerView'](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/THEOplayerView.html) object. +through the [`Cast`](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/cast/Cast.html) of your [`THEOplayerView'](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/THEOplayerView.html) object. ```java SourceDescription source = new SourceDescription.Builder("//cdn.theoplayer.com/video/star_wars_episode_vii-the_force_awakens_official_comic-con_2015_reel_(2015)/index.m3u8").build(); @@ -261,7 +261,7 @@ theoPlayerView.getCast().getChromecast().setSource(source); #### iOS/tvOS SDK and Legacy iOS/tvOS SDK (4.12.x) The [Chromecast API](https://cdn.theoplayer.com/doc/ios/2.55.1/Protocols/Chromecast.html#/s:13THEOplayerSDK10ChromecastP6sourceAA17SourceDescriptionCSgvp) allows you to configure a different SourceDescription to be Chromecasted -through the [`Cast`](pathname:///theoplayer/v10/api-reference/ios/Protocols/Cast.html) instance of your [`THEOplayer`](pathname:///theoplayer/v10/api-reference/ios/Classes/THEOplayer.html) object. +through the [`Cast`](pathname:///theoplayer/v11/api-reference/ios/Protocols/Cast.html) instance of your [`THEOplayer`](pathname:///theoplayer/v11/api-reference/ios/Classes/THEOplayer.html) object. ```swift var theoplayerChromecast = theoplayer.cast?.chromecast diff --git a/theoplayer/how-to-guides/03-cast/01-chromecast/06-enable-chromecast-on-the-sender.md b/theoplayer/how-to-guides/03-cast/01-chromecast/06-enable-chromecast-on-the-sender.md index 53e74ee2200e..e2837a0e39e7 100644 --- a/theoplayer/how-to-guides/03-cast/01-chromecast/06-enable-chromecast-on-the-sender.md +++ b/theoplayer/how-to-guides/03-cast/01-chromecast/06-enable-chromecast-on-the-sender.md @@ -207,7 +207,7 @@ but you can connect it to a custom Chromecast Receiver application instead. ### Web SDK -If you have your own Receiver app, then you adjust the [PlayerConfiguration](pathname:///theoplayer/v10/api-reference/web/interfaces/CastConfiguration.html) to connect with a specific `appID` as demonstrated below. +If you have your own Receiver app, then you adjust the [PlayerConfiguration](pathname:///theoplayer/v11/api-reference/web/interfaces/CastConfiguration.html) to connect with a specific `appID` as demonstrated below. ```javascript let customChromecastReceiverAppID = '8E80B9CE'; diff --git a/theoplayer/how-to-guides/03-cast/02-airplay/00-introduction.md b/theoplayer/how-to-guides/03-cast/02-airplay/00-introduction.md index f99b9b4fba8f..2bab72558750 100644 --- a/theoplayer/how-to-guides/03-cast/02-airplay/00-introduction.md +++ b/theoplayer/how-to-guides/03-cast/02-airplay/00-introduction.md @@ -39,8 +39,8 @@ The AirPlay interface is a sub-interface of the Cast interface on both the THEOp The API reference is available through the following links: -- Web SDK: [AirPlay](pathname:///theoplayer/v10/api-reference/web/interfaces/AirPlay.html), which inherits from [VendorCast](pathname:///theoplayer/v10/api-reference/web/interfaces/VendorCast.html) -- iOS SDK: [AirPlay](pathname:///theoplayer/v10/api-reference/ios/Protocols/AirPlay.html) +- Web SDK: [AirPlay](pathname:///theoplayer/v11/api-reference/web/interfaces/AirPlay.html), which inherits from [VendorCast](pathname:///theoplayer/v11/api-reference/web/interfaces/VendorCast.html) +- iOS SDK: [AirPlay](pathname:///theoplayer/v11/api-reference/ios/Protocols/AirPlay.html) For the **THEOplayer Web SDK**, you could use the API as demonstrated below: diff --git a/theoplayer/how-to-guides/04-drm/00-introduction.md b/theoplayer/how-to-guides/04-drm/00-introduction.md index 1d9c65ae519d..bfaa2123a8af 100644 --- a/theoplayer/how-to-guides/04-drm/00-introduction.md +++ b/theoplayer/how-to-guides/04-drm/00-introduction.md @@ -1,6 +1,6 @@ # Introduction -THEOplayer supports FairPlay, PlayReady and Widevine by default. To connect to such a DRM system, developers can use a [ContentProtectionDescription](pathname:///theoplayer/v10/api-reference/web/interfaces/SourceDescription.html) (or DRMConfiguration, depending on the SDK). +THEOplayer supports FairPlay, PlayReady and Widevine by default. To connect to such a DRM system, developers can use a [ContentProtectionDescription](pathname:///theoplayer/v11/api-reference/web/interfaces/SourceDescription.html) (or DRMConfiguration, depending on the SDK). However, more often than not, developers are working with a multi-DRM vendor. These vendors take care of their DRM needs. The last challenge for developers is to integrate the provided DRM solution in a video player. THEOplayer is partnered with many multi-DRM vendors to lighten this burden. In our partnerships, we validate the compatibly and often provide integrations. @@ -32,7 +32,7 @@ Developers can use the generic DRM-functionalities in case in-house DRM-solution ##### Web SDK -To configure DRM on the Web SDK, developers can put a [ContentProtectionDescription](pathname:///theoplayer/v10/api-reference/web/interfaces/SourceDescription.html#sources) inside of a [SourceDescription](pathname:///theoplayer/v10/api-reference/web/interfaces/SourceDescription.html). +To configure DRM on the Web SDK, developers can put a [ContentProtectionDescription](pathname:///theoplayer/v11/api-reference/web/interfaces/SourceDescription.html#sources) inside of a [SourceDescription](pathname:///theoplayer/v11/api-reference/web/interfaces/SourceDescription.html). ```js if (HLS) { diff --git a/theoplayer/how-to-guides/04-drm/01-buydrm-keyos/01-how-to-use-with-theoplayer.md b/theoplayer/how-to-guides/04-drm/01-buydrm-keyos/01-how-to-use-with-theoplayer.md index 7f0951920b65..6c4735a8f7a0 100644 --- a/theoplayer/how-to-guides/04-drm/01-buydrm-keyos/01-how-to-use-with-theoplayer.md +++ b/theoplayer/how-to-guides/04-drm/01-buydrm-keyos/01-how-to-use-with-theoplayer.md @@ -2,7 +2,7 @@ This guide explains how you set up THEOplayer in combination with the [KeyOS BuyDRM](https://www.buydrm.com/keyosplayer), a partnered **multi-DRM vendor**. THEOplayer is pre-integrated with KeyOS and provides a user-friendly API to connect to their **Widevine** and **PlayReady** DRM solutions. -If you are already comfortable with the THEOplayer API, you can go straight over to [DRM Pre-Integration API](pathname:///theoplayer/v10/api-reference/web/interfaces/DRMConfiguration.html). +If you are already comfortable with the THEOplayer API, you can go straight over to [DRM Pre-Integration API](pathname:///theoplayer/v11/api-reference/web/interfaces/DRMConfiguration.html). ## Prerequisites @@ -144,7 +144,7 @@ THEOplayer partnered with KeyOS to fully pre-integrate their BuyDRM solution, sa ## Extra resources: -1. [DRM Pre-Integration API](pathname:///theoplayer/v10/api-reference/web/interfaces/DRMConfiguration.html) +1. [DRM Pre-Integration API](pathname:///theoplayer/v11/api-reference/web/interfaces/DRMConfiguration.html) 2. [THEOplayer Getting Started Guide](../../../getting-started/01-sdks/01-web/00-getting-started.mdx) diff --git a/theoplayer/how-to-guides/04-drm/03-how-to-do-offline-drm/01-offline-drm-with-android.md b/theoplayer/how-to-guides/04-drm/03-how-to-do-offline-drm/01-offline-drm-with-android.md index 9f69e51db04b..74e61ddd5b3e 100644 --- a/theoplayer/how-to-guides/04-drm/03-how-to-do-offline-drm/01-offline-drm-with-android.md +++ b/theoplayer/how-to-guides/04-drm/03-how-to-do-offline-drm/01-offline-drm-with-android.md @@ -151,4 +151,4 @@ for (CachingTask cachedVideo : cache.getTasks()) { } ``` -For all possible API calls, we refer you to the JavaDoc available [here](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/cache/package-summary.html) +For all possible API calls, we refer you to the JavaDoc available [here](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/cache/package-summary.html) diff --git a/theoplayer/how-to-guides/04-drm/14-how-to-play-clear-key-protected-stream.md b/theoplayer/how-to-guides/04-drm/14-how-to-play-clear-key-protected-stream.md index fd617c9e26b1..4682b2066502 100644 --- a/theoplayer/how-to-guides/04-drm/14-how-to-play-clear-key-protected-stream.md +++ b/theoplayer/how-to-guides/04-drm/14-how-to-play-clear-key-protected-stream.md @@ -4,7 +4,7 @@ This article provides a simple example of how to use Clear Key with THEOplayer. Usually, DRM systems require you to specify a `licenseAcquisitionURL` and additional optional data (e.g.: certificate, credentials, headers). Clear Key does not need a DRM provider. You can provide the key(s) directly to the player (hence "clear" key) through the `keys` property in its `LicenseAcquisitionDescription` (in fact, this property is only available for Clear Key). Alternatively, you can have the player fetch the keys from a `licenseAcquisitionURL`, which returns a JSON object containing the same keys. -Please check also our related [API documentation](pathname:///theoplayer/v10/api-reference/web/interfaces/SourceDescription.html) on how to set these. +Please check also our related [API documentation](pathname:///theoplayer/v11/api-reference/web/interfaces/SourceDescription.html) on how to set these. ## SDKs @@ -77,6 +77,6 @@ tpv.getPlayer().setSource(clearKey.build()); ## Resources -- [API Reference - ClearkeyDecryptionKey](pathname:///theoplayer/v10/api-reference/web/interfaces/ClearkeyDecryptionKey.html) +- [API Reference - ClearkeyDecryptionKey](pathname:///theoplayer/v11/api-reference/web/interfaces/ClearkeyDecryptionKey.html) - [Generate MPEG DASH content encrypted with MPEG CENC ClearKey](https://github.com/Dash-Industry-Forum/dash.js/wiki/Generate-MPEG-DASH-content-encrypted-with-MPEG-CENC-ClearKey): DASH IF on GitHub - [Clear Key license format](https://w3c.github.io/encrypted-media/#clear-key-license-format): W3C - Encrypted Media Extensions diff --git a/theoplayer/how-to-guides/06-mediatrack/01-how-to-enable-disable-audio-tracks.md b/theoplayer/how-to-guides/06-mediatrack/01-how-to-enable-disable-audio-tracks.md index 80126ee2bfeb..23407d320b8b 100644 --- a/theoplayer/how-to-guides/06-mediatrack/01-how-to-enable-disable-audio-tracks.md +++ b/theoplayer/how-to-guides/06-mediatrack/01-how-to-enable-disable-audio-tracks.md @@ -2,7 +2,7 @@ This article describes how you can use the MediaTrack API to enable or disable audio tracks. -The AudioTrack API, which is a sub-API of the [MediaTrack API](pathname:///theoplayer/v10/api-reference/web/interfaces/MediaTrack.html), can be used to implement this functionality. +The AudioTrack API, which is a sub-API of the [MediaTrack API](pathname:///theoplayer/v11/api-reference/web/interfaces/MediaTrack.html), can be used to implement this functionality. Implementing this functionality is a common use-case for developers who want to build their own UI to toggle audio languages on and off. ## SDKs @@ -86,5 +86,5 @@ The following remarks can help: The following resources provide more information: -- [MediaTrack API Reference](pathname:///theoplayer/v10/api-reference/web/interfaces/MediaTrack.html) +- [MediaTrack API Reference](pathname:///theoplayer/v11/api-reference/web/interfaces/MediaTrack.html) - [https://developer.mozilla.org/en-US/docs/Web/API/AudioTrack/enabled](https://developer.mozilla.org/en-US/docs/Web/API/AudioTrack/enabled): the `enabled` property from the AudioTrack interface as documented by MDN. diff --git a/theoplayer/how-to-guides/06-mediatrack/02-how-to-detect-audio-tracks.md b/theoplayer/how-to-guides/06-mediatrack/02-how-to-detect-audio-tracks.md index 35e2aebe582f..e58283e4cd69 100644 --- a/theoplayer/how-to-guides/06-mediatrack/02-how-to-detect-audio-tracks.md +++ b/theoplayer/how-to-guides/06-mediatrack/02-how-to-detect-audio-tracks.md @@ -17,7 +17,7 @@ The code examples below how to implement the detection of audio tracks across SD ##### Web SDK -The Web SDK leverages the [MediaTrack API](pathname:///theoplayer/v10/api-reference/web/interfaces/MediaTrack.html). +The Web SDK leverages the [MediaTrack API](pathname:///theoplayer/v11/api-reference/web/interfaces/MediaTrack.html). ```js function handleAddTrackEvent(addTrackEvent) { @@ -28,7 +28,7 @@ player.audioTracks.addEventListener('addtrack', handleAddTrackEvent); ##### Android (TV) SDK -The Android SDK leverages the [MediaTrack API](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/player/track/mediatrack/MediaTrackList.html). +The Android SDK leverages the [MediaTrack API](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/player/track/mediatrack/MediaTrackList.html). ```java EventListener handleAddTrackEvent= new EventListener() { @@ -42,7 +42,7 @@ tpv.getPlayer().getAudioTracks().addEventListener(AudioTrackListEventTypes.ADDTR ##### iOS (/tvOS) SDK -The iOS SDK leverages the [MediaTrack API](pathname:///theoplayer/v10/api-reference/ios/Protocols/MediaTrackList.html). +The iOS SDK leverages the [MediaTrack API](pathname:///theoplayer/v11/api-reference/ios/Protocols/MediaTrackList.html). ```swift func handleAddTrackEvent(addTrackEvent : AddTrackEvent) { diff --git a/theoplayer/how-to-guides/06-mediatrack/03-how-to-select-video-track-quality.md b/theoplayer/how-to-guides/06-mediatrack/03-how-to-select-video-track-quality.md index 380ec0463793..220d66bd129a 100644 --- a/theoplayer/how-to-guides/06-mediatrack/03-how-to-select-video-track-quality.md +++ b/theoplayer/how-to-guides/06-mediatrack/03-how-to-select-video-track-quality.md @@ -17,7 +17,7 @@ The code examples below show how to implement selecting video track qualities ac ##### Web SDK -The Web SDK leverages the [MediaTrack API](pathname:///theoplayer/v10/api-reference/web/interfaces/MediaTrack.html). +The Web SDK leverages the [MediaTrack API](pathname:///theoplayer/v11/api-reference/web/interfaces/MediaTrack.html). ```js // enable a specific video track quality @@ -35,7 +35,7 @@ player.videoTracks[0].targetQuality = null; ##### Android (TV) SDK -The Android SDK leverages the [MediaTrack API](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/player/track/mediatrack/MediaTrackList.html). +The Android SDK leverages the [MediaTrack API](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/player/track/mediatrack/MediaTrackList.html). ```java // enable a specific video track quality @@ -64,7 +64,7 @@ videoTrack.targetQualities = [videoTrack.qualities[0], videoTrack.qualities[1]] For HLS streams: -The iOS SDK leverages the [ABR API](pathname:///theoplayer/v10/api-reference/ios/Protocols/ABRConfiguration.html). The underlying AVFoundation stack, which THEOplayer has to use, brings along the technical limitation that you cannot select a specific video quality. Instead, you can set a maximum resolution or bitrate. +The iOS SDK leverages the [ABR API](pathname:///theoplayer/v11/api-reference/ios/Protocols/ABRConfiguration.html). The underlying AVFoundation stack, which THEOplayer has to use, brings along the technical limitation that you cannot select a specific video quality. Instead, you can set a maximum resolution or bitrate. ```swift // set preferred peak bitrate diff --git a/theoplayer/how-to-guides/06-mediatrack/04-how-to-detect-video-track-qualities.md b/theoplayer/how-to-guides/06-mediatrack/04-how-to-detect-video-track-qualities.md index 421b017f6894..687c875ad010 100644 --- a/theoplayer/how-to-guides/06-mediatrack/04-how-to-detect-video-track-qualities.md +++ b/theoplayer/how-to-guides/06-mediatrack/04-how-to-detect-video-track-qualities.md @@ -17,7 +17,7 @@ The code examples below how to implement the detection of video track qualities ##### Web SDK -The Web SDK leverages the [MediaTrack API](pathname:///theoplayer/v10/api-reference/web/interfaces/MediaTrack.html). +The Web SDK leverages the [MediaTrack API](pathname:///theoplayer/v11/api-reference/web/interfaces/MediaTrack.html). ```js function handleAddTrackEvent(addTrackEvent) { @@ -28,7 +28,7 @@ player.videoTracks.addEventListener('addtrack', handleAddTrackEvent); ##### Android (TV) SDK -The Android SDK leverages the [MediaTrack API](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/player/track/mediatrack/MediaTrackList.html). +The Android SDK leverages the [MediaTrack API](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/player/track/mediatrack/MediaTrackList.html). ```java EventListener handleAddTrackEvent = new EventListener() { diff --git a/theoplayer/how-to-guides/06-mediatrack/05-how-to-start-with-specific-quality.md b/theoplayer/how-to-guides/06-mediatrack/05-how-to-start-with-specific-quality.md index 5a331658caa5..c9f6686b4354 100644 --- a/theoplayer/how-to-guides/06-mediatrack/05-how-to-start-with-specific-quality.md +++ b/theoplayer/how-to-guides/06-mediatrack/05-how-to-start-with-specific-quality.md @@ -83,4 +83,4 @@ private void attachABRResetLogic() { ## Resources -- [MediaTrack API](pathname:///theoplayer/v10/api-reference/web/interfaces/MediaTrack.html) +- [MediaTrack API](pathname:///theoplayer/v11/api-reference/web/interfaces/MediaTrack.html) diff --git a/theoplayer/how-to-guides/06-mediatrack/06-how-to-reduce-data-usage-on-mobile-devices.md b/theoplayer/how-to-guides/06-mediatrack/06-how-to-reduce-data-usage-on-mobile-devices.md index 29be7168c039..975cd777a4ca 100644 --- a/theoplayer/how-to-guides/06-mediatrack/06-how-to-reduce-data-usage-on-mobile-devices.md +++ b/theoplayer/how-to-guides/06-mediatrack/06-how-to-reduce-data-usage-on-mobile-devices.md @@ -2,7 +2,7 @@ Customers that use THEOplayer in mobile web which leverage THEOplayer's preloading capabilities (`preload = "auto"`), or provide very high qualities, sometimes receive complaints about data usage. -You can combat this by leveraging the [ABR API](pathname:///theoplayer/v10/api-reference/web/interfaces/ABRConfiguration.html) and the [MediaTrack API](pathname:///theoplayer/v10/api-reference/web/interfaces/MediaTrack.html). +You can combat this by leveraging the [ABR API](pathname:///theoplayer/v11/api-reference/web/interfaces/ABRConfiguration.html) and the [MediaTrack API](pathname:///theoplayer/v11/api-reference/web/interfaces/MediaTrack.html). ## Step-by-step guide @@ -86,5 +86,5 @@ As far as the player is concerned, by leveraging its API as described you can fi - [How to start with a specific quality?](05-how-to-start-with-specific-quality.md) - [How to programmatically select a video track quality](03-how-to-select-video-track-quality.md) -- [Web SDK API reference: restrictToPlayerSize](pathname:///theoplayer/v10/api-reference/web/interfaces/SourceAbrConfiguration.html#restrictToPlayerSize) +- [Web SDK API reference: restrictToPlayerSize](pathname:///theoplayer/v11/api-reference/web/interfaces/SourceAbrConfiguration.html#restrictToPlayerSize) - [Preloading](../07-miscellaneous/09-preloading.md) diff --git a/theoplayer/how-to-guides/06-mediatrack/07-how-to-detect-video-track-quality-changes.md b/theoplayer/how-to-guides/06-mediatrack/07-how-to-detect-video-track-quality-changes.md index 19d1125b5ec6..04a483f80af2 100644 --- a/theoplayer/how-to-guides/06-mediatrack/07-how-to-detect-video-track-quality-changes.md +++ b/theoplayer/how-to-guides/06-mediatrack/07-how-to-detect-video-track-quality-changes.md @@ -17,7 +17,7 @@ The code examples below how to implement the detection of video track qualities ##### Web SDK -The Web SDK leverages the [MediaTrack API](pathname:///theoplayer/v10/api-reference/web/interfaces/MediaTrack.html). +The Web SDK leverages the [MediaTrack API](pathname:///theoplayer/v11/api-reference/web/interfaces/MediaTrack.html). ```js // detect video tracks being added to the player @@ -31,7 +31,7 @@ player.videoTracks.addEventListener('addtrack', function (e0) { ##### Android (TV) SDK -The Android SDK leverages the [MediaTrack API](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/player/track/mediatrack/MediaTrackList.html). +The Android SDK leverages the [MediaTrack API](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/player/track/mediatrack/MediaTrackList.html). ```java EventListener handleAddTrackEvent = new EventListener() { diff --git a/theoplayer/how-to-guides/06-mediatrack/08-how-to-detect-audio-track-changes.md b/theoplayer/how-to-guides/06-mediatrack/08-how-to-detect-audio-track-changes.md index 11c005dd294d..bde77b4d6dda 100644 --- a/theoplayer/how-to-guides/06-mediatrack/08-how-to-detect-audio-track-changes.md +++ b/theoplayer/how-to-guides/06-mediatrack/08-how-to-detect-audio-track-changes.md @@ -29,10 +29,10 @@ The AudioTrack API is available across all of our base SDKs. As described in the The implementation of the Web SDK applies to all web-based platforms, including Tizen and webOS. -The Web SDK exposes the AudioTrack API through [`player.audioTracks`](pathname:///theoplayer/v10/api-reference/web/classes/ChromelessPlayer.html#audiotracks). -This `audioTracks` property is a [`MediaTrackList`](pathname:///theoplayer/v10/api-reference/web/interfaces/MediaTrackList.html) that inherits from the [`TrackList`](pathname:///theoplayer/v10/api-reference/web/interfaces/TrackList.html). -This `TrackList` dispatches the events from the [`TrackListEventMap`](pathname:///theoplayer/v10/api-reference/web/interfaces/TrackListEventMap.html). -This `TrackListEventMap` contains the [`change`](pathname:///theoplayer/v10/api-reference/web/interfaces/TrackListEventMap.html#change) event, as well as the `addtrack` and `removetrack` event. +The Web SDK exposes the AudioTrack API through [`player.audioTracks`](pathname:///theoplayer/v11/api-reference/web/classes/ChromelessPlayer.html#audiotracks). +This `audioTracks` property is a [`MediaTrackList`](pathname:///theoplayer/v11/api-reference/web/interfaces/MediaTrackList.html) that inherits from the [`TrackList`](pathname:///theoplayer/v11/api-reference/web/interfaces/TrackList.html). +This `TrackList` dispatches the events from the [`TrackListEventMap`](pathname:///theoplayer/v11/api-reference/web/interfaces/TrackListEventMap.html). +This `TrackListEventMap` contains the [`change`](pathname:///theoplayer/v11/api-reference/web/interfaces/TrackListEventMap.html#change) event, as well as the `addtrack` and `removetrack` event. The code below allows you to detect text track changes. @@ -43,16 +43,16 @@ player.audioTracks.addEventListener('change', function (event) { }); ``` -The properties of a media `track` (e.g. `enabled`, `language`) are described in [the `MediaTrack` API reference](pathname:///theoplayer/v10/api-reference/web/interfaces/MediaTrack.html). +The properties of a media `track` (e.g. `enabled`, `language`) are described in [the `MediaTrack` API reference](pathname:///theoplayer/v11/api-reference/web/interfaces/MediaTrack.html). ### Android SDK The implementation of the Android SDK applies to all Android-based platforms, including Android TV and Fire TV. -The Android SDK exposes the AudioTrack API through [`player.getAudioTracks()`](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/player/Player.html#getAudioTracks--). -This `getAudioTracks()` method returns a [`MediaTrackList`](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/player/track/mediatrack/MediaTrackList.html) that inherits from the [`TrackList`](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/player/track/TrackList.html). -This `TrackList` dispatches the events from the [`AudioTrackListEventTypes`](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/event/track/mediatrack/audio/list/AudioTrackListEventTypes.html). -The `AudioTrackListEventTypes` contains the [`TRACKLISTCHANGE`](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/event/track/mediatrack/audio/list/AudioTrackListEventTypes.html#TRACKLISTCHANGE) event, as well as the `ADDTRACK` and `REMOVETRACK` event. +The Android SDK exposes the AudioTrack API through [`player.getAudioTracks()`](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/player/Player.html#getAudioTracks--). +This `getAudioTracks()` method returns a [`MediaTrackList`](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/player/track/mediatrack/MediaTrackList.html) that inherits from the [`TrackList`](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/player/track/TrackList.html). +This `TrackList` dispatches the events from the [`AudioTrackListEventTypes`](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/event/track/mediatrack/audio/list/AudioTrackListEventTypes.html). +The `AudioTrackListEventTypes` contains the [`TRACKLISTCHANGE`](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/event/track/mediatrack/audio/list/AudioTrackListEventTypes.html#TRACKLISTCHANGE) event, as well as the `ADDTRACK` and `REMOVETRACK` event. The code below allows you to detect audio track changes. @@ -63,16 +63,16 @@ player.getAudioTracks().addEventListener(AudioTrackListEventTypes.TRACKLISTCHANG }); ``` -The properties of a media `track` (e.g. `enabled`, `language`) are described in the [`MediaTrack`](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/player/track/mediatrack/MediaTrack.html) and [`Track`](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/player/track/Track.html) API references. +The properties of a media `track` (e.g. `enabled`, `language`) are described in the [`MediaTrack`](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/player/track/mediatrack/MediaTrack.html) and [`Track`](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/player/track/Track.html) API references. ### iOS/tvOS SDK and Legacy iOS/tvOS SDK (4.12.x) The implementation of the iOS SDK applies to all iOS-based platforms, including iPadOS and tvOS. -The iOS SDK exposes the AudioTrack API through [`player.audioTracks`](pathname:///theoplayer/v10/api-reference/ios/Classes/THEOplayer.html#/s:13THEOplayerSDK0A0C11audioTracksAA14AudioTrackList_pvp). -This `audioTracks` property is a [`MediaTrackList`](pathname:///theoplayer/v10/api-reference/ios/Protocols/MediaTrackList.html). -This `MediaTrackList` dispatches the events from the [`AudioTrackListEventTypes`](pathname:///theoplayer/v10/api-reference/ios/Structs/AudioTrackListEventTypes.html). -The `AudioTrackListEventTypes` contains the [`CHANGE`](pathname:///theoplayer/v10/api-reference/ios/Structs/AudioTrackListEventTypes.html#/s:13THEOplayerSDK24AudioTrackListEventTypesV6CHANGEAA0F4TypeCyAA0d6ChangeF0CGvpZ) event, as well as the `ADD_TRACK` and `REMOVE_TRACK` event. +The iOS SDK exposes the AudioTrack API through [`player.audioTracks`](pathname:///theoplayer/v11/api-reference/ios/Classes/THEOplayer.html#/s:13THEOplayerSDK0A0C11audioTracksAA14AudioTrackList_pvp). +This `audioTracks` property is a [`MediaTrackList`](pathname:///theoplayer/v11/api-reference/ios/Protocols/MediaTrackList.html). +This `MediaTrackList` dispatches the events from the [`AudioTrackListEventTypes`](pathname:///theoplayer/v11/api-reference/ios/Structs/AudioTrackListEventTypes.html). +The `AudioTrackListEventTypes` contains the [`CHANGE`](pathname:///theoplayer/v11/api-reference/ios/Structs/AudioTrackListEventTypes.html#/s:13THEOplayerSDK24AudioTrackListEventTypesV6CHANGEAA0F4TypeCyAA0d6ChangeF0CGvpZ) event, as well as the `ADD_TRACK` and `REMOVE_TRACK` event. The code below allows you to detect audio track changes. @@ -83,7 +83,7 @@ player?.audioTracks.addEventListener(type: AudioTrackListEventTypes.CHANGE, list }) ``` -The properties of a media `track` (e.g. `enabled`, `language`) are described in the [`MediaTrack`](pathname:///theoplayer/v10/api-reference/ios/Protocols/MediaTrack.html) and [`Track`](pathname:///theoplayer/v10/api-reference/ios/Protocols/Track.html) API references. +The properties of a media `track` (e.g. `enabled`, `language`) are described in the [`MediaTrack`](pathname:///theoplayer/v11/api-reference/ios/Protocols/MediaTrack.html) and [`Track`](pathname:///theoplayer/v11/api-reference/ios/Protocols/Track.html) API references. ### Roku SDK diff --git a/theoplayer/how-to-guides/07-miscellaneous/01-related-content.md b/theoplayer/how-to-guides/07-miscellaneous/01-related-content.md index 3eb2c13722f7..d8e715073fc7 100644 --- a/theoplayer/how-to-guides/07-miscellaneous/01-related-content.md +++ b/theoplayer/how-to-guides/07-miscellaneous/01-related-content.md @@ -18,7 +18,7 @@ The Related Content API is a UI feature. It's currently unavailable on the Andro The Related Content API was first released on THEOplayer's Web SDK. -- Reference API: [Related-Content API](pathname:///theoplayer/v10/api-reference/web/interfaces/RelatedContent.html) +- Reference API: [Related-Content API](pathname:///theoplayer/v11/api-reference/web/interfaces/RelatedContent.html) - Online demo: [https://demo.theoplayer.com/related-content](https://demo.theoplayer.com/related-content) ```js @@ -133,7 +133,7 @@ var sampleSource1: SourceDescription { ``` - Reference DEMO APP: [iOS Related Content Demo APP](https://github.com/THEOplayer/samples-ios-sdk/tree/master/Related-Content) -- Reference API: [iOS Related Content API](pathname:///theoplayer/v10/api-reference/ios/Protocols/RelatedContent.html) +- Reference API: [iOS Related Content API](pathname:///theoplayer/v11/api-reference/ios/Protocols/RelatedContent.html) ## Important Note diff --git a/theoplayer/how-to-guides/07-miscellaneous/02-social-sharing.md b/theoplayer/how-to-guides/07-miscellaneous/02-social-sharing.md index 3085471d84e2..adf0a96d16c5 100644 --- a/theoplayer/how-to-guides/07-miscellaneous/02-social-sharing.md +++ b/theoplayer/how-to-guides/07-miscellaneous/02-social-sharing.md @@ -22,7 +22,7 @@ The Social Sharing API is a UI feature. It's currently unavailable on all SDKs e The Social Sharing API is currently only available on the Web SDK. -- Reference API: [Social Sharing API](pathname:///theoplayer/v10/api-reference/web/interfaces/SocialSharing.html) +- Reference API: [Social Sharing API](pathname:///theoplayer/v11/api-reference/web/interfaces/SocialSharing.html) - Online demo: [Social Sharing Demo](https://demo.theoplayer.com/social-sharing) ```js diff --git a/theoplayer/how-to-guides/07-miscellaneous/03-up-next.md b/theoplayer/how-to-guides/07-miscellaneous/03-up-next.md index 62499aca405d..82e1cddd6bec 100644 --- a/theoplayer/how-to-guides/07-miscellaneous/03-up-next.md +++ b/theoplayer/how-to-guides/07-miscellaneous/03-up-next.md @@ -26,7 +26,7 @@ This example explains how you do a basic implementation of the Up Next API. The Up Next API is currently only available on the Web SDK. -- Reference API: [Up Next API](pathname:///theoplayer/v10/api-reference/web/classes/Player.html#upnext) +- Reference API: [Up Next API](pathname:///theoplayer/v11/api-reference/web/classes/Player.html#upnext) - Online demo: [Up Next Demo](https://www.theoplayer.com/theoplayer-demo-up-next) The snippet below demonstrates how you could configure the Up Next API. @@ -63,4 +63,4 @@ The Up Next API is currently unavailable on all SDKs except the Web SDK, because The following resources provide more information: -- [Up Next API](pathname:///theoplayer/v10/api-reference/web/classes/Player.html#upnext) +- [Up Next API](pathname:///theoplayer/v11/api-reference/web/classes/Player.html#upnext) diff --git a/theoplayer/how-to-guides/07-miscellaneous/04-error/01-how-to-do-error-handling.md b/theoplayer/how-to-guides/07-miscellaneous/04-error/01-how-to-do-error-handling.md index 93c75b8de64b..5ce63eb1a96e 100644 --- a/theoplayer/how-to-guides/07-miscellaneous/04-error/01-how-to-do-error-handling.md +++ b/theoplayer/how-to-guides/07-miscellaneous/04-error/01-how-to-do-error-handling.md @@ -32,9 +32,9 @@ Developers can subscribe to events and attach a callback function. This callback function implements the error handling. This section describes how to use event handlers for the "top-level", "generic", "player" `error` event. -This is the [`error`](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#error) event which is dispatched through the `Player` interface. +This is the [`error`](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#error) event which is dispatched through the `Player` interface. This event is fatal and prevents playback. -(There are also `error` events, for example the [`error`](pathname:///theoplayer/v10/api-reference/web/interfaces/ChromecastEventMap.html#error) event which is dispatched through the `Chromecast` interface. +(There are also `error` events, for example the [`error`](pathname:///theoplayer/v11/api-reference/web/interfaces/ChromecastEventMap.html#error) event which is dispatched through the `Chromecast` interface. You handle these `error` events in the same fashion.) #### Web diff --git a/theoplayer/how-to-guides/07-miscellaneous/04-error/02-error-codes.md b/theoplayer/how-to-guides/07-miscellaneous/04-error/02-error-codes.md index 90940505c1ce..7380afc188c8 100644 --- a/theoplayer/how-to-guides/07-miscellaneous/04-error/02-error-codes.md +++ b/theoplayer/how-to-guides/07-miscellaneous/04-error/02-error-codes.md @@ -52,13 +52,13 @@ For example, on the Web SDK, you can access this through `THEOplayer.ErrorCatego Relevant API references: - Web SDK - - [`ErrorCategory`](pathname:///theoplayer/v10/api-reference/web/enums/ErrorCategory.html) - - [`ErrorCategory.fromCode()`](pathname:///theoplayer/v10/api-reference/web/functions/ErrorCategory-1.fromCode.html) + - [`ErrorCategory`](pathname:///theoplayer/v11/api-reference/web/enums/ErrorCategory.html) + - [`ErrorCategory.fromCode()`](pathname:///theoplayer/v11/api-reference/web/functions/ErrorCategory-1.fromCode.html) - Android SDK - - [`ErrorCategory`](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/error/ErrorCategory.html) - - [`ErrorCategory.fromCode()`]() + - [`ErrorCategory`](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/error/ErrorCategory.html) + - [`ErrorCategory.fromCode()`]() - iOS SDK - - [`ErrorCategory`](pathname:///theoplayer/v10/api-reference/ios/Enums/ErrorCategory.html) + - [`ErrorCategory`](pathname:///theoplayer/v11/api-reference/ios/Enums/ErrorCategory.html) ## Codes @@ -75,8 +75,8 @@ as illustrated by the screenshot below. Relevant API references: - Web SDK - - [`ErrorCode`](pathname:///theoplayer/v10/api-reference/web/enums/ErrorCode.html) + - [`ErrorCode`](pathname:///theoplayer/v11/api-reference/web/enums/ErrorCode.html) - Android SDK - - [`ErrorCode`](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/error/ErrorCode.html) + - [`ErrorCode`](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/error/ErrorCode.html) - iOS SDK - `THEOErrorCode` diff --git a/theoplayer/how-to-guides/07-miscellaneous/04-vr.md b/theoplayer/how-to-guides/07-miscellaneous/04-vr.md index 1208696dd711..c45d6c5c8cca 100644 --- a/theoplayer/how-to-guides/07-miscellaneous/04-vr.md +++ b/theoplayer/how-to-guides/07-miscellaneous/04-vr.md @@ -60,7 +60,7 @@ new WebXRPolyfill(POLYFILL_CONFIG); To indicate that your stream contains 360° content, pass a valid `VRConfiguration` as `vr` property when setting `player.source`. -For the full list of properties and events related to 360° video and VR, go to our [API](pathname:///theoplayer/v10/api-reference/web/interfaces/VR.html) page. +For the full list of properties and events related to 360° video and VR, go to our [API](pathname:///theoplayer/v11/api-reference/web/interfaces/VR.html) page. ```js var element = document.querySelector('.theoplayer'); diff --git a/theoplayer/how-to-guides/07-miscellaneous/06-clipping.md b/theoplayer/how-to-guides/07-miscellaneous/06-clipping.md index b2ba359df4d5..49af3310dd05 100644 --- a/theoplayer/how-to-guides/07-miscellaneous/06-clipping.md +++ b/theoplayer/how-to-guides/07-miscellaneous/06-clipping.md @@ -62,6 +62,6 @@ The demo below illustrates the Up Next API in production. ## Resources -- [Clip API Reference](pathname:///theoplayer/v10/api-reference/web/interfaces/Clip.html) +- [Clip API Reference](pathname:///theoplayer/v11/api-reference/web/interfaces/Clip.html) - [Blog article](https://www.theoplayer.com/blog/frame-accurate-clipping-in-hls) - [How to add CSS or JavaScript files to an Android/iOS project](../../../theoplayer_versioned_docs/version-v4/faq/01-how-to-add-css-or-javascript-files-to-android-ios.md) diff --git a/theoplayer/how-to-guides/07-miscellaneous/07-picture-in-picture.md b/theoplayer/how-to-guides/07-miscellaneous/07-picture-in-picture.md index 857bececc03e..2f7d53f330d4 100644 --- a/theoplayer/how-to-guides/07-miscellaneous/07-picture-in-picture.md +++ b/theoplayer/how-to-guides/07-miscellaneous/07-picture-in-picture.md @@ -21,7 +21,7 @@ The below table makes a comparison of the available THEOplayer APIs specifically 2 While using out-of-app picture-in-picture, the visibility of the PiP windows is not contained to the inside of the app. It can remain visible while the user navigates to other views, pages or apps. -3 On Android/Fire TV SDK, there is no API to explicitly only allow in-app PiP. The existing [PiP API](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/pip/package-summary.html) activates both in and out of app PiP. +3 On Android/Fire TV SDK, there is no API to explicitly only allow in-app PiP. The existing [PiP API](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/pip/package-summary.html) activates both in and out of app PiP. ## How to use Picture-in-Picture @@ -44,10 +44,10 @@ The PiP configuration for this SDK includes 3 properties: The corner in which the player should be shown while in PiP mode. Defaults to the bottom right corner. - `visibility`: (optional, a number from 0 to 1) - The maximum percentage of the original player position that should be visible to enable PiP automatically. If not configured, PiP can only be turned on by setting [presentationMode](pathname:///theoplayer/v10/api-reference/web/types/PresentationMode.html) to "picture-in-picture". + The maximum percentage of the original player position that should be visible to enable PiP automatically. If not configured, PiP can only be turned on by setting [presentationMode](pathname:///theoplayer/v11/api-reference/web/types/PresentationMode.html) to "picture-in-picture". - `retainPresentationModeOnSourceChange`: (optional, possible values: true or false) - If set to true, the previous [presentationMode](pathname:///theoplayer/v10/api-reference/web/types/PresentationMode.html) is retained even as the source changes. It is set to false by default. + If set to true, the previous [presentationMode](pathname:///theoplayer/v11/api-reference/web/types/PresentationMode.html) is retained even as the source changes. It is set to false by default. ```js var playerConfig = { @@ -220,7 +220,7 @@ NotificationCenter.default.addObserver(self, selector: #selector(onPiPMoved), na ###### out-of-app Picture in Picture By using your own implementation of the [AVPictureinpictureControllerDelegate](https://developer.apple.com/documentation/avkit/avpictureinpicturecontrollerdelegate) you are able to listen to a number of events. -These contain, but are not limited to, when the player will enter/exit PiP, has entered/exited PiP, ... To achieve this you just have to set your implementation of the delegate as the one of the [PictureInPictureController](pathname:///theoplayer/v10/api-reference/ios/Protocols/PictureInPicture.html). +These contain, but are not limited to, when the player will enter/exit PiP, has entered/exited PiP, ... To achieve this you just have to set your implementation of the delegate as the one of the [PictureInPictureController](pathname:///theoplayer/v11/api-reference/ios/Protocols/PictureInPicture.html). ```swift class CustomPiPDelegate: NSObject, AVPictureInPictureControllerDelegate { @@ -261,7 +261,7 @@ The following remarks can help: - PiP is a presentation mode of the player. As such, you can listen for a _presentationmodechange_ event or verify the presentationMode of the player in case you need to find out what the presentation mode is at a given moment or detect a change. - More details of the `PresentationMode` types can be found here: - [Web PresentationMode API Reference](pathname:///theoplayer/v10/api-reference/web/types/PresentationMode.html) + [Web PresentationMode API Reference](pathname:///theoplayer/v11/api-reference/web/types/PresentationMode.html) - This feature is not completely the same on all SDKs, as the options may vary. @@ -280,15 +280,15 @@ The following resources provide more information: ##### Web SDK -- [PipConfiguration API Reference](pathname:///theoplayer/v10/api-reference/web/interfaces/PiPConfiguration.html) -- [PlayerConfiguration API Reference](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerConfiguration.html) +- [PipConfiguration API Reference](pathname:///theoplayer/v11/api-reference/web/interfaces/PiPConfiguration.html) +- [PlayerConfiguration API Reference](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerConfiguration.html) ##### iOS/tvOS SDK and Legacy iOS/tvOS SDK (4.12.x) -- [PipConfiguration API Reference](pathname:///theoplayer/v10/api-reference/ios/Classes/PiPConfiguration.html) -- [PictureInPicture API Reference](pathname:///theoplayer/v10/api-reference/ios/Protocols/PictureInPicture.html) +- [PipConfiguration API Reference](pathname:///theoplayer/v11/api-reference/ios/Classes/PiPConfiguration.html) +- [PictureInPicture API Reference](pathname:///theoplayer/v11/api-reference/ios/Protocols/PictureInPicture.html) ##### Android SDK -- [PipConfiguration API Reference](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/pip/PipConfiguration.Builder.html) -- [PiPManager API Reference](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/pip/PiPManager.html) +- [PipConfiguration API Reference](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/pip/PipConfiguration.Builder.html) +- [PiPManager API Reference](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/pip/PiPManager.html) diff --git a/theoplayer/how-to-guides/07-miscellaneous/09-preloading.md b/theoplayer/how-to-guides/07-miscellaneous/09-preloading.md index 2bb7fd81bf42..5061f3a00306 100644 --- a/theoplayer/how-to-guides/07-miscellaneous/09-preloading.md +++ b/theoplayer/how-to-guides/07-miscellaneous/09-preloading.md @@ -72,6 +72,6 @@ The demo below illustrates the Preload API in production. ## Resources - [What are the benefits of preloading?](../../faq/38-what-are-the-benefits-of-preloading.md) -- [API reference](pathname:///theoplayer/v10/api-reference/web/types/PreloadType.html) +- [API reference](pathname:///theoplayer/v11/api-reference/web/types/PreloadType.html) - [HTML5 specification](https://www.w3.org/TR/html5/embedded-content-0.html#attr-media-preload) -- [API reference: Cache API](pathname:///theoplayer/v10/api-reference/web/interfaces/Cache.html) +- [API reference: Cache API](pathname:///theoplayer/v11/api-reference/web/interfaces/Cache.html) diff --git a/theoplayer/how-to-guides/07-miscellaneous/10-saving-cachingtask-progress-ios.md b/theoplayer/how-to-guides/07-miscellaneous/10-saving-cachingtask-progress-ios.md index b5b5737b584e..a4945e71654c 100644 --- a/theoplayer/how-to-guides/07-miscellaneous/10-saving-cachingtask-progress-ios.md +++ b/theoplayer/how-to-guides/07-miscellaneous/10-saving-cachingtask-progress-ios.md @@ -3,7 +3,7 @@ This guide explains how to save the progress of an ongoing caching task and what the limitations of the iOS platform are. The THEOplayer iOS SDK provides the capability to pause an ongoing task. Doing so will store the file state of the partially downloaded stream to disk, and allow the task to be resumed even after the application runtime has been terminated. -Note: See [CachingTask](pathname:///theoplayer/v10/api-reference/ios/Protocols/CachingTask.html) for the `pause()` method. +Note: See [CachingTask](pathname:///theoplayer/v11/api-reference/ios/Protocols/CachingTask.html) for the `pause()` method. ## Code Examples diff --git a/theoplayer/how-to-guides/08-network/00-introduction.md b/theoplayer/how-to-guides/08-network/00-introduction.md index dc4c5fb0b090..f1116b916317 100644 --- a/theoplayer/how-to-guides/08-network/00-introduction.md +++ b/theoplayer/how-to-guides/08-network/00-introduction.md @@ -4,7 +4,7 @@ This article explains how to use the Network API. On iOS browsers, the Network API can only be used to intercept and alter DRM-related requests and responses. -The technical documentation on the Network API can be found [here](pathname:///theoplayer/v10/api-reference/web/interfaces/Network.html). +The technical documentation on the Network API can be found [here](pathname:///theoplayer/v11/api-reference/web/interfaces/Network.html). ## SDKs diff --git a/theoplayer/how-to-guides/08-network/01-request-response-interceptors.md b/theoplayer/how-to-guides/08-network/01-request-response-interceptors.md index 432b7c39ae03..e05dd557600d 100644 --- a/theoplayer/how-to-guides/08-network/01-request-response-interceptors.md +++ b/theoplayer/how-to-guides/08-network/01-request-response-interceptors.md @@ -16,7 +16,7 @@ To get THEOplayer to work, you only need to do three things: 1. Reference the THEOplayer JavaScript library (and optionally the default CSS styles). 2. Add a container which can hold your video player with HTML. -3. Create your player through JavaScript using our [API](pathname:///theoplayer/v10/api-reference/web/classes/Player.html). +3. Create your player through JavaScript using our [API](pathname:///theoplayer/v11/api-reference/web/classes/Player.html). A basic HTML page with a working THEOplayer could look like the following: @@ -90,7 +90,7 @@ This snippet initializes your player, including an HLS source. Starting from the basic template above, you need to add a `RequestInterceptor` on the network object's addRequestInterceptor method. By adding a request interceptor, the original request made by HTTP can be modified so that specific properties of the original request can be altered to contain the necessary information, before it is sent to the server. The interceptors are added in a stack and the last interceptor to be added is the first one to intercept the original request. -A request interceptor can modify the request with the [`redirect`](pathname:///theoplayer/v10/api-reference/web/interfaces/InterceptableRequest.html#redirect) or [`respondWith`](pathname:///theoplayer/v10/api-reference/web/interfaces/InterceptableRequest.html#respondWith) method. +A request interceptor can modify the request with the [`redirect`](pathname:///theoplayer/v11/api-reference/web/interfaces/InterceptableRequest.html#redirect) or [`respondWith`](pathname:///theoplayer/v11/api-reference/web/interfaces/InterceptableRequest.html#respondWith) method. ```js var interceptor = function (request) { @@ -144,7 +144,7 @@ A `ResponseInterceptor` responds with the given response for the original reques A `ResponseInterceptor` can be added on the network object's addResponseInterceptor method. By adding a response interceptor, the original response can be modified so that specific properties of the original response can be altered to contain the necessary information, before the server responds. The interceptors are added in a stack and the last interceptor to be added is the first one to intercept the original response. -A ResponseInterceptor can modify the response with the [`respondWith`](pathname:///theoplayer/v10/api-reference/web/interfaces/InterceptableResponse.html#respondWith) method. +A ResponseInterceptor can modify the response with the [`respondWith`](pathname:///theoplayer/v11/api-reference/web/interfaces/InterceptableResponse.html#respondWith) method. ```js var interceptor = function (response) { @@ -156,7 +156,7 @@ var interceptor = function (response) { }; ``` -The code sample above intercepts manifest responses received by the player and responds with a manifest containing a single segment. The `respondWith` method accepts a [`ResponseInit`](pathname:///theoplayer/v10/api-reference/web/interfaces/ResponseInit.html) object as its argument. +The code sample above intercepts manifest responses received by the player and responds with a manifest containing a single segment. The `respondWith` method accepts a [`ResponseInit`](pathname:///theoplayer/v11/api-reference/web/interfaces/ResponseInit.html) object as its argument. The above defined interceptor can be added to the player as follows: diff --git a/theoplayer/how-to-guides/09-player/00-introduction.md b/theoplayer/how-to-guides/09-player/00-introduction.md index bd2fffb34a8b..7a67144265f0 100644 --- a/theoplayer/how-to-guides/09-player/00-introduction.md +++ b/theoplayer/how-to-guides/09-player/00-introduction.md @@ -28,109 +28,109 @@ The table below gives an overview of a subset of the available events per interf | Interface | Event | Description | | -------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------- | -| [Player](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html) | [canplay](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#canplay) | Fired when the player can resume playback of the media data. | -| Player | [canplaythrough](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#canplaythrough) | Fired when the player can resume playback of the media data and buffering is unlikely. | -| Player | [contentprotectionerror](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#contentprotectionerror) | Fired when an error related to content protection occurs. | -| Player | [contentprotectionsuccess](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#contentprotectionsuccess) | Fired when the key is usable for decryption. | -| Player | [currentsourcechange](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#currentsourcechange) | Fired when the current source, which is chosen from ChromelessPlayer.source.sources, changes. | -| Player | [destroy](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#destroy) | Fired when the the player is destroyed. | -| Player | [dimensionchange](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#dimensionchange) | Fired when the dimensions of the HTML element changes. | -| Player | [durationchange](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#durationchange) | Fired when ChromelessPlayer.duration changes. | -| Player | [emptied](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#emptied) | Fired when the player's source is cleared. | -| Player | [encrypted](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#encrypted) | Fired when the player encounters key system initialization data in the media data. | -| Player | [ended](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#ended) | Fired when playback has stopped because the end of the media resource was reached. | -| Player | [error](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#error) | Fired when an error occurs. | -| Player | [loadeddata](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#loadeddata) | Fired when the player can render the media data at the current playback position for the first time. | -| Player | [loadedmetadata](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#loadedmetadata) | Fired when the player determines the duration and dimensions of the media resource. | -| Player | [loadstart](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#loadstart) | Fired when the player starts loading the manifest. | -| Player | [manifestupdate](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#manifestupdate) | Fired when the manifest is updated. | -| Player | [pause](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#pause) | Fired when ChromelessPlayer.paused changes to true. | -| Player | [play](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#play) | Fired when ChromelessPlayer.paused changes to false. | -| Player | [playing](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#playing) | Fired when playback is ready to start after having been paused or delayed due to lack of media data. | -| Player | [progress](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#progress) | Fired when the player loaded media data. | -| Player | [ratechange](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#ratechange) | Fired when ChromelessPlayer.playbackRate changes. | -| Player | [readystatechange](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#readystatechange) | Fired when ChromelessPlayer.readyState changes. | -| Player | [representationchange](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#representationchange) | Fired when the current representation changes. | -| Player | [resize](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#resize) | Fired when either ChromelessPlayer.videoWidth or ChromelessPlayer.videoHeight changes. | -| Player | [seeked](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#seeked) | Fired when ChromelessPlayer.seeking changes to false after the current playback position was changed. | -| Player | [seeking](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#seeking) | Fired when ChromelessPlayer.seeking changes to true, and the player has started seeking to a new position. | -| Player | [segmentnotfound](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#segmentnotfound) | Fired when a segment can not be found. | -| Player | [sourcechange](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#sourcechange) | Fired when ChromelessPlayer.source changes. | -| Player | [timeupdate](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#timeupdate) | Fired when the current playback position changed as part of normal playback or in an especially interesting way, for example discontinuously. | -| Player | [volumechange](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#volumechange) | Fired when ChromelessPlayer.volume changes. | -| Player | [waiting](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#waiting) | Fired when playback has stopped because the next frame is not available, but the player expects that frame to become available in due course. | -| Player | [currentTime](pathname:///theoplayer/v10/api-reference/web/classes/ChromelessPlayer.html#currenttime) | The current playback position of the media, in seconds. | -| Player | [currentProgramDateTime](pathname:///theoplayer/v10/api-reference/web/classes/ChromelessPlayer.html#currentprogramdatetime) | The current playback position of the media, as a timestamp. | -| Player | [muted](pathname:///theoplayer/v10/api-reference/web/classes/ChromelessPlayer.html#muted) | Whether audio is muted. | -| Player | [...](pathname:///theoplayer/v10/api-reference/web/classes/ChromelessPlayer.html) | ... | -| [Ads (Client-Side)](pathname:///theoplayer/v10/api-reference/web/interfaces/AdsEventMap.html) | [adbegin](pathname:///theoplayer/v10/api-reference/web/interfaces/AdsEventMap.html#adbegin) | Fired when an ad begins. | -| Ads (Client-Side) | [adbreakbegin](pathname:///theoplayer/v10/api-reference/web/interfaces/AdsEventMap.html#adbreakbegin) | Fired when an ad break begins. | -| Ads (Client-Side) | [adbreakchange](pathname:///theoplayer/v10/api-reference/web/interfaces/AdsEventMap.html#adbreakchange) | Fired when an ad break changes. | -| Ads (Client-Side) | [adbreakend](pathname:///theoplayer/v10/api-reference/web/interfaces/AdsEventMap.html#adbreakend) | Fired when an ad break ends. | -| Ads (Client-Side) | [adbuffering](pathname:///theoplayer/v10/api-reference/web/interfaces/AdsEventMap.html#adbuffering) | Fired when the ad has stalled playback to buffer. | -| Ads (Client-Side) | [addad](pathname:///theoplayer/v10/api-reference/web/interfaces/AdsEventMap.html#addad) | Fired when an ad is added. | -| Ads (Client-Side) | [addadbreak](pathname:///theoplayer/v10/api-reference/web/interfaces/AdsEventMap.html#addadbreak) | Fired when an ad break is added. | -| Ads (Client-Side) | [adend](pathname:///theoplayer/v10/api-reference/web/interfaces/AdsEventMap.html#adend) | Fired when an ad ends. | -| Ads (Client-Side) | [aderror](pathname:///theoplayer/v10/api-reference/web/interfaces/AdsEventMap.html#aderror) | Fired when an ad errors. | -| Ads (Client-Side) | [adfirstquartile](pathname:///theoplayer/v10/api-reference/web/interfaces/AdsEventMap.html#adfirstquartile) | Fired when an ad reaches the first quartile. | -| Ads (Client-Side) | [adimpression](pathname:///theoplayer/v10/api-reference/web/interfaces/AdsEventMap.html#adimpression) | Fired when an ad counts as an impression. | -| Ads (Client-Side) | [adloaded](pathname:///theoplayer/v10/api-reference/web/interfaces/AdsEventMap.html#adloaded) | Fired when an ad is loaded. | -| Ads (Client-Side) | [admetadata](pathname:///theoplayer/v10/api-reference/web/interfaces/AdsEventMap.html#admetadata) | Fired when an ads list is loaded. | -| Ads (Client-Side) | [admidpoint](pathname:///theoplayer/v10/api-reference/web/interfaces/AdsEventMap.html#admidpoint) | Fired when an ad reaches the mid point. | -| Ads (Client-Side) | [adskip](pathname:///theoplayer/v10/api-reference/web/interfaces/AdsEventMap.html#adskip) | Fired when an ad is skipped. | -| Ads (Client-Side) | [adthirdquartile](pathname:///theoplayer/v10/api-reference/web/interfaces/AdsEventMap.html#adthirdquartile) | Fired when an ad reaches the third quartile. | -| Ads (Client-Side) | [removeadbreak](pathname:///theoplayer/v10/api-reference/web/interfaces/AdsEventMap.html#removeadbreak) | Fired when an ad break is removed. | -| Ads (Client-Side) | [updatead](pathname:///theoplayer/v10/api-reference/web/interfaces/AdsEventMap.html#updatead) | Fired when an ad is updated. | -| Ads (Client-Side) | [updateadbreak](pathname:///theoplayer/v10/api-reference/web/interfaces/AdsEventMap.html#updateadbreak) | Fired when an AdBreak is updated. | -| [Vendor Cast](pathname:///theoplayer/v10/api-reference/web/interfaces/VendorCastEventMap.html) | [statechange](pathname:///theoplayer/v10/api-reference/web/interfaces/VendorCastEventMap.html#statechange) | Fired when the state changes. | -| [Chromecast](pathname:///theoplayer/v10/api-reference/web/interfaces/ChromecastEventMap.html) | [error](pathname:///theoplayer/v10/api-reference/web/interfaces/ChromecastEventMap.html#error) | Fired when an error occurs while casting or trying to cast. | -| [Track List](pathname:///theoplayer/v10/api-reference/web/interfaces/TrackListEventMap.html) | [addtrack](pathname:///theoplayer/v10/api-reference/web/interfaces/TrackListEventMap.html#addtrack) | Fired when a track is added. | -| Track List | [change](pathname:///theoplayer/v10/api-reference/web/interfaces/TrackListEventMap.html#change) | Fired when a track is activated or deactivated. | -| Track List | [removetrack](pathname:///theoplayer/v10/api-reference/web/interfaces/TrackListEventMap.html#removetrack) | Fired when a track is removed. | -| [Track](pathname:///theoplayer/v10/api-reference/web/interfaces/TrackEventMap.html) | [change](pathname:///theoplayer/v10/api-reference/web/interfaces/TrackEventMap.html#change) | Fired when a media track's enabled or a text track's changes. | -| Track | [update](pathname:///theoplayer/v10/api-reference/web/interfaces/TrackEventMap.html#update) | Fired when the track updates. | -| [Media Track](pathname:///theoplayer/v10/api-reference/web/interfaces/MediaTrackEventMap.html) | [activequalitychanged](pathname:///theoplayer/v10/api-reference/web/interfaces/MediaTrackEventMap.html#activequalitychanged) | Fired when the media track's active quality changes. | -| Media Track | [qualityunavailable](pathname:///theoplayer/v10/api-reference/web/interfaces/MediaTrackEventMap.html#qualityunavailable) | Fired when a quality of the track becomes unavailable. | -| Media Track | [targetqualitychanged](pathname:///theoplayer/v10/api-reference/web/interfaces/MediaTrackEventMap.html#targetqualitychanged) | Fired when the media track's target quality changes. | -| [Text Track](pathname:///theoplayer/v10/api-reference/web/interfaces/TextTrackEventMap.html) | [addcue](pathname:///theoplayer/v10/api-reference/web/interfaces/TextTrackEventMap.html#addcue) | Fired when a cue is added to the track. | -| Text Track | [cuechange](pathname:///theoplayer/v10/api-reference/web/interfaces/TextTrackEventMap.html#cuechange) | Fired when a cue of the track changes. | -| Text Track | [entercue](pathname:///theoplayer/v10/api-reference/web/interfaces/TextTrackEventMap.html#entercue) | Fired when a cue of the track enters. | -| Text Track | [error](pathname:///theoplayer/v10/api-reference/web/interfaces/TextTrackEventMap.html#error) | Fired when an error occurred while loading or parsing the track. | -| Text Track | [exitcue](pathname:///theoplayer/v10/api-reference/web/interfaces/TextTrackEventMap.html#exitcue) | Fired when a cue of the track exits. | -| Text Track | [readystatechange](pathname:///theoplayer/v10/api-reference/web/interfaces/TextTrackEventMap.html#readystatechange) | Fired when the text track's changes. | -| Text Track | [removecue](pathname:///theoplayer/v10/api-reference/web/interfaces/TextTrackEventMap.html#removecue) | Fired when a cue of the track is removed. | -| Text Track | [typechange](pathname:///theoplayer/v10/api-reference/web/interfaces/TextTrackEventMap.html#typechange) | Fired when the text track's changes. | -| [Text Track Cue](pathname:///theoplayer/v10/api-reference/web/interfaces/TextTrackCueEventMap.html) | [enter](pathname:///theoplayer/v10/api-reference/web/interfaces/TextTrackCueEventMap.html#enter) | Fired when the cue is entered. | -| Text Track Cue | [exit](pathname:///theoplayer/v10/api-reference/web/interfaces/TextTrackCueEventMap.html#exit) | Fired when the cue is exited. | -| Text Track Cue | [update](pathname:///theoplayer/v10/api-reference/web/interfaces/TextTrackCueEventMap.html#update) | Fired when the cue is updated. | -| [Presentation](pathname:///theoplayer/v10/api-reference/web/interfaces/PresentationEventMap.html) | [error](pathname:///theoplayer/v10/api-reference/web/interfaces/PresentationEventMap.html#error) | Fired when an error occurs. | -| Presentation | [presentationmodechange](pathname:///theoplayer/v10/api-reference/web/interfaces/PresentationEventMap.html#presentationmodechange) | Fired when the presentation mode changes. | -| [VR](pathname:///theoplayer/v10/api-reference/web/interfaces/VREventMap.html) | [directionchange](pathname:///theoplayer/v10/api-reference/web/interfaces/VREventMap.html#directionchange) | Fired when the VR.direction changes. | -| VR | [error](pathname:///theoplayer/v10/api-reference/web/interfaces/VREventMap.html#error) | Fired when an error occurs. | -| VR | [statechange](pathname:///theoplayer/v10/api-reference/web/interfaces/VREventMap.html#statechange) | Fired when the VR.state changes. | -| VR | [stereochange](pathname:///theoplayer/v10/api-reference/web/interfaces/VREventMap.html#stereochange) | Fired when the VR.stereo changes. | -| [Uplynk](pathname:///theoplayer/v10/api-reference/web/interfaces/UplynkEventMap.html) | [assetinforesponse](pathname:///theoplayer/v10/api-reference/web/interfaces/UplynkEventMap.html#assetinforesponse) | Fired when an asset info response is received. | -| Uplynk | [pingerror](pathname:///theoplayer/v10/api-reference/web/interfaces/UplynkEventMap.html#pingerror) | Fired when an error or invalid response is received from the Ping API. | -| Uplynk | [pingresponse](pathname:///theoplayer/v10/api-reference/web/interfaces/UplynkEventMap.html#pingresponse) | Fired when a Ping response is received. | -| Uplynk | [preplayresponse](pathname:///theoplayer/v10/api-reference/web/interfaces/UplynkEventMap.html#preplayresponse) | Fired when a Preplay response is received. | -| Uplynk | [ads](pathname:///theoplayer/v10/api-reference/web/interfaces/Uplynk.html#ads) | The Uplynk SSAI API. | -| Uplynk | [assets](pathname:///theoplayer/v10/api-reference/web/interfaces/Uplynk.html#assets) | List of Uplynk assets. | -| [Uplynk Ad Break List](pathname:///theoplayer/v10/api-reference/web/interfaces/UplynkAdBreakListEventMap.html) | [addadbreak](pathname:///theoplayer/v10/api-reference/web/interfaces/UplynkAdBreakListEventMap.html#addadbreak) | Fired when the ad break is added. | -| Uplynk Ad Break List | [removeadbreak](pathname:///theoplayer/v10/api-reference/web/interfaces/UplynkAdBreakListEventMap.html#removeadbreak) | Fired when the ad break is removed. | -| [Uplynk Ad Break](pathname:///theoplayer/v10/api-reference/web/interfaces/UplynkAdBreakEventMap.html) | [adbreakbegin](pathname:///theoplayer/v10/api-reference/web/interfaces/UplynkAdBreakEventMap.html#adbreakbegin) | Fired when the ad break begins. | -| Uplynk Ad Break | [adbreakend](pathname:///theoplayer/v10/api-reference/web/interfaces/UplynkAdBreakEventMap.html#adbreakend) | Fired when the ad break ends. | -| Uplynk Ad Break | [adbreakskip](pathname:///theoplayer/v10/api-reference/web/interfaces/UplynkAdBreakEventMap.html#adbreakskip) | Fired when the ad break is skipped. | -| Uplynk Ad Break | [updateadbreak](pathname:///theoplayer/v10/api-reference/web/interfaces/UplynkAdBreakEventMap.html#updateadbreak) | Fired when the ad break is updated. | -| [Uplynk Ad](pathname:///theoplayer/v10/api-reference/web/interfaces/UplynkAdEventMap.html) | [adbegin](pathname:///theoplayer/v10/api-reference/web/interfaces/UplynkAdEventMap.html#adbegin) | Fired when an ad begins. | -| Uplynk Ad | [adcomplete](pathname:///theoplayer/v10/api-reference/web/interfaces/UplynkAdEventMap.html#adcomplete) | Fired when the ad is completed. | -| Uplynk Ad | [adend](pathname:///theoplayer/v10/api-reference/web/interfaces/UplynkAdEventMap.html#adend) | Fired when the ad ends. | -| Uplynk Ad | [adfirstquartile](pathname:///theoplayer/v10/api-reference/web/interfaces/UplynkAdEventMap.html#adfirstquartile) | Fired when the ad reaches the first quartile. | -| Uplynk Ad | [admidpoint](pathname:///theoplayer/v10/api-reference/web/interfaces/UplynkAdEventMap.html#admidpoint) | Fired when the ad reaches the mid point. | -| Uplynk Ad | [adthirdquartile](pathname:///theoplayer/v10/api-reference/web/interfaces/UplynkAdEventMap.html#adthirdquartile) | Fired when the ad reaches the third quartile. | +| [Player](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html) | [canplay](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#canplay) | Fired when the player can resume playback of the media data. | +| Player | [canplaythrough](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#canplaythrough) | Fired when the player can resume playback of the media data and buffering is unlikely. | +| Player | [contentprotectionerror](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#contentprotectionerror) | Fired when an error related to content protection occurs. | +| Player | [contentprotectionsuccess](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#contentprotectionsuccess) | Fired when the key is usable for decryption. | +| Player | [currentsourcechange](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#currentsourcechange) | Fired when the current source, which is chosen from ChromelessPlayer.source.sources, changes. | +| Player | [destroy](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#destroy) | Fired when the the player is destroyed. | +| Player | [dimensionchange](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#dimensionchange) | Fired when the dimensions of the HTML element changes. | +| Player | [durationchange](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#durationchange) | Fired when ChromelessPlayer.duration changes. | +| Player | [emptied](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#emptied) | Fired when the player's source is cleared. | +| Player | [encrypted](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#encrypted) | Fired when the player encounters key system initialization data in the media data. | +| Player | [ended](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#ended) | Fired when playback has stopped because the end of the media resource was reached. | +| Player | [error](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#error) | Fired when an error occurs. | +| Player | [loadeddata](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#loadeddata) | Fired when the player can render the media data at the current playback position for the first time. | +| Player | [loadedmetadata](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#loadedmetadata) | Fired when the player determines the duration and dimensions of the media resource. | +| Player | [loadstart](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#loadstart) | Fired when the player starts loading the manifest. | +| Player | [manifestupdate](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#manifestupdate) | Fired when the manifest is updated. | +| Player | [pause](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#pause) | Fired when ChromelessPlayer.paused changes to true. | +| Player | [play](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#play) | Fired when ChromelessPlayer.paused changes to false. | +| Player | [playing](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#playing) | Fired when playback is ready to start after having been paused or delayed due to lack of media data. | +| Player | [progress](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#progress) | Fired when the player loaded media data. | +| Player | [ratechange](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#ratechange) | Fired when ChromelessPlayer.playbackRate changes. | +| Player | [readystatechange](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#readystatechange) | Fired when ChromelessPlayer.readyState changes. | +| Player | [representationchange](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#representationchange) | Fired when the current representation changes. | +| Player | [resize](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#resize) | Fired when either ChromelessPlayer.videoWidth or ChromelessPlayer.videoHeight changes. | +| Player | [seeked](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#seeked) | Fired when ChromelessPlayer.seeking changes to false after the current playback position was changed. | +| Player | [seeking](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#seeking) | Fired when ChromelessPlayer.seeking changes to true, and the player has started seeking to a new position. | +| Player | [segmentnotfound](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#segmentnotfound) | Fired when a segment can not be found. | +| Player | [sourcechange](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#sourcechange) | Fired when ChromelessPlayer.source changes. | +| Player | [timeupdate](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#timeupdate) | Fired when the current playback position changed as part of normal playback or in an especially interesting way, for example discontinuously. | +| Player | [volumechange](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#volumechange) | Fired when ChromelessPlayer.volume changes. | +| Player | [waiting](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#waiting) | Fired when playback has stopped because the next frame is not available, but the player expects that frame to become available in due course. | +| Player | [currentTime](pathname:///theoplayer/v11/api-reference/web/classes/ChromelessPlayer.html#currenttime) | The current playback position of the media, in seconds. | +| Player | [currentProgramDateTime](pathname:///theoplayer/v11/api-reference/web/classes/ChromelessPlayer.html#currentprogramdatetime) | The current playback position of the media, as a timestamp. | +| Player | [muted](pathname:///theoplayer/v11/api-reference/web/classes/ChromelessPlayer.html#muted) | Whether audio is muted. | +| Player | [...](pathname:///theoplayer/v11/api-reference/web/classes/ChromelessPlayer.html) | ... | +| [Ads (Client-Side)](pathname:///theoplayer/v11/api-reference/web/interfaces/AdsEventMap.html) | [adbegin](pathname:///theoplayer/v11/api-reference/web/interfaces/AdsEventMap.html#adbegin) | Fired when an ad begins. | +| Ads (Client-Side) | [adbreakbegin](pathname:///theoplayer/v11/api-reference/web/interfaces/AdsEventMap.html#adbreakbegin) | Fired when an ad break begins. | +| Ads (Client-Side) | [adbreakchange](pathname:///theoplayer/v11/api-reference/web/interfaces/AdsEventMap.html#adbreakchange) | Fired when an ad break changes. | +| Ads (Client-Side) | [adbreakend](pathname:///theoplayer/v11/api-reference/web/interfaces/AdsEventMap.html#adbreakend) | Fired when an ad break ends. | +| Ads (Client-Side) | [adbuffering](pathname:///theoplayer/v11/api-reference/web/interfaces/AdsEventMap.html#adbuffering) | Fired when the ad has stalled playback to buffer. | +| Ads (Client-Side) | [addad](pathname:///theoplayer/v11/api-reference/web/interfaces/AdsEventMap.html#addad) | Fired when an ad is added. | +| Ads (Client-Side) | [addadbreak](pathname:///theoplayer/v11/api-reference/web/interfaces/AdsEventMap.html#addadbreak) | Fired when an ad break is added. | +| Ads (Client-Side) | [adend](pathname:///theoplayer/v11/api-reference/web/interfaces/AdsEventMap.html#adend) | Fired when an ad ends. | +| Ads (Client-Side) | [aderror](pathname:///theoplayer/v11/api-reference/web/interfaces/AdsEventMap.html#aderror) | Fired when an ad errors. | +| Ads (Client-Side) | [adfirstquartile](pathname:///theoplayer/v11/api-reference/web/interfaces/AdsEventMap.html#adfirstquartile) | Fired when an ad reaches the first quartile. | +| Ads (Client-Side) | [adimpression](pathname:///theoplayer/v11/api-reference/web/interfaces/AdsEventMap.html#adimpression) | Fired when an ad counts as an impression. | +| Ads (Client-Side) | [adloaded](pathname:///theoplayer/v11/api-reference/web/interfaces/AdsEventMap.html#adloaded) | Fired when an ad is loaded. | +| Ads (Client-Side) | [admetadata](pathname:///theoplayer/v11/api-reference/web/interfaces/AdsEventMap.html#admetadata) | Fired when an ads list is loaded. | +| Ads (Client-Side) | [admidpoint](pathname:///theoplayer/v11/api-reference/web/interfaces/AdsEventMap.html#admidpoint) | Fired when an ad reaches the mid point. | +| Ads (Client-Side) | [adskip](pathname:///theoplayer/v11/api-reference/web/interfaces/AdsEventMap.html#adskip) | Fired when an ad is skipped. | +| Ads (Client-Side) | [adthirdquartile](pathname:///theoplayer/v11/api-reference/web/interfaces/AdsEventMap.html#adthirdquartile) | Fired when an ad reaches the third quartile. | +| Ads (Client-Side) | [removeadbreak](pathname:///theoplayer/v11/api-reference/web/interfaces/AdsEventMap.html#removeadbreak) | Fired when an ad break is removed. | +| Ads (Client-Side) | [updatead](pathname:///theoplayer/v11/api-reference/web/interfaces/AdsEventMap.html#updatead) | Fired when an ad is updated. | +| Ads (Client-Side) | [updateadbreak](pathname:///theoplayer/v11/api-reference/web/interfaces/AdsEventMap.html#updateadbreak) | Fired when an AdBreak is updated. | +| [Vendor Cast](pathname:///theoplayer/v11/api-reference/web/interfaces/VendorCastEventMap.html) | [statechange](pathname:///theoplayer/v11/api-reference/web/interfaces/VendorCastEventMap.html#statechange) | Fired when the state changes. | +| [Chromecast](pathname:///theoplayer/v11/api-reference/web/interfaces/ChromecastEventMap.html) | [error](pathname:///theoplayer/v11/api-reference/web/interfaces/ChromecastEventMap.html#error) | Fired when an error occurs while casting or trying to cast. | +| [Track List](pathname:///theoplayer/v11/api-reference/web/interfaces/TrackListEventMap.html) | [addtrack](pathname:///theoplayer/v11/api-reference/web/interfaces/TrackListEventMap.html#addtrack) | Fired when a track is added. | +| Track List | [change](pathname:///theoplayer/v11/api-reference/web/interfaces/TrackListEventMap.html#change) | Fired when a track is activated or deactivated. | +| Track List | [removetrack](pathname:///theoplayer/v11/api-reference/web/interfaces/TrackListEventMap.html#removetrack) | Fired when a track is removed. | +| [Track](pathname:///theoplayer/v11/api-reference/web/interfaces/TrackEventMap.html) | [change](pathname:///theoplayer/v11/api-reference/web/interfaces/TrackEventMap.html#change) | Fired when a media track's enabled or a text track's changes. | +| Track | [update](pathname:///theoplayer/v11/api-reference/web/interfaces/TrackEventMap.html#update) | Fired when the track updates. | +| [Media Track](pathname:///theoplayer/v11/api-reference/web/interfaces/MediaTrackEventMap.html) | [activequalitychanged](pathname:///theoplayer/v11/api-reference/web/interfaces/MediaTrackEventMap.html#activequalitychanged) | Fired when the media track's active quality changes. | +| Media Track | [qualityunavailable](pathname:///theoplayer/v11/api-reference/web/interfaces/MediaTrackEventMap.html#qualityunavailable) | Fired when a quality of the track becomes unavailable. | +| Media Track | [targetqualitychanged](pathname:///theoplayer/v11/api-reference/web/interfaces/MediaTrackEventMap.html#targetqualitychanged) | Fired when the media track's target quality changes. | +| [Text Track](pathname:///theoplayer/v11/api-reference/web/interfaces/TextTrackEventMap.html) | [addcue](pathname:///theoplayer/v11/api-reference/web/interfaces/TextTrackEventMap.html#addcue) | Fired when a cue is added to the track. | +| Text Track | [cuechange](pathname:///theoplayer/v11/api-reference/web/interfaces/TextTrackEventMap.html#cuechange) | Fired when a cue of the track changes. | +| Text Track | [entercue](pathname:///theoplayer/v11/api-reference/web/interfaces/TextTrackEventMap.html#entercue) | Fired when a cue of the track enters. | +| Text Track | [error](pathname:///theoplayer/v11/api-reference/web/interfaces/TextTrackEventMap.html#error) | Fired when an error occurred while loading or parsing the track. | +| Text Track | [exitcue](pathname:///theoplayer/v11/api-reference/web/interfaces/TextTrackEventMap.html#exitcue) | Fired when a cue of the track exits. | +| Text Track | [readystatechange](pathname:///theoplayer/v11/api-reference/web/interfaces/TextTrackEventMap.html#readystatechange) | Fired when the text track's changes. | +| Text Track | [removecue](pathname:///theoplayer/v11/api-reference/web/interfaces/TextTrackEventMap.html#removecue) | Fired when a cue of the track is removed. | +| Text Track | [typechange](pathname:///theoplayer/v11/api-reference/web/interfaces/TextTrackEventMap.html#typechange) | Fired when the text track's changes. | +| [Text Track Cue](pathname:///theoplayer/v11/api-reference/web/interfaces/TextTrackCueEventMap.html) | [enter](pathname:///theoplayer/v11/api-reference/web/interfaces/TextTrackCueEventMap.html#enter) | Fired when the cue is entered. | +| Text Track Cue | [exit](pathname:///theoplayer/v11/api-reference/web/interfaces/TextTrackCueEventMap.html#exit) | Fired when the cue is exited. | +| Text Track Cue | [update](pathname:///theoplayer/v11/api-reference/web/interfaces/TextTrackCueEventMap.html#update) | Fired when the cue is updated. | +| [Presentation](pathname:///theoplayer/v11/api-reference/web/interfaces/PresentationEventMap.html) | [error](pathname:///theoplayer/v11/api-reference/web/interfaces/PresentationEventMap.html#error) | Fired when an error occurs. | +| Presentation | [presentationmodechange](pathname:///theoplayer/v11/api-reference/web/interfaces/PresentationEventMap.html#presentationmodechange) | Fired when the presentation mode changes. | +| [VR](pathname:///theoplayer/v11/api-reference/web/interfaces/VREventMap.html) | [directionchange](pathname:///theoplayer/v11/api-reference/web/interfaces/VREventMap.html#directionchange) | Fired when the VR.direction changes. | +| VR | [error](pathname:///theoplayer/v11/api-reference/web/interfaces/VREventMap.html#error) | Fired when an error occurs. | +| VR | [statechange](pathname:///theoplayer/v11/api-reference/web/interfaces/VREventMap.html#statechange) | Fired when the VR.state changes. | +| VR | [stereochange](pathname:///theoplayer/v11/api-reference/web/interfaces/VREventMap.html#stereochange) | Fired when the VR.stereo changes. | +| [Uplynk](pathname:///theoplayer/v11/api-reference/web/interfaces/UplynkEventMap.html) | [assetinforesponse](pathname:///theoplayer/v11/api-reference/web/interfaces/UplynkEventMap.html#assetinforesponse) | Fired when an asset info response is received. | +| Uplynk | [pingerror](pathname:///theoplayer/v11/api-reference/web/interfaces/UplynkEventMap.html#pingerror) | Fired when an error or invalid response is received from the Ping API. | +| Uplynk | [pingresponse](pathname:///theoplayer/v11/api-reference/web/interfaces/UplynkEventMap.html#pingresponse) | Fired when a Ping response is received. | +| Uplynk | [preplayresponse](pathname:///theoplayer/v11/api-reference/web/interfaces/UplynkEventMap.html#preplayresponse) | Fired when a Preplay response is received. | +| Uplynk | [ads](pathname:///theoplayer/v11/api-reference/web/interfaces/Uplynk.html#ads) | The Uplynk SSAI API. | +| Uplynk | [assets](pathname:///theoplayer/v11/api-reference/web/interfaces/Uplynk.html#assets) | List of Uplynk assets. | +| [Uplynk Ad Break List](pathname:///theoplayer/v11/api-reference/web/interfaces/UplynkAdBreakListEventMap.html) | [addadbreak](pathname:///theoplayer/v11/api-reference/web/interfaces/UplynkAdBreakListEventMap.html#addadbreak) | Fired when the ad break is added. | +| Uplynk Ad Break List | [removeadbreak](pathname:///theoplayer/v11/api-reference/web/interfaces/UplynkAdBreakListEventMap.html#removeadbreak) | Fired when the ad break is removed. | +| [Uplynk Ad Break](pathname:///theoplayer/v11/api-reference/web/interfaces/UplynkAdBreakEventMap.html) | [adbreakbegin](pathname:///theoplayer/v11/api-reference/web/interfaces/UplynkAdBreakEventMap.html#adbreakbegin) | Fired when the ad break begins. | +| Uplynk Ad Break | [adbreakend](pathname:///theoplayer/v11/api-reference/web/interfaces/UplynkAdBreakEventMap.html#adbreakend) | Fired when the ad break ends. | +| Uplynk Ad Break | [adbreakskip](pathname:///theoplayer/v11/api-reference/web/interfaces/UplynkAdBreakEventMap.html#adbreakskip) | Fired when the ad break is skipped. | +| Uplynk Ad Break | [updateadbreak](pathname:///theoplayer/v11/api-reference/web/interfaces/UplynkAdBreakEventMap.html#updateadbreak) | Fired when the ad break is updated. | +| [Uplynk Ad](pathname:///theoplayer/v11/api-reference/web/interfaces/UplynkAdEventMap.html) | [adbegin](pathname:///theoplayer/v11/api-reference/web/interfaces/UplynkAdEventMap.html#adbegin) | Fired when an ad begins. | +| Uplynk Ad | [adcomplete](pathname:///theoplayer/v11/api-reference/web/interfaces/UplynkAdEventMap.html#adcomplete) | Fired when the ad is completed. | +| Uplynk Ad | [adend](pathname:///theoplayer/v11/api-reference/web/interfaces/UplynkAdEventMap.html#adend) | Fired when the ad ends. | +| Uplynk Ad | [adfirstquartile](pathname:///theoplayer/v11/api-reference/web/interfaces/UplynkAdEventMap.html#adfirstquartile) | Fired when the ad reaches the first quartile. | +| Uplynk Ad | [admidpoint](pathname:///theoplayer/v11/api-reference/web/interfaces/UplynkAdEventMap.html#admidpoint) | Fired when the ad reaches the mid point. | +| Uplynk Ad | [adthirdquartile](pathname:///theoplayer/v11/api-reference/web/interfaces/UplynkAdEventMap.html#adthirdquartile) | Fired when the ad reaches the third quartile. | Our APIs are continuously evolving, and so is our list of events. Refer to our API references of our SDKs to go through the latest sets of events: -- [Web SDK](pathname:///theoplayer/v10/api-reference/web/) -- [iOS SDK](pathname:///theoplayer/v10/api-reference/ios/) -- [Android SDK](pathname:///theoplayer/v10/api-reference/android/) +- [Web SDK](pathname:///theoplayer/v11/api-reference/web/) +- [iOS SDK](pathname:///theoplayer/v11/api-reference/ios/) +- [Android SDK](pathname:///theoplayer/v11/api-reference/android/) diff --git a/theoplayer/how-to-guides/09-player/01-how-do-you-know-when-a-stream-or-ad-is-playing.md b/theoplayer/how-to-guides/09-player/01-how-do-you-know-when-a-stream-or-ad-is-playing.md index 2e0b02335667..c8c74d860ae3 100644 --- a/theoplayer/how-to-guides/09-player/01-how-do-you-know-when-a-stream-or-ad-is-playing.md +++ b/theoplayer/how-to-guides/09-player/01-how-do-you-know-when-a-stream-or-ad-is-playing.md @@ -19,7 +19,7 @@ There are certainly different ways to do so: it is enough to have a look at your ### Code examples -You can use the `playing` event to know when content (or an ad) starts playing. Its event handler is the correct scope to check whether an advertisement is playing through the [`player.ads.playing`](pathname:///theoplayer/v10/api-reference/web/interfaces/Ads.html#playing) property. +You can use the `playing` event to know when content (or an ad) starts playing. Its event handler is the correct scope to check whether an advertisement is playing through the [`player.ads.playing`](pathname:///theoplayer/v11/api-reference/web/interfaces/Ads.html#playing) property. Let's see some code examples for the various SDKs. @@ -65,5 +65,5 @@ self.eventListener = self.theoplayer.addEventListener(type: PlayerEventTypes.PLA ## Resources -- [Reference API - Ads.playing property](pathname:///theoplayer/v10/api-reference/web/interfaces/Ads.html#playing) -- [Reference API - playing property](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#playing) +- [Reference API - Ads.playing property](pathname:///theoplayer/v11/api-reference/web/interfaces/Ads.html#playing) +- [Reference API - playing property](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#playing) diff --git a/theoplayer/how-to-guides/09-player/03-how-can-we-track-the-first-playing-event.md b/theoplayer/how-to-guides/09-player/03-how-can-we-track-the-first-playing-event.md index 65c29c2680cb..6c4cb997790a 100644 --- a/theoplayer/how-to-guides/09-player/03-how-can-we-track-the-first-playing-event.md +++ b/theoplayer/how-to-guides/09-player/03-how-can-we-track-the-first-playing-event.md @@ -1,6 +1,6 @@ # How can we track the first play(ing) event? -The question above is commonly asked to assist with the use-cases where the first [`play`](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#play) event thrown by THEOplayer for a specific stream needs to be detected. Similar questions are: +The question above is commonly asked to assist with the use-cases where the first [`play`](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#play) event thrown by THEOplayer for a specific stream needs to be detected. Similar questions are: - The developer wants to know when a new stream plays for the first time. - The developer wants to forward a `firstplay` event to an analytics backend. @@ -132,4 +132,4 @@ To track only the first `playing` event we will add a "playing" event and a call ## Resources -- [Reference API - play event](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#play): +- [Reference API - play event](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#play): diff --git a/theoplayer/how-to-guides/09-player/04-how-to-track-player-states.md b/theoplayer/how-to-guides/09-player/04-how-to-track-player-states.md index bc9a67c191e0..093b3f2bbb7c 100644 --- a/theoplayer/how-to-guides/09-player/04-how-to-track-player-states.md +++ b/theoplayer/how-to-guides/09-player/04-how-to-track-player-states.md @@ -83,15 +83,15 @@ The following code samples demonstrate how you track some of the 18 events relat All 18 events are dispatched by the `Player` interface. -- Web SDK: [interface](pathname:///theoplayer/v10/api-reference/web/classes/ChromelessPlayer.html) and [events](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html) -- Android SDK: [interface](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/player/Player.html) and [events](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/event/player/PlayerEventTypes.html) -- iOS SDK: [interface](pathname:///theoplayer/v10/api-reference/ios/Classes/THEOplayer.html) and [events](pathname:///theoplayer/v10/api-reference/ios/Structs/PlayerEventTypes.html) +- Web SDK: [interface](pathname:///theoplayer/v11/api-reference/web/classes/ChromelessPlayer.html) and [events](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html) +- Android SDK: [interface](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/player/Player.html) and [events](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/event/player/PlayerEventTypes.html) +- iOS SDK: [interface](pathname:///theoplayer/v11/api-reference/ios/Classes/THEOplayer.html) and [events](pathname:///theoplayer/v11/api-reference/ios/Structs/PlayerEventTypes.html) - Roku SDK #### Web SDK The snippet below demonstrates how you can track some of the related events through the THEOplayer Web SDK. -All other events can be tracked similarly. You can find the event names in [the `PlayerEventMap` API reference](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html). +All other events can be tracked similarly. You can find the event names in [the `PlayerEventMap` API reference](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html). This approach is valid for all web-based platforms, including Tizen and webOS. ```javascript @@ -107,7 +107,7 @@ player.addEventListener('ended', (event) => { #### Android SDK The snippet below demonstrates how you can track some of the related events through the THEOplayer Android SDK. -All other events can be tracked similarly. You can find the event names in [the `PlayerEventTypes` API reference](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/event/player/PlayerEventTypes.html). +All other events can be tracked similarly. You can find the event names in [the `PlayerEventTypes` API reference](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/event/player/PlayerEventTypes.html). This approach is valid for all Android-based platforms, including Android TV and Fire TV. ```java @@ -123,7 +123,7 @@ player.addEventListener(PlayerEventTypes.ENDED, event -> { #### iOS/tvOS SDK and Legacy iOS/tvOS SDK (4.12.x) The snippet below demonstrates how you can track some of the related events through the THEOplayer iOS SDK. -All other events can be tracked similarly. You can find the event names in [the `PlayerEventTypes` API reference](pathname:///theoplayer/v10/api-reference/ios/Structs/PlayerEventTypes.html). +All other events can be tracked similarly. You can find the event names in [the `PlayerEventTypes` API reference](pathname:///theoplayer/v11/api-reference/ios/Structs/PlayerEventTypes.html). This approach is valid for all iOS-based platforms, including iPadOS and tvOS. ```swift diff --git a/theoplayer/how-to-guides/10-texttrack/01-how-to-dynamically-change-the-visible-captions.md b/theoplayer/how-to-guides/10-texttrack/01-how-to-dynamically-change-the-visible-captions.md index 9c4de38d370d..c9d139dc2b18 100644 --- a/theoplayer/how-to-guides/10-texttrack/01-how-to-dynamically-change-the-visible-captions.md +++ b/theoplayer/how-to-guides/10-texttrack/01-how-to-dynamically-change-the-visible-captions.md @@ -2,7 +2,7 @@ When working with the captions / text-track options, you can dynamically change the currently selected language (or set a default language) using following methods. -This method assumes that you are using text-tracks that are loaded with the manifest. If you add the text-track separately, you can just use this API: [TextTrackDescription](pathname:///theoplayer/v10/api-reference/web/interfaces/TextTrackDescription.html) +This method assumes that you are using text-tracks that are loaded with the manifest. If you add the text-track separately, you can just use this API: [TextTrackDescription](pathname:///theoplayer/v11/api-reference/web/interfaces/TextTrackDescription.html) ## Step-by-step guide diff --git a/theoplayer/how-to-guides/10-texttrack/02-how-to-programmatically-detect-text-tracks.md b/theoplayer/how-to-guides/10-texttrack/02-how-to-programmatically-detect-text-tracks.md index dfa4a7e8627f..ed0e0bb75247 100644 --- a/theoplayer/how-to-guides/10-texttrack/02-how-to-programmatically-detect-text-tracks.md +++ b/theoplayer/how-to-guides/10-texttrack/02-how-to-programmatically-detect-text-tracks.md @@ -17,7 +17,7 @@ The code examples below showcase how to implement the detection of audio tracks ##### Web SDK -The Web SDK leverages the [TextTrack API](pathname:///theoplayer/v10/api-reference/web/interfaces/TextTrack.html). +The Web SDK leverages the [TextTrack API](pathname:///theoplayer/v11/api-reference/web/interfaces/TextTrack.html). ```js function handleAddTrackEvent(addTrackEvent) { @@ -28,7 +28,7 @@ player.textTracks.addEventListener('addtrack', handleAddTrackEvent); ##### Android (TV) SDK -The Android SDK leverages the [TextTrack API](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/player/track/texttrack/TextTrackList.html). +The Android SDK leverages the [TextTrack API](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/player/track/texttrack/TextTrackList.html). ```java EventListener handleAudioTrackAdd = new EventListener() { @@ -42,7 +42,7 @@ tpv.getPlayer().getTextTracks().addEventListener(TextTrackListEventTypes.ADDTRAC ##### iOS (/tvOS) SDK -The iOS SDK leverages the [MediaTrack API](pathname:///theoplayer/v10/api-reference/ios/Protocols/MediaTrackList.html). +The iOS SDK leverages the [MediaTrack API](pathname:///theoplayer/v11/api-reference/ios/Protocols/MediaTrackList.html). ```swift func handleAddTrackEvent(addTrackEvent : AddTrackEvent) { diff --git a/theoplayer/how-to-guides/10-texttrack/04-how-to-insert-subtitles.md b/theoplayer/how-to-guides/10-texttrack/04-how-to-insert-subtitles.md index 7262c005cb74..07ab9168e44d 100644 --- a/theoplayer/how-to-guides/10-texttrack/04-how-to-insert-subtitles.md +++ b/theoplayer/how-to-guides/10-texttrack/04-how-to-insert-subtitles.md @@ -20,7 +20,7 @@ The _textTracks_ property and objects can also be used for other purposes, e.g.: ##### Web SDK -Each text track should be described as a [TextTrackDescription](pathname:///theoplayer/v10/api-reference/web/interfaces/TextTrackDescription.html). +Each text track should be described as a [TextTrackDescription](pathname:///theoplayer/v11/api-reference/web/interfaces/TextTrackDescription.html). ```js player.source = { diff --git a/theoplayer/how-to-guides/10-texttrack/06-how-to-track-id3-cues-tags.md b/theoplayer/how-to-guides/10-texttrack/06-how-to-track-id3-cues-tags.md index dee7195362a7..b72a3ad55788 100644 --- a/theoplayer/how-to-guides/10-texttrack/06-how-to-track-id3-cues-tags.md +++ b/theoplayer/how-to-guides/10-texttrack/06-how-to-track-id3-cues-tags.md @@ -6,7 +6,7 @@ The question above is commonly asked by the developers who want to introduce a c - to overlay certain text on top of the player (e.g. the score of a football match). - ... -[ID3](https://en.wikipedia.org/wiki/ID3) is a type of metadata which can be inserted in HTTP livestreams. Once an ID3 cue is inserted, it'll be added to a THEOplayer [TextTrack](pathname:///theoplayer/v10/api-reference/web/interfaces/TextTrack.html). +[ID3](https://en.wikipedia.org/wiki/ID3) is a type of metadata which can be inserted in HTTP livestreams. Once an ID3 cue is inserted, it'll be added to a THEOplayer [TextTrack](pathname:///theoplayer/v11/api-reference/web/interfaces/TextTrack.html). The demo at [https://demo.theoplayer.com/audio-id3-metadata](https://demo.theoplayer.com/audio-id3-metadata) demonstrates a usage of ID3 metadata. Just before the song changes, an `enter` event will be dispatched, the song information (title, album, etc.) is contained within this `enter` event, and can be used to update the UI. ## SDKs @@ -74,7 +74,7 @@ _ = player.textTracks.addEventListener(type: TextTrackListEventTypes.ADD_TRACK, ### Track the enter event -The snippet below explains how you correctly track the `enter` event, which is part of the [TextTrack API](pathname:///theoplayer/v10/api-reference/web/interfaces/TextTrack.html). The `enter` event maps to the moment in time when the ID3 cue is relevant. +The snippet below explains how you correctly track the `enter` event, which is part of the [TextTrack API](pathname:///theoplayer/v11/api-reference/web/interfaces/TextTrack.html). The `enter` event maps to the moment in time when the ID3 cue is relevant. > ⚠ **Migrating from version 3.x or lower** > @@ -146,7 +146,7 @@ The demo below illustrates the use of ID3 in production. ## Resources -- [Reference API - TextTrack](pathname:///theoplayer/v10/api-reference/web/interfaces/TextTrack.html) +- [Reference API - TextTrack](pathname:///theoplayer/v11/api-reference/web/interfaces/TextTrack.html) - [http://id3.org/](http://id3.org/): ID3.org Home - [https://en.wikipedia.org/wiki/ID3](https://en.wikipedia.org/wiki/ID3): Wikipedia - ID3 - [https://dev.w3.org/html5/html-sourcing-inband-tracks/](https://dev.w3.org/html5/html-sourcing-inband-tracks/): External resource - Sourcing In-band Media Resource Tracks from Media Containers into HTML diff --git a/theoplayer/how-to-guides/10-texttrack/07-how-to-detect-text-track-changes.md b/theoplayer/how-to-guides/10-texttrack/07-how-to-detect-text-track-changes.md index 25533d12d4ab..366909912ddc 100644 --- a/theoplayer/how-to-guides/10-texttrack/07-how-to-detect-text-track-changes.md +++ b/theoplayer/how-to-guides/10-texttrack/07-how-to-detect-text-track-changes.md @@ -28,10 +28,10 @@ The TextTrack API is available across all of our base SDKs. As described in the The implementation of the Web SDK applies to all web-based platforms, including Tizen and webOS. -The Web SDK exposes the TextTrack API through [`player.textTracks`](pathname:///theoplayer/v10/api-reference/web/classes/ChromelessPlayer.html#texttracks). -This `textTracks` property is a [`TextTrackList`](pathname:///theoplayer/v10/api-reference/web/interfaces/TextTracksList.html) that inherits from the [`TrackList`](pathname:///theoplayer/v10/api-reference/web/interfaces/TrackList.html). -This `TrackList` dispatches the events from the [`TrackListEventMap`](pathname:///theoplayer/v10/api-reference/web/interfaces/TrackListEventMap.html). -This `TrackListEventMap` contains the [`change`](pathname:///theoplayer/v10/api-reference/web/interfaces/TrackListEventMap.html#change) event, as well as the `addtrack` and `removetrack` event. +The Web SDK exposes the TextTrack API through [`player.textTracks`](pathname:///theoplayer/v11/api-reference/web/classes/ChromelessPlayer.html#texttracks). +This `textTracks` property is a [`TextTrackList`](pathname:///theoplayer/v11/api-reference/web/interfaces/TextTracksList.html) that inherits from the [`TrackList`](pathname:///theoplayer/v11/api-reference/web/interfaces/TrackList.html). +This `TrackList` dispatches the events from the [`TrackListEventMap`](pathname:///theoplayer/v11/api-reference/web/interfaces/TrackListEventMap.html). +This `TrackListEventMap` contains the [`change`](pathname:///theoplayer/v11/api-reference/web/interfaces/TrackListEventMap.html#change) event, as well as the `addtrack` and `removetrack` event. The code below allows you to detect text track changes. @@ -43,16 +43,16 @@ player.textTracks.addEventListener('change', function (event) { }); ``` -The properties of a text `track` (e.g. `mode`, `kind`) are described in [the `TextTrack` API reference](pathname:///theoplayer/v10/api-reference/web/interfaces/TextTrack.html). +The properties of a text `track` (e.g. `mode`, `kind`) are described in [the `TextTrack` API reference](pathname:///theoplayer/v11/api-reference/web/interfaces/TextTrack.html). ### Android SDK The implementation of the Android SDK applies to all Android-based platforms, including Android TV and Fire TV. -The Android SDK exposes the TextTrack API through [`player.getTextTracks()`](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/player/Player.html#getTextTracks). -This `getTextTracks()` method returns a [`TextTrackList`](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/player/track/texttrack/TextTrackList.html) that inherits from the [`TrackList`](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/player/track/TrackList.html). -This `TrackList` dispatches the events from the [`TextTrackListEventTypes`](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/event/track/texttrack/list/TextTrackListEventTypes.html). -The `TextTrackListEventTypes` contains the [`TRACKLISTCHANGE`](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/event/track/texttrack/list/TextTrackListEventTypes.html#TRACKLISTCHANGE) event, as well as the `ADDTRACK` and `REMOVETRACK` event. +The Android SDK exposes the TextTrack API through [`player.getTextTracks()`](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/player/Player.html#getTextTracks). +This `getTextTracks()` method returns a [`TextTrackList`](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/player/track/texttrack/TextTrackList.html) that inherits from the [`TrackList`](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/player/track/TrackList.html). +This `TrackList` dispatches the events from the [`TextTrackListEventTypes`](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/event/track/texttrack/list/TextTrackListEventTypes.html). +The `TextTrackListEventTypes` contains the [`TRACKLISTCHANGE`](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/event/track/texttrack/list/TextTrackListEventTypes.html#TRACKLISTCHANGE) event, as well as the `ADDTRACK` and `REMOVETRACK` event. The code below allows you to detect text track changes. @@ -64,16 +64,16 @@ player.getTextTracks().addEventListener(TextTrackListEventTypes.TRACKLISTCHANGE, }); ``` -The properties of a text `track` (e.g. `mode`, `kind`) are described in the [`TextTrack`](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/player/track/texttrack/TextTrack.html) and [`Track`](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/player/track/Track.html) API references. +The properties of a text `track` (e.g. `mode`, `kind`) are described in the [`TextTrack`](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/player/track/texttrack/TextTrack.html) and [`Track`](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/player/track/Track.html) API references. ### iOS/tvOS SDK and Legacy iOS/tvOS SDK (4.12.x) The implementation of the iOS SDK applies to all iOS-based platforms, including iPadOS and tvOS. -The iOS SDK exposes the TrackTrack API through [`player.textTracks`](pathname:///theoplayer/v10/api-reference/ios/Classes/THEOplayer.html#/s:13THEOplayerSDK0A0C10textTracksAA13TextTrackList_pvp). -This `textTracks` property is a [`TextTrackList`](pathname:///theoplayer/v10/api-reference/ios/Protocols/TextTrackList.html). -This `TextTrackList` dispatches the events from the [`TextTrackListEventTypes`](pathname:///theoplayer/v10/api-reference/ios/Structs/TextTrackListEventTypes.html). -The `TextTrackListEventTypes` contains the [`CHANGE`](pathname:///theoplayer/v10/api-reference/ios/Structs/TextTrackListEventTypes.html#/s:13THEOplayerSDK23TextTrackListEventTypesV6CHANGEAA0F4TypeCyAA0d6ChangeF0CGvpZ) event, as well as the `ADD_TRACK` and `REMOVE_TRACK` event. +The iOS SDK exposes the TrackTrack API through [`player.textTracks`](pathname:///theoplayer/v11/api-reference/ios/Classes/THEOplayer.html#/s:13THEOplayerSDK0A0C10textTracksAA13TextTrackList_pvp). +This `textTracks` property is a [`TextTrackList`](pathname:///theoplayer/v11/api-reference/ios/Protocols/TextTrackList.html). +This `TextTrackList` dispatches the events from the [`TextTrackListEventTypes`](pathname:///theoplayer/v11/api-reference/ios/Structs/TextTrackListEventTypes.html). +The `TextTrackListEventTypes` contains the [`CHANGE`](pathname:///theoplayer/v11/api-reference/ios/Structs/TextTrackListEventTypes.html#/s:13THEOplayerSDK23TextTrackListEventTypesV6CHANGEAA0F4TypeCyAA0d6ChangeF0CGvpZ) event, as well as the `ADD_TRACK` and `REMOVE_TRACK` event. The code below allows you to detect text track changes. @@ -85,7 +85,7 @@ player?.textTracks.addEventListener(type: TextTrackListEventTypes.CHANGE, listen }) ``` -The properties of a text `track` (e.g. `mode`, `kind`) are described in the [`TextTrack`](pathname:///theoplayer/v10/api-reference/ios/Protocols/TextTrack.html) and [`Track`](pathname:///theoplayer/v10/api-reference/ios/Protocols/Track.html) API references. +The properties of a text `track` (e.g. `mode`, `kind`) are described in the [`TextTrack`](pathname:///theoplayer/v11/api-reference/ios/Protocols/TextTrack.html) and [`Track`](pathname:///theoplayer/v11/api-reference/ios/Protocols/Track.html) API references. ### Roku SDK diff --git a/theoplayer/how-to-guides/10-texttrack/08-how-to-detect-active-text-track-cues.md b/theoplayer/how-to-guides/10-texttrack/08-how-to-detect-active-text-track-cues.md index e70ea4e4145b..d92c0aef2a2c 100644 --- a/theoplayer/how-to-guides/10-texttrack/08-how-to-detect-active-text-track-cues.md +++ b/theoplayer/how-to-guides/10-texttrack/08-how-to-detect-active-text-track-cues.md @@ -33,11 +33,11 @@ Go to the subsection on ["implementation for timed metadata"](#implementation-fo The implementation of the Web SDK applies to all web-based platforms, including Tizen and webOS. -The Web SDK exposes the TextTrack API through [`player.textTracks`](pathname:///theoplayer/v10/api-reference/web/classes/ChromelessPlayer.html#texttracks). This `textTracks` property is a [`TextTrackList`](pathname:///theoplayer/v10/api-reference/web/interfaces/TextTracksList.html) that inherits from the [`TrackList`](pathname:///theoplayer/v10/api-reference/web/interfaces/TrackList.html). This `TrackList` dispatches the events from the [`TrackListEventMap`](pathname:///theoplayer/v10/api-reference/web/interfaces/TrackListEventMap.html). This `TrackListEventMap` contains the [`addtrack`](pathname:///theoplayer/v10/api-reference/web/interfaces/TrackListEventMap.html#change) event, as well as the `change` and `removetrack` event. +The Web SDK exposes the TextTrack API through [`player.textTracks`](pathname:///theoplayer/v11/api-reference/web/classes/ChromelessPlayer.html#texttracks). This `textTracks` property is a [`TextTrackList`](pathname:///theoplayer/v11/api-reference/web/interfaces/TextTracksList.html) that inherits from the [`TrackList`](pathname:///theoplayer/v11/api-reference/web/interfaces/TrackList.html). This `TrackList` dispatches the events from the [`TrackListEventMap`](pathname:///theoplayer/v11/api-reference/web/interfaces/TrackListEventMap.html). This `TrackListEventMap` contains the [`addtrack`](pathname:///theoplayer/v11/api-reference/web/interfaces/TrackListEventMap.html#change) event, as well as the `change` and `removetrack` event. -In the callback of your `addtrack` event, you want to track the [`addcue`](pathname:///theoplayer/v10/api-reference/web/interfaces/TextTrackEventMap.html#addcue) event through the [`TextTrack`](pathname:///theoplayer/v10/api-reference/web/interfaces/TextTrack.html) interface. Then, in the callback of your `addcue` event, you want to track the [`enter`](pathname:///theoplayer/v10/api-reference/web/interfaces/TextTrackCueEventMap.html#enter) and [`exit`](pathname:///theoplayer/v10/api-reference/web/interfaces/TextTrackCueEventMap.html#exit) events through the [`TextTrackCue`](pathname:///theoplayer/v10/api-reference/web/interfaces/TextTrackCue.html) interface. The `enter` event is dispatched when a cue becomes active and the `exit` event is dispatched when a cue becomes inactive. You can fetch the actual content in the callback of your `enter` event through its [`content`](https://docs.theoplayer.com/api-reference/web/theoplayer.texttrackcue.md#content) property. +In the callback of your `addtrack` event, you want to track the [`addcue`](pathname:///theoplayer/v11/api-reference/web/interfaces/TextTrackEventMap.html#addcue) event through the [`TextTrack`](pathname:///theoplayer/v11/api-reference/web/interfaces/TextTrack.html) interface. Then, in the callback of your `addcue` event, you want to track the [`enter`](pathname:///theoplayer/v11/api-reference/web/interfaces/TextTrackCueEventMap.html#enter) and [`exit`](pathname:///theoplayer/v11/api-reference/web/interfaces/TextTrackCueEventMap.html#exit) events through the [`TextTrackCue`](pathname:///theoplayer/v11/api-reference/web/interfaces/TextTrackCue.html) interface. The `enter` event is dispatched when a cue becomes active and the `exit` event is dispatched when a cue becomes inactive. You can fetch the actual content in the callback of your `enter` event through its [`content`](https://docs.theoplayer.com/api-reference/web/theoplayer.texttrackcue.md#content) property. -Alternatively, in the callback of your `addtrack` event, you could track the [`cuechange`](pathname:///theoplayer/v10/api-reference/web/interfaces/TextTrackEventMap.html#cuechange) event through the `TextTrack` interface. Then, in the callback of your `cuechange` event, you want to iterate over the active cues. For each active cue, you could also query its `content` property. +Alternatively, in the callback of your `addtrack` event, you could track the [`cuechange`](pathname:///theoplayer/v11/api-reference/web/interfaces/TextTrackEventMap.html#cuechange) event through the `TextTrack` interface. Then, in the callback of your `cuechange` event, you want to iterate over the active cues. For each active cue, you could also query its `content` property. The code below allows you to detect the active text track cues. @@ -68,11 +68,11 @@ You want to invoke these event handlers before you configure your stream, becaus The implementation of the Android SDK applies to all Android-based platforms, including Android TV and Fire TV. -The Android SDK exposes the TextTrack API through [`player.getTextTracks()`](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/player/Player.html#getTextTracks). This `getTextTracks()` method returns a [`TextTrackList`](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/player/track/texttrack/TextTrackList.html) that inherits from the [`TrackList`](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/player/track/TrackList.html). This `TrackList` dispatches the events from the [`TextTrackListEventTypes`](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/event/track/texttrack/list/TextTrackListEventTypes.html). The `TextTrackListEventTypes` contains the [`ADDTRACK`](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/event/track/texttrack/list/TextTrackListEventTypes.html#ADDTRACK) event, as well as the `TRACKLISTCHANGE` and `REMOVETRACK` event. +The Android SDK exposes the TextTrack API through [`player.getTextTracks()`](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/player/Player.html#getTextTracks). This `getTextTracks()` method returns a [`TextTrackList`](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/player/track/texttrack/TextTrackList.html) that inherits from the [`TrackList`](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/player/track/TrackList.html). This `TrackList` dispatches the events from the [`TextTrackListEventTypes`](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/event/track/texttrack/list/TextTrackListEventTypes.html). The `TextTrackListEventTypes` contains the [`ADDTRACK`](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/event/track/texttrack/list/TextTrackListEventTypes.html#ADDTRACK) event, as well as the `TRACKLISTCHANGE` and `REMOVETRACK` event. -In the callback of your `ADDTRACK` event, you want to track the [`ADDCUE`](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/event/track/texttrack/TextTrackEventTypes.html#ADDCUE) event through the [`TextTrack`](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/player/track/texttrack/TextTrack.html) interface. Then, in the callback of your `ADDCUE` event, you want to track the [`ENTER`](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/event/track/texttrack/texttrackcue/TextTrackCueEventTypes.html#ENTER) and [`EXIT`](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/event/track/texttrack/texttrackcue/TextTrackCueEventTypes.html#EXIT) events through the [`TextTrackCue`](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/player/track/texttrack/cue/TextTrackCue.html) interface. The `ENTER` event is dispatched when a cue becomes active and the `EXIT` event is dispatched when a cue becomes inactive. You can fetch the actual content in the callback of your `ENTER` event through its [`getContent()`](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/player/track/texttrack/cue/TextTrackCue.html#getContent--) method. +In the callback of your `ADDTRACK` event, you want to track the [`ADDCUE`](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/event/track/texttrack/TextTrackEventTypes.html#ADDCUE) event through the [`TextTrack`](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/player/track/texttrack/TextTrack.html) interface. Then, in the callback of your `ADDCUE` event, you want to track the [`ENTER`](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/event/track/texttrack/texttrackcue/TextTrackCueEventTypes.html#ENTER) and [`EXIT`](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/event/track/texttrack/texttrackcue/TextTrackCueEventTypes.html#EXIT) events through the [`TextTrackCue`](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/player/track/texttrack/cue/TextTrackCue.html) interface. The `ENTER` event is dispatched when a cue becomes active and the `EXIT` event is dispatched when a cue becomes inactive. You can fetch the actual content in the callback of your `ENTER` event through its [`getContent()`](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/player/track/texttrack/cue/TextTrackCue.html#getContent--) method. -Alternatively, in the callback of your `ADDTRACK` event, you could track the [`CUECHANGE`](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/event/track/texttrack/TextTrackEventTypes.html#CUECHANGE) event through the `TextTrack` interface. Then, in the callback of your `CUECHANGE` event, you want to iterate over the active cues. For each active cue, you could also query its `content` property. +Alternatively, in the callback of your `ADDTRACK` event, you could track the [`CUECHANGE`](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/event/track/texttrack/TextTrackEventTypes.html#CUECHANGE) event through the `TextTrack` interface. Then, in the callback of your `CUECHANGE` event, you want to iterate over the active cues. For each active cue, you could also query its `content` property. The code below allows you to detect the active text track cues. @@ -105,12 +105,12 @@ You want to invoke these event handlers before you configure your stream, becaus The implementation of the iOS SDK applies to all iOS-based platforms, including iPadOS and tvOS. -The iOS SDK exposes the TrackTrack API through [`player.textTracks`](pathname:///theoplayer/v10/api-reference/ios/Classes/THEOplayer.html#/s:13THEOplayerSDK0A0C10textTracksAA13TextTrackList_pvp). This `textTracks` property is a [`TextTrackList`](pathname:///theoplayer/v10/api-reference/ios/Protocols/TextTrackList.html). This `TextTrackList` dispatches the events from the [`TextTrackListEventTypes`](pathname:///theoplayer/v10/api-reference/ios/Structs/TextTrackListEventTypes.html). The `TextTrackListEventTypes` contains the [`ADD_TRACK`](pathname:///theoplayer/v10/api-reference/ios/Structs/TextTrackListEventTypes.html#/s:13THEOplayerSDK23TextTrackListEventTypesV9ADD_TRACKAA0F4TypeCyAA03AdddF0CGvpZ) event, as well as the `CHANGE` and `REMOVE_TRACK` event. +The iOS SDK exposes the TrackTrack API through [`player.textTracks`](pathname:///theoplayer/v11/api-reference/ios/Classes/THEOplayer.html#/s:13THEOplayerSDK0A0C10textTracksAA13TextTrackList_pvp). This `textTracks` property is a [`TextTrackList`](pathname:///theoplayer/v11/api-reference/ios/Protocols/TextTrackList.html). This `TextTrackList` dispatches the events from the [`TextTrackListEventTypes`](pathname:///theoplayer/v11/api-reference/ios/Structs/TextTrackListEventTypes.html). The `TextTrackListEventTypes` contains the [`ADD_TRACK`](pathname:///theoplayer/v11/api-reference/ios/Structs/TextTrackListEventTypes.html#/s:13THEOplayerSDK23TextTrackListEventTypesV9ADD_TRACKAA0F4TypeCyAA03AdddF0CGvpZ) event, as well as the `CHANGE` and `REMOVE_TRACK` event. -In the callback of your `ADD_TRACK` event, you want to track the [`ADD_CUE`](pathname:///theoplayer/v10/api-reference/ios/Structs/TextTrackEventTypes.html#/s:13THEOplayerSDK19TextTrackEventTypesV7ADD_CUEAA0E4TypeCyAA06AddCueE0CGvpZ) event through the [`TextTrack`](pathname:///theoplayer/v10/api-reference/ios/Protocols/TextTrack.html) interface. Then, in the callback of your `ADD_CUE` event, you want to track the [`ENTER`](pathname:///theoplayer/v10/api-reference/ios/Structs/TextTrackCueEventTypes.html#/s:13THEOplayerSDK22TextTrackCueEventTypesV5ENTERAA0F4TypeCyAA0e5EnterF0CGvpZ) and [`EXIT`](pathname:///theoplayer/v10/api-reference/ios/Structs/TextTrackCueEventTypes.html#/s:13THEOplayerSDK22TextTrackCueEventTypesV4EXITAA0F4TypeCyAA0e4ExitF0CGvpZ) events through the [`TextTrackCue`](pathname:///theoplayer/v10/api-reference/ios/Protocols/TextTrackCue.html) interface. The `ENTER` event is dispatched when a cue becomes active and the `EXIT` event is dispatched when a cue becomes inactive. -You can fetch the actual content in the callback of your `ENTER` event through its [`content`](pathname:///theoplayer/v10/api-reference/ios/Protocols/TextTrackCue.html#/s:13THEOplayerSDK12TextTrackCueP7contentypSgvp) property. +In the callback of your `ADD_TRACK` event, you want to track the [`ADD_CUE`](pathname:///theoplayer/v11/api-reference/ios/Structs/TextTrackEventTypes.html#/s:13THEOplayerSDK19TextTrackEventTypesV7ADD_CUEAA0E4TypeCyAA06AddCueE0CGvpZ) event through the [`TextTrack`](pathname:///theoplayer/v11/api-reference/ios/Protocols/TextTrack.html) interface. Then, in the callback of your `ADD_CUE` event, you want to track the [`ENTER`](pathname:///theoplayer/v11/api-reference/ios/Structs/TextTrackCueEventTypes.html#/s:13THEOplayerSDK22TextTrackCueEventTypesV5ENTERAA0F4TypeCyAA0e5EnterF0CGvpZ) and [`EXIT`](pathname:///theoplayer/v11/api-reference/ios/Structs/TextTrackCueEventTypes.html#/s:13THEOplayerSDK22TextTrackCueEventTypesV4EXITAA0F4TypeCyAA0e4ExitF0CGvpZ) events through the [`TextTrackCue`](pathname:///theoplayer/v11/api-reference/ios/Protocols/TextTrackCue.html) interface. The `ENTER` event is dispatched when a cue becomes active and the `EXIT` event is dispatched when a cue becomes inactive. +You can fetch the actual content in the callback of your `ENTER` event through its [`content`](pathname:///theoplayer/v11/api-reference/ios/Protocols/TextTrackCue.html#/s:13THEOplayerSDK12TextTrackCueP7contentypSgvp) property. -Alternatively, in the callback of your `ADD_TRACK` event, you could track the [`CUE_CHANGE`](pathname:///theoplayer/v10/api-reference/ios/Structs/TextTrackEventTypes.html#/s:13THEOplayerSDK19TextTrackEventTypesV10CUE_CHANGEAA0E4TypeCyAA09CueChangeE0CGvpZ) event through the `TextTrack` interface. Then, in the callback of your `CUE_CHANGE` event, you want to iterate over the active cues. For each active cue, you could also query its `content` property. +Alternatively, in the callback of your `ADD_TRACK` event, you could track the [`CUE_CHANGE`](pathname:///theoplayer/v11/api-reference/ios/Structs/TextTrackEventTypes.html#/s:13THEOplayerSDK19TextTrackEventTypesV10CUE_CHANGEAA0E4TypeCyAA09CueChangeE0CGvpZ) event through the `TextTrack` interface. Then, in the callback of your `CUE_CHANGE` event, you want to iterate over the active cues. For each active cue, you could also query its `content` property. The code below allows you to detect the active text track cues. @@ -154,6 +154,6 @@ The implementation for timed metadata is identical to the one for subtitles and 2. You might need to set the `mode` of the relevant text track to `hidden`, as documented in ["How to programmatically enable or disable text tracks"](03-how-to-programmatically-disable-text-tracks.md). Some types of timed metadata, for example EXT-X-DATERANGE and EventStream, are `disabled` by default. You should add a condition to your `addtrack` callback to decide whether you want to set your track to `hidden`. -3. You should set `hlsDateRange` to `true` if you want to detect EXT-X-DATERANGE tags in an HLS stream in your PlayerConfiguration or stream configuration. Refer to the [Web](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerConfiguration.html#hlsDateRange), [Android]() or [iOS](pathname:///theoplayer/v10/api-reference/ios/Classes/THEOplayerConfiguration.html) documentation for more info. +3. You should set `hlsDateRange` to `true` if you want to detect EXT-X-DATERANGE tags in an HLS stream in your PlayerConfiguration or stream configuration. Refer to the [Web](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerConfiguration.html#hlsDateRange), [Android]() or [iOS](pathname:///theoplayer/v11/api-reference/ios/Classes/THEOplayerConfiguration.html) documentation for more info. The article on ["how to track id3 cues / tags"](06-how-to-track-id3-cues-tags.md) might be useful to learn more about detecting ID3 tags specifically. diff --git a/theoplayer/how-to-guides/11-ui/05-is-it-possible-to-hide-googla-ima.md b/theoplayer/how-to-guides/11-ui/05-is-it-possible-to-hide-googla-ima.md index 478fffb6cb85..1bdac90d6b39 100644 --- a/theoplayer/how-to-guides/11-ui/05-is-it-possible-to-hide-googla-ima.md +++ b/theoplayer/how-to-guides/11-ui/05-is-it-possible-to-hide-googla-ima.md @@ -2,7 +2,7 @@ You may ask this question if you are trying to determine what controls are visible to the user during ands and want therefore to use your own UI elements. -Unfortunately Google IMA provides very limited control over the UI. The only thing that is possible to change/hide from THEOplayer is the countdown: to do so, you can configure as `*showCountdown: false*` in the AdsConfiguration ([related documentation](pathname:///theoplayer/v10/api-reference/web/classes/Player.html)). +Unfortunately Google IMA provides very limited control over the UI. The only thing that is possible to change/hide from THEOplayer is the countdown: to do so, you can configure as `*showCountdown: false*` in the AdsConfiguration ([related documentation](pathname:///theoplayer/v11/api-reference/web/classes/Player.html)). Using other methods, like CSS or JavaScript, to modify the Google IMA UI elements styles will also not work due to: diff --git a/theoplayer/how-to-guides/11-ui/06-how-to-build-chromeless-ui.mdx b/theoplayer/how-to-guides/11-ui/06-how-to-build-chromeless-ui.mdx index acec1d487fd5..67f51fe3425d 100644 --- a/theoplayer/how-to-guides/11-ui/06-how-to-build-chromeless-ui.mdx +++ b/theoplayer/how-to-guides/11-ui/06-how-to-build-chromeless-ui.mdx @@ -30,7 +30,7 @@ This `player` variable is a "Chromeless" instance created through the THEOplayer #### Web SDK -The API reference on creating a Chromeless player instance for the THEOplayer Web SDK is located at [ChromelessPlayer](pathname:///theoplayer/v10/api-reference/web/classes/ChromelessPlayer.html#constructor). +The API reference on creating a Chromeless player instance for the THEOplayer Web SDK is located at [ChromelessPlayer](pathname:///theoplayer/v11/api-reference/web/classes/ChromelessPlayer.html#constructor). When you're implementing a Chromeless UI, you don't need to include the THEOplayer CSS library (i.e. `ui.css`) mentioned in our [getting started guide](../../getting-started/01-sdks/01-web/00-getting-started.mdx), nor do you need to specify some default CSS classed. @@ -91,9 +91,9 @@ Of course, you would still need to apply CSS to style your `theoplayer-container ##### Legacy Android SDK (4.12.x) -The API reference on creating a Chromeless player instance for the THEOplayer Android SDK is located at [THEOplayerView](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/THEOplayerView.html). +The API reference on creating a Chromeless player instance for the THEOplayer Android SDK is located at [THEOplayerView](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/THEOplayerView.html). -When creating an instance, you need to provide a [`THEOplayerConfig`](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/THEOplayerConfig.html), +When creating an instance, you need to provide a [`THEOplayerConfig`](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/THEOplayerConfig.html), and set `chromeless` to `true`. The snippet below demonstrates how to create a Chromeless instance. ```java @@ -110,9 +110,9 @@ then you can specify `app:chromeless="true"` as implemented at [https://github.c #### iOS/tvOS SDK and Legacy iOS/tvOS SDK (4.12.x) -The API reference on creating a Chromeless player instance for the THEOplayer iOS SDK is located at [THEOplayer](pathname:///theoplayer/v10/api-reference/ios/Classes/THEOplayer.html). +The API reference on creating a Chromeless player instance for the THEOplayer iOS SDK is located at [THEOplayer](pathname:///theoplayer/v11/api-reference/ios/Classes/THEOplayer.html). -When creating an instance, you need to [`THEOplayerConfig`](pathname:///theoplayer/v10/api-reference/ios/Classes/THEOplayerConfiguration.html), +When creating an instance, you need to [`THEOplayerConfig`](pathname:///theoplayer/v11/api-reference/ios/Classes/THEOplayerConfiguration.html), and set `chromeless` to `true`. The snippet below demonstrates how to create a Chromeless instance. ```swift @@ -189,25 +189,25 @@ a basic overview of many of the relevant interfaces and events. You should show your play button when you are in a paused state, as described in ["how to track player states"](../../how-to-guides/09-player/04-how-to-track-player-states.md). If a viewer clicks your play button, you should call the `play()` on your `player` instance as documented across our -[Web](pathname:///theoplayer/v10/api-reference/web/classes/ChromelessPlayer.html#play), [Android](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/player/Player.html#play--) and [iOS]() documentation. +[Web](pathname:///theoplayer/v11/api-reference/web/classes/ChromelessPlayer.html#play), [Android](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/player/Player.html#play--) and [iOS]() documentation. ### Pause button You should show your pause button when you are in a playing state, as described in ["how to track player states"](../../how-to-guides/09-player/04-how-to-track-player-states.md). If a viewer clicks your pause button, you should call the `pause()` on your `player` instance as documented across our -[Web](pathname:///theoplayer/v10/api-reference/web/classes/ChromelessPlayer.html#pause), [Android](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/player/Player.html#pause--) and [iOS]() documentation. +[Web](pathname:///theoplayer/v11/api-reference/web/classes/ChromelessPlayer.html#pause), [Android](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/player/Player.html#pause--) and [iOS]() documentation. ### Volume mute button You can check whether your volume is muted through the `muted` property (or method) on your `player` instance as documented across -our [Web](pathname:///theoplayer/v10/api-reference/web/classes/ChromelessPlayer.html#muted), Android ([isMuted()](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/player/Player.html#isMuted--) and [setMuted()](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/player/Player.html#setMuted-boolean-)) and [iOS](pathname:///theoplayer/v10/api-reference/ios/Classes/THEOplayer.html#/s:13THEOplayerSDK0A0C5mutedSbvp) documentation. +our [Web](pathname:///theoplayer/v11/api-reference/web/classes/ChromelessPlayer.html#muted), Android ([isMuted()](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/player/Player.html#isMuted--) and [setMuted()](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/player/Player.html#setMuted-boolean-)) and [iOS](pathname:///theoplayer/v11/api-reference/ios/Classes/THEOplayer.html#/s:13THEOplayerSDK0A0C5mutedSbvp) documentation. You should consider showing a different button depending on whether `muted` returns `true` or `false`. If a viewer clicks your mute button, you should set `muted` to `!muted`. ### Volume change button You can get and set your volume level through the `volume` property (or method) on your `player` instance as documented across -our [Web](pathname:///theoplayer/v10/api-reference/web/classes/ChromelessPlayer.html#volume), Android ([getVolume()](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/player/Player.html#getVolume--) and [setVolume()](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/player/Player.html#setVolume-double-)) and [iOS](pathname:///theoplayer/v10/api-reference/ios/Classes/THEOplayer.html#/s:13THEOplayerSDK0A0C6volumeSfvp) documentation. +our [Web](pathname:///theoplayer/v11/api-reference/web/classes/ChromelessPlayer.html#volume), Android ([getVolume()](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/player/Player.html#getVolume--) and [setVolume()](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/player/Player.html#setVolume-double-)) and [iOS](pathname:///theoplayer/v11/api-reference/ios/Classes/THEOplayer.html#/s:13THEOplayerSDK0A0C6volumeSfvp) documentation. You should consider showing a different button depending on the volume level. Note that you cannot control the volume level on iOS- and Android-based SDKs as this is delegated to the hardware buttons. @@ -216,8 +216,8 @@ You can only toggle the muted state on these SDKs. ### Current time text You can get the current time through the `currentTime` property (or method) on your `player` instance as documented across -our [Web](pathname:///theoplayer/v10/api-reference/web/classes/ChromelessPlayer.html#currentTime), Android ([requestCurrentTime()](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/player/Player.html#requestCurrentTime-com.theoplayer.android.api.player.RequestCallback-) and [setCurrentTime()](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/player/Player.html#setCurrentTime-double-)) -and iOS ([requestCurrentTime()](pathname:///theoplayer/v10/api-reference/ios/Classes/THEOplayer.html#/s:13THEOplayerSDK0A0C18requestCurrentTime17completionHandleryySdSg_s5Error_pSgtc_tF) and [setCurrentTime()](pathname:///theoplayer/v10/api-reference/ios/Classes/THEOplayer.html#/s:13THEOplayerSDK0A0C14setCurrentTime_17completionHandlerySd_yypSg_s5Error_pSgtcSgtF)) documentation. +our [Web](pathname:///theoplayer/v11/api-reference/web/classes/ChromelessPlayer.html#currentTime), Android ([requestCurrentTime()](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/player/Player.html#requestCurrentTime-com.theoplayer.android.api.player.RequestCallback-) and [setCurrentTime()](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/player/Player.html#setCurrentTime-double-)) +and iOS ([requestCurrentTime()](pathname:///theoplayer/v11/api-reference/ios/Classes/THEOplayer.html#/s:13THEOplayerSDK0A0C18requestCurrentTime17completionHandleryySdSg_s5Error_pSgtc_tF) and [setCurrentTime()](pathname:///theoplayer/v11/api-reference/ios/Classes/THEOplayer.html#/s:13THEOplayerSDK0A0C14setCurrentTime_17completionHandlerySd_yypSg_s5Error_pSgtcSgtF)) documentation. Note that `currentTime` returns a relative value in seconds. If you are dealing with live streams, you might want to use `currentProgramDateTime` instead, as this returns an absolute value like `"2022-04-01T13:37:42.666Z"`. @@ -226,7 +226,7 @@ This property (or method) is especially useful when implementing an [EPG](https: ### Duration text You can get the duration of a stream through the `duration` property (or method) on your `player` instance as documented across our -[Web](pathname:///theoplayer/v10/api-reference/web/classes/ChromelessPlayer.html#duration), [Android](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/player/Player.html#getDuration--) and [iOS](pathname:///theoplayer/v10/api-reference/ios/Classes/THEOplayer.html#/s:13THEOplayerSDK0A0C8durationSdSgvp) documentation. +[Web](pathname:///theoplayer/v11/api-reference/web/classes/ChromelessPlayer.html#duration), [Android](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/player/Player.html#getDuration--) and [iOS](pathname:///theoplayer/v11/api-reference/ios/Classes/THEOplayer.html#/s:13THEOplayerSDK0A0C8durationSdSgvp) documentation. The `duration` will return the duration in seconds for VOD streams, and `Infinity` for live streams. @@ -239,18 +239,18 @@ you can seek to a different playhead position through the `currentTime` property Alternatively, for live streams, you may also use `currentProgramDateTime` to seek to absolute playhead positions. You can only seek to a playhead position that is within any of the time ranges of your `seekable` property (or method) of your `player` instance as documented across our -[Web](pathname:///theoplayer/v10/api-reference/web/classes/ChromelessPlayer.html#seekable), -[Android](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/player/Player.html#requestSeekable-com.theoplayer.android.api.player.RequestCallback-) and -[iOS](pathname:///theoplayer/v10/api-reference/ios/Classes/THEOplayer.html#/s:13THEOplayerSDK0A0C15requestSeekable17completionHandleryySayAA9TimeRangeCGSg_s5Error_pSgtc_tF) documentation. +[Web](pathname:///theoplayer/v11/api-reference/web/classes/ChromelessPlayer.html#seekable), +[Android](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/player/Player.html#requestSeekable-com.theoplayer.android.api.player.RequestCallback-) and +[iOS](pathname:///theoplayer/v11/api-reference/ios/Classes/THEOplayer.html#/s:13THEOplayerSDK0A0C15requestSeekable17completionHandleryySayAA9TimeRangeCGSg_s5Error_pSgtc_tF) documentation. For example, on the Web SDK, this means that you'll stay between `player.seekable.start(0)` and `player.seekable.end(player.seekable.length-1)`. You subscribe to the `timeupdate` event to periodically update your scrub bar bullet. This event is dispatched every ~200ms during playback. -Refer to our [Web](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#timeupdate), [Android](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/event/player/PlayerEventTypes.html#TIMEUPDATE) and [iOS](pathname:///theoplayer/v10/api-reference/ios/Structs/PlayerEventTypes.html#/s:13THEOplayerSDK16PlayerEventTypesV11TIME_UPDATEAA0D4TypeCyAA010TimeUpdateD0CGvpZ) documentation for more info on this event. +Refer to our [Web](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#timeupdate), [Android](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/event/player/PlayerEventTypes.html#TIMEUPDATE) and [iOS](pathname:///theoplayer/v11/api-reference/ios/Structs/PlayerEventTypes.html#/s:13THEOplayerSDK16PlayerEventTypesV11TIME_UPDATEAA0D4TypeCyAA010TimeUpdateD0CGvpZ) documentation for more info on this event. A `seek` event is dispatched when you set a new value for `currentTime` or `currentProgramDateTime`. A `seeked` event is dispatched when the seek was successful. -Refer to our [Web](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#seeking), [Android](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/event/player/PlayerEventTypes.html#SEEKING) and [iOS](pathname:///theoplayer/v10/api-reference/ios/Structs/PlayerEventTypes.html#/s:13THEOplayerSDK16PlayerEventTypesV7SEEKINGAA0D4TypeCyAA07SeekingD0CGvpZ) documentation for more info on these events. +Refer to our [Web](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#seeking), [Android](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/event/player/PlayerEventTypes.html#SEEKING) and [iOS](pathname:///theoplayer/v11/api-reference/ios/Structs/PlayerEventTypes.html#/s:13THEOplayerSDK16PlayerEventTypesV7SEEKINGAA0D4TypeCyAA07SeekingD0CGvpZ) documentation for more info on these events. You should consider displaying a "stalling icon" between these two events. #### Buffered blocks @@ -259,11 +259,11 @@ You may also want to annotate parts of the scrub bar that have already been buff When the viewer seeks to a buffered block playback immediately starts. You can track information on what's being buffered through the `progress` event. -Refer to our [Web](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#progress), [Android](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/event/player/PlayerEventTypes.html#PROGRESS) and [iOS](pathname:///theoplayer/v10/api-reference/ios/Structs/PlayerEventTypes.html#/s:13THEOplayerSDK16PlayerEventTypesV8PROGRESSAA0D4TypeCyAA08ProgressD0CGvpZ) documentation for more info on this event. +Refer to our [Web](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#progress), [Android](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/event/player/PlayerEventTypes.html#PROGRESS) and [iOS](pathname:///theoplayer/v11/api-reference/ios/Structs/PlayerEventTypes.html#/s:13THEOplayerSDK16PlayerEventTypesV8PROGRESSAA0D4TypeCyAA08ProgressD0CGvpZ) documentation for more info on this event. In the callback of the `progress` event, you will want to query the `buffered` property (or method) to iterate through the available buffered time ranges. -The `buffered` property (or method) is described in our [Web](pathname:///theoplayer/v10/api-reference/web/classes/ChromelessPlayer.html#buffered), -[Android](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/player/Player.html#requestBuffered-com.theoplayer.android.api.player.RequestCallback-) and [iOS](pathname:///theoplayer/v10/api-reference/ios/Classes/THEOplayer.html#/s:13THEOplayerSDK0A0C15requestBuffered17completionHandleryySayAA9TimeRangeCGSg_s5Error_pSgtc_tF) documentation. +The `buffered` property (or method) is described in our [Web](pathname:///theoplayer/v11/api-reference/web/classes/ChromelessPlayer.html#buffered), +[Android](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/player/Player.html#requestBuffered-com.theoplayer.android.api.player.RequestCallback-) and [iOS](pathname:///theoplayer/v11/api-reference/ios/Classes/THEOplayer.html#/s:13THEOplayerSDK0A0C15requestBuffered17completionHandleryySayAA9TimeRangeCGSg_s5Error_pSgtc_tF) documentation. ### Live button @@ -311,7 +311,7 @@ Getting your video player in and out fullscreen requires some getting used to, a #### Web SDK -You cannot use our [`Presentation API`](pathname:///theoplayer/v10/api-reference/web/interfaces/Presentation.html) to switch between fullscreen, inline and picture-in-picture. +You cannot use our [`Presentation API`](pathname:///theoplayer/v11/api-reference/web/interfaces/Presentation.html) to switch between fullscreen, inline and picture-in-picture. Instead, you need to implement your own fullscreen handling. One approach to achieve this is by using the `Fullscreen API` as described at [https://developer.mozilla.org/en-US/docs/Web/API/Fullscreen_API](https://developer.mozilla.org/en-US/docs/Web/API/Fullscreen_API). @@ -320,7 +320,7 @@ or resize your video player container to a 100% width and height. #### Android SDK -You cannot use our ['FullscreenManager API`](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/fullscreen/FullScreenManager.html) to switch between +You cannot use our ['FullscreenManager API`](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/fullscreen/FullScreenManager.html) to switch between fullscreen and inline. Instead, you need to implement your own fullscreen handling, as well as any associated orientation changes. @@ -328,7 +328,7 @@ Refer to [https://developer.android.com/training/system-ui/immersive](https://de #### iOS/tvOS SDK and Legacy iOS/tvOS SDK (4.12.x) -You may use the [`presentationMode`](pathname:///theoplayer/v10/api-reference/ios/Classes/THEOplayer.html#/s:13THEOplayerSDK0A0C16presentationModeAA012PresentationD0Ovp) property of the `player` instance, as demonstrated in the snippet below. +You may use the [`presentationMode`](pathname:///theoplayer/v11/api-reference/ios/Classes/THEOplayer.html#/s:13THEOplayerSDK0A0C16presentationModeAA012PresentationD0Ovp) property of the `player` instance, as demonstrated in the snippet below. ```swift if (player.presentationMode == PresentationMode.fullscreen) { @@ -338,7 +338,7 @@ if (player.presentationMode == PresentationMode.fullscreen) { } ``` -You may also use [`fullscreenOrientationCoupling`](pathname:///theoplayer/v10/api-reference/ios/Classes/THEOplayer.html#/s:13THEOplayerSDK0A0C29fullscreenOrientationCouplingSbvp) +You may also use [`fullscreenOrientationCoupling`](pathname:///theoplayer/v11/api-reference/ios/Classes/THEOplayer.html#/s:13THEOplayerSDK0A0C29fullscreenOrientationCouplingSbvp) to automatically enter fullscreen when the viewer goes into landscape mode. Forcing the video player to rotate into landscape when you hit the fullscreen button in portrait mode is something diff --git a/theoplayer/how-to-guides/11-ui/08-how-to-change-default-UI-language-to-other.md b/theoplayer/how-to-guides/11-ui/08-how-to-change-default-UI-language-to-other.md index 24b30a48ffd3..52f53c0e876c 100644 --- a/theoplayer/how-to-guides/11-ui/08-how-to-change-default-UI-language-to-other.md +++ b/theoplayer/how-to-guides/11-ui/08-how-to-change-default-UI-language-to-other.md @@ -77,7 +77,7 @@ Chinese: [http://cdn.theoplayer.com/demos/theoplayer/lang/zh-CN.js](http://cdn.t ##### Web SDK -Each language should be described as a [UIConfiguration](pathname:///theoplayer/v10/api-reference/web/interfaces/UIConfiguration.html) +Each language should be described as a [UIConfiguration](pathname:///theoplayer/v11/api-reference/web/interfaces/UIConfiguration.html) ```js player = new THEOplayer.Player(playerElement, { diff --git a/theoplayer/how-to-guides/11-ui/09-customize-ui-during-playback.md b/theoplayer/how-to-guides/11-ui/09-customize-ui-during-playback.md index b6386618a31e..b34938c7a024 100644 --- a/theoplayer/how-to-guides/11-ui/09-customize-ui-during-playback.md +++ b/theoplayer/how-to-guides/11-ui/09-customize-ui-during-playback.md @@ -40,7 +40,7 @@ The Web SDK code should be included in your iOS project. The article at [How to ### Events -The [Ads API](pathname:///theoplayer/v10/api-reference/web/interfaces/Ads.html) exposes, among others, the following events: +The [Ads API](pathname:///theoplayer/v11/api-reference/web/interfaces/Ads.html) exposes, among others, the following events: - `adbegin`: dispatched when an ad starts - `adend`: dispatched when an ad ends diff --git a/theoplayer/how-to-guides/11-ui/10-how-to-change-how-a-video-should-fit-inside-a-container.md b/theoplayer/how-to-guides/11-ui/10-how-to-change-how-a-video-should-fit-inside-a-container.md index e333dc05dc30..18f826e9f94b 100644 --- a/theoplayer/how-to-guides/11-ui/10-how-to-change-how-a-video-should-fit-inside-a-container.md +++ b/theoplayer/how-to-guides/11-ui/10-how-to-change-how-a-video-should-fit-inside-a-container.md @@ -52,7 +52,7 @@ for (let i = 0; i < videos.length; i++) { ##### Legacy Android SDK (4.12.x) -For SDK version **3.6.1** and above, you can use the API described at [Player#setAspectRatio(AspectRatio)]() to set the [AspectRatio](pathname:///theoplayer/v10/api-reference/android/com/theoplayer/android/api/player/AspectRatio.html) values. +For SDK version **3.6.1** and above, you can use the API described at [Player#setAspectRatio(AspectRatio)]() to set the [AspectRatio](pathname:///theoplayer/v11/api-reference/android/com/theoplayer/android/api/player/AspectRatio.html) values. The snippet below demonstrates how you could use this API: @@ -67,7 +67,7 @@ The sample project at [How to insert a button](../../how-to-guides/11-ui/07-how- ### iOS (tvOS) SDK -You can use the API described at [THEOplayerFullscreen]() to set the [video gravity](https://developer.apple.com/documentation/avfoundation/avplayerlayer/1388915-videogravity) values. +You can use the API described at [THEOplayerFullscreen]() to set the [video gravity](https://developer.apple.com/documentation/avfoundation/avplayerlayer/1388915-videogravity) values. The snippet below demonstrates how you could use this API: diff --git a/theoplayer/how-to-guides/11-ui/15-how-to-disable-click-to-pause.md b/theoplayer/how-to-guides/11-ui/15-how-to-disable-click-to-pause.md index 289ba3b4a9ab..e4bb3417b67b 100644 --- a/theoplayer/how-to-guides/11-ui/15-how-to-disable-click-to-pause.md +++ b/theoplayer/how-to-guides/11-ui/15-how-to-disable-click-to-pause.md @@ -26,7 +26,7 @@ The following CSS snippet disables pause to click by no longer catching the poin } ``` -The following JavaScript snippet automatically resumes a video when someone tries to pause it by leveraging the [`pause`](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerEventMap.html#pause) event and the [`play()`](pathname:///theoplayer/v10/api-reference/web/classes/ChromelessPlayer.html#play) method. +The following JavaScript snippet automatically resumes a video when someone tries to pause it by leveraging the [`pause`](pathname:///theoplayer/v11/api-reference/web/interfaces/PlayerEventMap.html#pause) event and the [`play()`](pathname:///theoplayer/v11/api-reference/web/classes/ChromelessPlayer.html#play) method. ```javascript player.addEventListener('pause', () => { diff --git a/theoplayer/how-to-guides/android/media3/getting-started.mdx b/theoplayer/how-to-guides/android/media3/getting-started.mdx index 25ac0dc4467f..3ba114bc241a 100644 --- a/theoplayer/how-to-guides/android/media3/getting-started.mdx +++ b/theoplayer/how-to-guides/android/media3/getting-started.mdx @@ -15,7 +15,7 @@ In THEOplayer version 9.x, the Media3 and legacy pipelines were available side-b Starting with version 10.0, the THEOplayer Android SDK has fully switched over to the Media3 pipeline, and the legacy pipeline has been retired. -See [our migration guide](../../../getting-started/01-sdks/02-android/03-migrating-to-theoplayer-10.md) +See [our migration guide](../../../../theoplayer_versioned_docs/version-v10/getting-started/01-sdks/02-android/03-migrating-to-theoplayer-10.md) for more information. ::: diff --git a/theoplayer/how-to-guides/web/content-steering/00-mpeg-dash-content-steering.md b/theoplayer/how-to-guides/web/content-steering/00-mpeg-dash-content-steering.md index ae57c04fbaeb..679a558f0d25 100644 --- a/theoplayer/how-to-guides/web/content-steering/00-mpeg-dash-content-steering.md +++ b/theoplayer/how-to-guides/web/content-steering/00-mpeg-dash-content-steering.md @@ -32,7 +32,7 @@ player.source = { ## Events for Content Steering THEOplayer provides events to monitor the Content Steering process. For more details, check the -[API documentation](pathname:///theoplayer/v10/api-reference/web/#ContentSteeringStartEvent). +[API documentation](pathname:///theoplayer/v11/api-reference/web/#ContentSteeringStartEvent). ```javascript player.addEventListener('contentsteeringstart', console.log); diff --git a/theoplayer/how-to-guides/web/uplynk/01-preplay.md b/theoplayer/how-to-guides/web/uplynk/01-preplay.md index 1ad8c2efccd9..9b588ae65a5c 100644 --- a/theoplayer/how-to-guides/web/uplynk/01-preplay.md +++ b/theoplayer/how-to-guides/web/uplynk/01-preplay.md @@ -56,7 +56,7 @@ player.source = { }; ``` -The snippet above gives a quick overview of the structure of an Uplynk-specific source, also known as an [UplynkSource](pathname:///theoplayer/v10/api-reference/web/interfaces/UplynkSource.html). More information on certain properties: +The snippet above gives a quick overview of the structure of an Uplynk-specific source, also known as an [UplynkSource](pathname:///theoplayer/v11/api-reference/web/interfaces/UplynkSource.html). More information on certain properties: - `id`: The ID field identifies the asset. Instead of a single string, developers can also specify an array of asset IDs as strings, which will be stitched into a continuous stream. The same goes for the `externalId` property in case an external ID is used in the source. - `preplayParameters`: The `preplayParameters` object should have string-key-string-value combinations, which will be used as query parameters for the Preplay API call. Nested objects are not supported. @@ -69,7 +69,7 @@ The snippet above gives a quick overview of the structure of an Uplynk-specific ## Stream Configuration (with ads) -The examples below demonstrate how to configure a stream with server-side ads through an [UplynkSource](pathname:///theoplayer/v10/api-reference/web/interfaces/UplynkSource.html). +The examples below demonstrate how to configure a stream with server-side ads through an [UplynkSource](pathname:///theoplayer/v11/api-reference/web/interfaces/UplynkSource.html). ```js player.source = { @@ -121,7 +121,7 @@ A token is (typically) generated on back-end using an API key and a set of param > Note the confusion that the provided link only mentions signing the **playback URL**, even though we are describing using > tokens for the call to the Preplay API. However, this process is also valid for signing the `preplayParameters`. -This set of parameters should also be passed along to the `preplayParameters` in an [UplynkSource](pathname:///theoplayer/v10/api-reference/web/interfaces/UplynkSource.html). +This set of parameters should also be passed along to the `preplayParameters` in an [UplynkSource](pathname:///theoplayer/v11/api-reference/web/interfaces/UplynkSource.html). If you do not configure the `preplayParameters` correctly in relation to your signature parameters, then the Preplay request made by THEOplayer will most likely return an invalid Preplay response, preventing THEOplayer from setting up your stream. Let's consider a set-up where an Uplynk customer uses both URL signatures and multi-DRM. diff --git a/theoplayer/how-to-guides/web/uplynk/04-configuration.md b/theoplayer/how-to-guides/web/uplynk/04-configuration.md index 691593bf62ab..e42b23c7603b 100644 --- a/theoplayer/how-to-guides/web/uplynk/04-configuration.md +++ b/theoplayer/how-to-guides/web/uplynk/04-configuration.md @@ -39,7 +39,7 @@ const player = new THEOplayer.Player(element, { }); ``` -Refer to the [UplynkConfiguration API reference](pathname:///theoplayer/v10/api-reference/web/interfaces/UplynkConfiguration.html) for more information. +Refer to the [UplynkConfiguration API reference](pathname:///theoplayer/v11/api-reference/web/interfaces/UplynkConfiguration.html) for more information. # Related articles diff --git a/theoplayer/how-to-guides/web/uplynk/05-interface.md b/theoplayer/how-to-guides/web/uplynk/05-interface.md index e525ec9ed2c1..500ef9372d6a 100644 --- a/theoplayer/how-to-guides/web/uplynk/05-interface.md +++ b/theoplayer/how-to-guides/web/uplynk/05-interface.md @@ -68,7 +68,7 @@ const player = new THEOplayer.Player(element, {...}); }); ``` -Refer to the [Uplynk API reference](pathname:///theoplayer/v10/api-reference/web/interfaces/Uplynk.html) for more information. Additionally, reviewing [the player configuration in the demo app](https://github.com/THEOplayer/samples-html5-sdk/blob/master/reference-apps/verizon-media-app/src/player.js) helps to understand the `Uplynk` interface. +Refer to the [Uplynk API reference](pathname:///theoplayer/v11/api-reference/web/interfaces/Uplynk.html) for more information. Additionally, reviewing [the player configuration in the demo app](https://github.com/THEOplayer/samples-html5-sdk/blob/master/reference-apps/verizon-media-app/src/player.js) helps to understand the `Uplynk` interface. ## Related articles diff --git a/theoplayer/knowledge-base/01-advertisement/01-user-guide.md b/theoplayer/knowledge-base/01-advertisement/01-user-guide.md index b0dbfa261425..f0f8b6dd76c0 100644 --- a/theoplayer/knowledge-base/01-advertisement/01-user-guide.md +++ b/theoplayer/knowledge-base/01-advertisement/01-user-guide.md @@ -97,7 +97,7 @@ THEOplayer provides several integrations to achieve CSAI, including its own inte The THEOplayer ad system is selected with the value 'theo'. As this ad system is the default one, you do not have to indicate this preference, and you can omit the integration property altogether. More information can be found at: -- [Ads Reference API](pathname:///theoplayer/v10/api-reference/web/interfaces/Ad.html) +- [Ads Reference API](pathname:///theoplayer/v11/api-reference/web/interfaces/Ad.html) - [How to set up VAST and VMAP ads](../../how-to-guides/01-ads/03-how-to-set-up-vast-and-vmap.md): this how-to guide contains information regarding this integration, including how to use this integration, requirements (if any) and code samples. @@ -105,21 +105,21 @@ The THEOplayer ad system is selected with the value 'theo'. As this ad system is Set the `integration` property to `'google-ima'` to use the Google IMA integration. More information can be found at: -- [Reference API](pathname:///theoplayer/v10/api-reference/web/interfaces/IMAAdDescription.html) +- [Reference API](pathname:///theoplayer/v11/api-reference/web/interfaces/IMAAdDescription.html) - [Google IMA](../../how-to-guides/01-ads/10-google-ima.md): this how-to guide contains information regarding this integration, including how to use this integration, requirements (if any) and code samples. #### SpotX Set the `integration property` to `'spotx'` to configure SpotX ads. More information can be found at: -- [Reference API](pathname:///theoplayer/v10/api-reference/web/interfaces/SpotXAdDescription.html) +- [Reference API](pathname:///theoplayer/v11/api-reference/web/interfaces/SpotXAdDescription.html) - [SpotX](../../how-to-guides/01-ads/07-spotx.md): this how-to guide contains more information regarding this integration, including how to use this integration, requirements (if any) and code samples. #### FreeWheel Set the `integration` property to `'freewheel'` to configure FreeWheel ads. Please note that, in this case, the adSource properties are different from those for other ad integrations (e.g.: theo integration). More information can be found at: -- [Reference API](pathname:///theoplayer/v10/api-reference/web/interfaces/FreeWheelAdDescription.html) +- [Reference API](pathname:///theoplayer/v11/api-reference/web/interfaces/FreeWheelAdDescription.html) - [FreeWheel](../../how-to-guides/01-ads/06-freewheel.md): this how-to guide contains more information regarding this integration, including how to use this integration, requirements (if any) and code samples. ### Server Side Ad Insertion (SSAI) @@ -132,13 +132,13 @@ THEOplayer pre-integrates with first-class Server-Side Ad Insertion(SSAI) provid To use the Google DAI integration you have to set the `integration` key to `'google-dai'`. -- [Reference API](pathname:///theoplayer/v10/api-reference/web/interfaces/GoogleDAIConfiguration.html) +- [Reference API](pathname:///theoplayer/v11/api-reference/web/interfaces/GoogleDAIConfiguration.html) #### Yospace To use the Yospace integration you have to set the `integration` key to `'yospace'`. -- [Reference API](pathname:///theoplayer/v10/api-reference/web/interfaces/Yospace.html) +- [Reference API](pathname:///theoplayer/v11/api-reference/web/interfaces/Yospace.html) - [Yospace](../../how-to-guides/01-ads/04-yospace.md): this how-to guide contains more information regarding this integration, including how to use this integration, requirements (if any) and code samples. #### Verizon Media @@ -214,7 +214,7 @@ Our player provides VPAID 2.0 support via our Google IMA integration. This versi In [Basic Ad Configuration](#basic-ad-config), we learned how to statically add ads to THEOplayer on startup by specifying them in the configuration object. However, several interesting use cases exist that require on the fly ad injection, for example when VAST files should be added by a script provided by an external ad server. -To dynamically add advertisements, you should use the [`player.ads.schedule(AdDescription)`](pathname:///theoplayer/v10/api-reference/web/interfaces/Ads.html#schedule) function which will add the given ad file as if it were specified in the initial configuration. The AdDescription - which you will pass as a parameter to the function - is the same object as previously discussed in [Basic Ad Configuration](#basic-ad-config). +To dynamically add advertisements, you should use the [`player.ads.schedule(AdDescription)`](pathname:///theoplayer/v11/api-reference/web/interfaces/Ads.html#schedule) function which will add the given ad file as if it were specified in the initial configuration. The AdDescription - which you will pass as a parameter to the function - is the same object as previously discussed in [Basic Ad Configuration](#basic-ad-config). NOTE: Please note that when adding a pre-roll when the original video is already playing (for example because of autoplay), the pre-roll cannot start playing. An advertisement with an offset of '0%' will always be able to play. diff --git a/theoplayer/knowledge-base/03-playback/06-video-clipping.md b/theoplayer/knowledge-base/03-playback/06-video-clipping.md index c21778018d20..257d90e37df9 100644 --- a/theoplayer/knowledge-base/03-playback/06-video-clipping.md +++ b/theoplayer/knowledge-base/03-playback/06-video-clipping.md @@ -4,7 +4,7 @@ THEOplayer supports playing only a selected part of a video-on-demand stream, ra ## API -The start and end of the clipping window can be controlled through the [Clip API](pathname:///theoplayer/v10/api-reference/web/interfaces/Clip.html): +The start and end of the clipping window can be controlled through the [Clip API](pathname:///theoplayer/v11/api-reference/web/interfaces/Clip.html): - `startTime` and `endTime`, expressed in seconds diff --git a/theoplayer/knowledge-base/06-metadata/00-introduction.md b/theoplayer/knowledge-base/06-metadata/00-introduction.md index a30e924ee55b..11f1e7def198 100644 --- a/theoplayer/knowledge-base/06-metadata/00-introduction.md +++ b/theoplayer/knowledge-base/06-metadata/00-introduction.md @@ -201,7 +201,7 @@ THEOplayer offers features which might implement your desired use-case out-of-th - THEOplayer - [How to track ID3 cues/tags?](../../how-to-guides/10-texttrack/06-how-to-track-id3-cues-tags.md) - - [TextTrack Types](pathname:///theoplayer/v10/api-reference/web/types/TextTrackType.html) + - [TextTrack Types](pathname:///theoplayer/v11/api-reference/web/types/TextTrackType.html) - [ID3 Audio Player Demo](https://demo.theoplayer.com/audio-id3-metadata) - External - [Requirements for Media Timed Events by the Media and Entertainment Interest Group](https://www.w3.org/TR/media-timed-events/) diff --git a/theoplayer/static/theoplayer/v11/examples/basic/demo.html b/theoplayer/static/theoplayer/v11/examples/basic/demo.html new file mode 100644 index 000000000000..5aff4d4f40b3 --- /dev/null +++ b/theoplayer/static/theoplayer/v11/examples/basic/demo.html @@ -0,0 +1,44 @@ + + + + + Basic player + + + + + +
+ + + diff --git a/theoplayer/version.txt b/theoplayer/version.txt index db24ab967fb5..275283a18f9b 100644 --- a/theoplayer/version.txt +++ b/theoplayer/version.txt @@ -1 +1 @@ -10.13.0 +11.0.0 diff --git a/theoplayer/web/hosted-player.md b/theoplayer/web/hosted-player.md index 90cbfd826fc8..f561a71142c5 100644 --- a/theoplayer/web/hosted-player.md +++ b/theoplayer/web/hosted-player.md @@ -66,7 +66,7 @@ The following parameters are only valid with Dolby OptiView real-time streaming ## Player Events -Basic [player events](pathname:///theoplayer/v10/api-reference/web/interfaces/AdBreakEvent.html) are sent with [window post messages](https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage) to the parent page in case the embedding application wishes to utilize them. Events include: +Basic [player events](pathname:///theoplayer/v11/api-reference/web/interfaces/AdBreakEvent.html) are sent with [window post messages](https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage) to the parent page in case the embedding application wishes to utilize them. Events include: - ended - pause diff --git a/theoplayer_versioned_docs/version-v10/android/index.mdx b/theoplayer_versioned_docs/version-v10/android/index.mdx new file mode 100644 index 000000000000..95ae3b74de51 --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/android/index.mdx @@ -0,0 +1,13 @@ +--- +displayed_sidebar: android +sidebar_label: Introduction +sidebar_position: 1 +--- + +# THEOplayer Android SDK + +import Intro from '../shared/_intro.mdx'; +import SidebarDocCardList from '@site/src/components/SidebarDocCardList'; + + + diff --git a/theoplayer_versioned_docs/version-v10/api-reference/roku.md b/theoplayer_versioned_docs/version-v10/api-reference/roku.md new file mode 100644 index 000000000000..5ede52e203b7 --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/api-reference/roku.md @@ -0,0 +1,383 @@ +--- +title: Roku API Reference +description: Discover all properties and functions of THEOplayer. +sidebar_label: API references +sidebar_custom_props: { icon: '*️⃣' } +--- + +# Player API + +The attributes, methods and events. + +## Enums + +| Name | Type | Description | +| ------------- | ----------------- | ----------------------------------------------------------------- | +| ErrorCategory | associative array | Provides a dictionary of Error category names and integer values. | +| ErrorCode | associative array | Provides a dictionary of Error code names and integer values. | +| Event | associative array | Provides a dictionary of Event type names and string values. | + +## Attributes + +| Name | Type | Default | Access Permission | Description | +| ---------------------------- | --------------------------- | ------- | ----------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| ads | Ads | Ads | read | Provides events, properties and methods relating to ad playback in the player. See below for more info. | +| audioTracks | array of associative arrays | [] | read | Provides information about audio tracks detected automatically in video. Each Associative array has the following fields: id - track identifier, label - track name, language - track language, enabled - true if track is current track | +| autoplay | boolean | false | read,write | Whether the player should play the video as soon as it is able after the source has been set. | +| controls | boolean | true | read,write | Allows to enable or disable player controls (`true` to show controls, `false` to hide controls). | +| currentTime | integer | | read,write | Current timestamp of video. | +| duration | integer | | read | Duration of video. | +| enableTrickPlay | boolean | true | read,write | Whether trick playback of the media is enabled, and whether the remote buttons will allow trickplay. NOTE: `controls` must be set to `true` for this to have any effect. | +| subtitleSelectionPreferences | associative array | | write | The significance and priority order of the attributes and values for the subtitle tracks available in the video stream. The selected subtitle track is reflected in the `textTracks` with `mode` as "showing" when visible in full screen or "hidden" when not in full screen. Refer to `subtitleSelectionPreferences` section of Roku's [video node](https://developer.roku.com/en-au/docs/references/scenegraph/media-playback-nodes/video.md) documentation. To select a subtitle track, based on user input, use the `mode` field of the `textTracks`. | +| ended | boolean | false | read | Whether playback of the media is ended. | +| errorObject | associative array | | read | The last error that occurred for the current source, if any. | +| loop | boolean | false | read,write | Whether playback of the media is looped. | +| muted | boolean | false | read,write | Set `true` to mute and `false` to un-mute the currently playing video | +| network | NetworkApi | | read | API node for network operations. | +| paused | boolean | true | read | Whether the player is paused. | +| poster | string | | read,write | The poster of the current source. | +| seeking | boolean | | read | `true` when player is seeking, `false` when player is not seeking now. | +| source | Source Description | | read,write | Describes source of current video. | +| src | string | | read | The current URL of the media resource. | +| theolive | THEOlive API | | read | API node for THEOlive operations. | +| textTracks | array of associative arrays | [] | read,write | Provides information about text and metadata tracks detected automatically in video. Each Associative array has the following fields: id - track identifier, label - track description, language - track language, mode - determines track state, available values: disabled, showing, hidden, activeCues: the current cue for this track | + +### Source Description + +The following key/value pairs are supported on the `source` attribute of the `THEOsdk:THEOplayer` : + +| Name | Type | Description | +| ------------------- | ------------------ | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| sources | roArray | An array of Typed Sources. When specifying multiple source descriptions, the sources attribute will be interpreted as a playlist where the first typed source will play first and subsequent sources will play when its preceding typed source has ended. | +| title | String | The title of the media resource. | +| poster | string | The URL of an image to optionally use as the poster for the media source. This is used for SDPosterUrl, HDPosterUrl, and FHDPosterUrl. | +| live | boolean | Whether the asset is live or not. | +| drmHttpAgentHeaders | roAssociativeArray | An optional key-value dictionary that contains additional HTTP headers that will be sent for DRM key/license requests. The keys represent the HTTP header names and the values represent their corresponding values. | +| ads | roArray | An optional array of AdDescriptions. | +| headers | roArray | An optional array of strings representing headers to include on the content requests. The strings follow the format of `"headerName:headerValue"`. Defaults to an empty array to clear any headers that were set on HttpAgent. | + +### Typed Source + +The following key/value pairs are supported on the `sources` attribute of a Source Description: + +| Name | Type | Description | +| ----------------- | ------------------------- | -------------------------------------------------------------------------------------------------------------------------------------- | +| src | String | The URL of the media resource. | +| type | String | The content type (MIME type) of the media resource. Possible values are `application/dash+xml`, `application/x-mpegURL` and `theolive` | +| description | String | The description of the media resource. | +| playStart | Number | The position in the stream the user starts playback at. Use negative numbers to offset from the live edge. | +| contentProtection | Content Protection | Parameters for DRM playback | +| SDBifUrl | String | "Base Index Frames" URL for SD trick mode. | +| HDBifUrl | String | "Base Index Frames" URL for HD trick mode. | +| FHDBifUrl | String | "Base Index Frames" URL for FHD trick mode. | +| ads | roArray of AdDescriptions | Array of the ad description for the ads to play during the content. | +| profile | String | Optional. The profile to use when making the discovery call for THEOlive streams. | +| ssai | GoogleDaiConfiguration | Optional. The configuration for playing this as a dynamic ad insertion asset. | +| embeddedTextTrack | string | Name of the embedded text track in the asset. Not necessary if the track is explicitly defined in the manifest. | + +"Base Index Frames" or BIF, is an archive file format that contains a set of still images, also known as "trick play thumbnails", supporting enhanced fast-forward and rewind modes during video playback. + +### Ad Descriptions + +| Name | Type | Description | +| -------------- | ------------------ | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| sources | AdSource or string | Either an AdSource or the URL of the ad XML to load. | +| integration | string | The kind of ad integration this uses. Currently the only supported value is `csai`. | +| timeOffset | string or number | An optional value determining when to show the ad. It can either be the number of seconds representing the timecode in the video when the ad should play, or it can be `start` or `end` to play the ad either before or after the video. Additionally it could be a percent of the content's duration, like `25%`, or a timecode in the format `HH:MM:SS`. NOTE: This is for VAST ads only. Do not use this with VMAP ads. | +| replaceContent | boolean | An optional value for whether this ad tag should replace content when the ad plays. Valid only for midrolls. Defaults to false. | + +NOTE: when scheduling ads, VAST ads cannot be scheduled in the middle of the time covered by a VMAP ad tag. For instance, if you have a VMAP preroll and postroll in a single ad tag, you could not schedule midrolls in between them. However, if you had separate VMAP preroll and postroll tags, you could place a VAST midroll tag in between the two. + +#### Ad Sources + +| Name | Type | Description | +| ---- | ------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------ | +| src | string | The URL of the XML file to load for the ad break. | +| type | string | The optional type of the ad. Supported values are either `vast` or `vmap`. Otherwise the default value is inferred from the AdDescription's `timeOffset` property. | + +### SSAI/DAI Configuration + +The player supports Dynamic Ad Insertion (DAI) using Google DAI. This integration currently supports doing Server Side Ad Insertion (SSAI) on live streams. To enable this, add the `ssai` property to your source with your Google DAI information. You can listen for ad events emitted by Google DAI on the Ads API. + +The following key/value pairs are supported on the `ssai` attribute of a Typed Source: + +| Name | Type | Description | +| ---------------- | ------------------ | -------------------------------------------------------------------------------- | +| integration | string | The type of DAI integration. The supported values are "google-dai" or "theoads". | +| apiKey | string | The API key for your DAI account. | +| availabilityType | string | The type of asset you are playing ("live" or "vod"). | +| networkCode | string | The network code for your DAI account. | +| assetKey | string | Optional. The asset key for your live asset. Not required for VOD assets. | +| adTagParameters | roAssociativeArray | Optional. Map of ad tag parameters configurable for ad targeting. | + +NOTE: It is not supported to use SSAI through this API at the same time as Client-side Ad Insertion (CSAI) through the Ad Sources configuration. + +### Content Protection + +The following key/value pairs are supported on the `contentProtection` attribute of a Typed Source: + +| Name | Type | Description | +| ----------- | -------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| integration | String | _Optional attribute._ The key system the player should use. Possible values are `playready`, `widevine`. | +| licenseUrl | String | The license acquisition URL | +| certificate | String | The actual certificate string for Widevine purposes, which must be obtained out-of-band (OOB) by the channel. Leave this unset unless Widevine is used for DRM. | +| drmParams | DRM Parameters | An alternative way to set parameters for DRM playback. _This attribute is only used when the `integration` attribute is not set._ | + +**Example DRM source with VuDRM specific headers** + +To play videos protected using VUDRM, you need to supply a token. Replace the token `vualto-demo|2018-06-19T09:18:24Z|YSnJPmEceo` in the code below with your own token as well as the associated values of the keys `src` and `licenseUrl`. + +```brightscript +vuDrmSource = { + sources: [ + { + src: "https://d1chyo78gdexn4.cloudfront.net/vualto-demo/big-buck-bunny/big-buck-bunny.ism/manifest.mpd" + type: "application/dash+xml" + contentProtection: { + integration: "widevine" + licenseUrl: "https://widevine-proxy.drm.technology/proxy" + } + } + ] + drmHttpAgentHeaders: { + "x-vudrm-token": "vualto-demo|2018-06-19T09:18:24Z|YSnJPmEceo" + "Content-Type": "application/json" + } +} +``` + +### DRM Parameters + +The following key/value pairs are supported on the `drmParams` attribute of a Content Protection: + +| Name | Type | Description | +| ---------------- | ------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | +| KeySystem | String | "playready" or "widevine". This value is case-insensitive. The default is an empty string. | +| licenseRenewURL | String | A URL location for sending license renewal requests. If not specified, the Roku OS will send renewal requests to the URL specified in the licenseServerURL. This only works with widevine. | +| licenseServerURL | String | A URL location of a license server. This URL may include CGI parameters. | +| serializationURL | String | A server address used for device provisioning | +| serviceCert | String | The actual certificate string for Widevine purposes, which must be obtained out-of-band (OOB) by the channel. Leave this unset unless Widevine is used for DRM. | +| lic_acq_window | String | The maximum amount of time (in milliseconds) that a channel waits before rotating its Widevine DRM keys. The channel can generate a random wait time between 0 and the value specified in the **lic_acq_window** field, and use the random wait time to instruct when the Video node should make its next Widevine license request. _Available since Roku OS 10.5_ | + +### Ads API + +The Ads API exposes the following properties, methods, and events. + +| Property | Type | Access Permission | Description | +| ----------------- | -------------------- | ----------------- | ------------------------------------------------------------------------------------------------------------- | +| currentAdBreak | AdBreak | read | The current AdBreak if ads are playing, or invalid if they are not playing. | +| currentAds | array of Ads | read | Array of the current Ads in the current AdBreak, or invalid if ads are not playing. | +| events | assocarray | read | Map of the event types the Ads API will emit. | +| playing | boolean | read | Whether an ad is currently playing. | +| rafProxy | RafProxyNode | read | roSGNode that exposes data from the internal RAF library. | +| scheduledAdBreaks | array of assocarrays | read | Array of the scheduled breaks that haven't played. These may either be a source object or a resolved AdBreak. | +| scheduledAds | array of Ads | read | Array of the ads that are scheduled and have not played. Only shows one break's ads with VAST. | + +| Method | Description | +| -------------------------------------------------------------------------------------------- | ------------------------------------------------- | +| addEventListener(eventType as string, listenerOwner as roSGNode, eventListener as string) | Add a listener for the specified player event. | +| removeEventListener(eventType as string, listenerOwner as roSGNode, eventListener as string) | Remove a listener for the specified player event. | +| schedule(adDescription as AdDescription) | Schedule an ad break. | + +| Event | Class | Description | +| ---------------- | ------------ | ------------------------------------------------------------ | +| adbegin | AdEvent | The current creative has begun playing. | +| adbreakbegin | AdBreakEvent | The player is entering an ad break. | +| adbreakend | AdBreakEvent | The player is exiting an ad break. | +| adbuffering | AdEvent | The current ad is buffering during playback. | +| addadbreak | AdBreakEvent | An ad break has been manually added. | +| adend | AdEvent | The current ad has completed playing. | +| aderror | Event | There was an error loading or playing an ad. | +| adfirstquartile | AdEvent | The viewer has watched the first quartile of the current ad. | +| adimpression | AdEvent | The ad has begun playing. | +| adloaded | Event | The XML for an ad has been loaded. | +| admidpoint | AdEvent | The viewer has watched the half of the current ad. | +| adsmanagerloaded | Event | When the RAF ad manager has been initialized. | +| adthirdquartile | AdEvent | The viewer has watched the third quartile of the current ad. | + +#### AdEvent and AdBreakEvent + +The AdEvent is an event object with the follow properties: + +| Property | Type | Description | +| -------- | ------- | --------------------------------------------------------------------------- | +| type | string | The current AdBreak if ads are playing, or invalid if they are not playing. | +| date | integer | The current epoch time in milliseconds. | +| ad | Ad | The ad associated with the event. | + +The AdBreakEvent exposes the same properties as the AdEvent, but adds in a property with the current ad break: + +| Event | Class | Description | +| ------- | ------- | ---------------------------------- | +| adBreak | AdBreak | The ad break the event relates to. | + +#### AdBreak + +The AdBreak object is an associative array that can have the following properties: + +| Property | Type | Description | +| ----------- | ---------- | -------------------------------------------------------------------------------------------------------------------- | +| ads | roArray | An array containing the Ads in the AdBreak. | +| customData | assocarray | An associative array with any additional information for this ad break. | +| id | string | The identifier of the ad break. For Google DAI, this is the pod index of the ad break. | +| integration | string | The integration that generated the AdBreak. Currently the only supported value is `csai`. | +| maxDuration | integer | The length of the break in seconds. | +| timeOffset | integer | The time in the video at which the ad break should play, in seconds. 0 indicates preroll, and -1 indicates postroll. | + +The Ad object is an associative array that can have the following properties: + +| Property | Type | Description | +| ------------ | ---------- | ------------------------------------------------------------------------------------ | +| adBreak | AdBreak | The AdBreak this Ad belongs to. | +| adSystem | string | The ad system used to load this ad. | +| clickThrough | string | The clickthrough URL for this ad. | +| companions | roArray | An array of any CompanionAds associated with this ad. | +| creativeId | string | The creative ID for this ad. | +| customData | assocarray | An associative array with any additional information for this ad. | +| duration | integer | The duration of this ad. | +| height | integer | The height of the creative for this ad. | +| id | string | The ad ID for this ad. | +| integration | string | The integration that generated the ad. Currently the only supported value is `csai`. | +| resourceUri | string | The URI for the creative played in this Ad. | +| type | string | The type of ad. Currently only `linear` is supported. | +| width | integer | The width of the creative for this ad. | + +The CompanionAd object is an associative array that can have the following properties: + +| Property | Type | Description | +| ------------ | ------- | --------------------------------------------------- | +| adSlotId | string | The ad slot id for this companion ad, if any. | +| clickthrough | string | The clickthrough URL for this companion ad, if any. | +| height | integer | The height of the creative. | +| resourceUri | string | The URI of the creative. | +| provider | string | The provider of the companion ad, if any. | +| width | integer | The width of the creative. | + +#### RafProxyNode + +The RAF proxy node has several fields that can be observed to consume data generated by the internal RAF library. This way, an application can access information traditionally available via the `getLibVersion`, `setRafTrackingCallback` and `setAdBufferRenderCallback` methods on RAF. + +| Property | Type | Access Permission | Description | +| ------------------ | ---------- | ----------------- | ------------------------------------------------------------------------- | +| bufferRenderUpdate | assocarray | read | An associative array with the properties `adUrl`, `eventType`, and `ctx`. | +| libVersion | string | read | The string indicating the version of the RAF library. | +| trackingUpdate | assocarray | read | An associative array with the properties `adUrl`, `eventType`, and `ctx`. | + +## Methods + +| Method | Description | +| -------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| addEventListener(eventType as string, listenerOwner as roSGNode, eventListener as string) | Add a listener for the specified player event. | +| addIntegration(integration as object) | Adds an Integration. | +| configure(configuration as THEOPlayerConfiguration) | Configure the SDK, passing in the license (`{license: "MY_THEO_LICENSE"}`). | +| destroy | Destroy the player. | +| getVideoNode | Returns the interior Roku video node. | +| pause | Pause playback. | +| play | Start playback. | +| removeEventListener(eventType as string, listenerOwner as roSGNode, eventListener as string) | Remove the specified listener for the specified player event. | +| removeIntegration(integration as object) | Removes an Integration. | +| setCopyGuardManagementSystem(cgms as Integer) | Sets Copy Guard Management System. Acceptable Values: `0` - No Copy Restriction,`1` - Copy No More,`2` - Copy Once Allowed,`3` - No Copying Permitted. | +| setDestinationRectangle(w as Integer, h as Integer, x as Integer, y as Integer) | Sets width, height, x, y of player. | +| setMaxVideoResolution(width as Integer, height as Integer) | Sets maximum video resolution. | +| setPlayerFocus(focused as Boolean, focusReceiver (optional) as roSGNode) | Gives or removes the focus from the internal player. If passing `false`, you may pass an optional roSGNode to receive the focus. If not passed, the THEOplayer SDK receives focus. | + +### Player Configuration + +The PlayerConfiguration object is passed to the configure method. It is an associative array with the following properties: + +| Property | Type | Description | +| ---------- | ---------- | --------------------------------------------------------------------------------- | +| license | string | Your THEO license. Optional if `licenseUrl` is specified. | +| licenseUrl | string | The URL from which to load your THEO license. Optional if `license` is specified. | +| theolive | assocarray | The configuration for THEOlive. Optional. | + +#### THEOlive Configuration + +| Property | Type | Description | +| ----------------- | ---------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------- | +| discoveryUrl | string | Optional. The discovery URL for your THEOlive deployment. If present, it will be tried before `discoveryUrls`. | +| discoveryUrls | Array of strings | Array of discovery URLs for your THEOlive deployment. If `theoLive` config is omitted, the default URL is 'https://discovery.theo.live/v2/publications/'. | +| externalSessionId | string | A session ID to use for your THEOlive session. This can tie an application session to a THEOlens session. | + +## THEOlive API + +The THEOlive API exposes the following property. + +| Property | Type | Description | +| --------- | ------ | ---------------------------------------------------------------------------------------------------------- | +| authToken | string | Optional. The JWT to be included on THEOlive media requests in the Authorization header as a bearer token. | + +## Network API + +The Network API exposes the following methods. + +| Method | Description | +| ------------------------------------------------------ | ------------------------------------------------------------------------------------------------ | +| setHeader(headerName as string, headerValue as string) | Adds or overwrites a header for all media requests. Returns true if successful, false if not. | +| removeHeader(headerName as string) | Sets the value of the named header to an empty string. Returns true if successful, false if not. | +| getHeaders() as object | Returns a map of all headers currently configured through the network API. | + +## Events + +The event consists of: + +- date (timestamp) of occurrence +- type (string) of the event +- extra data + +There are several player events being emitted. + +- `activequalitychanged`: Fired when the playing rendition changes, the extra data emitted is the rendition's quality +- `addedaudiotrack`: Fired when audio track has been added +- `addedtexttrack`: Fired when text track has been added +- `bitratechange`: Deprecated. Use `activequalitychanged` instead. Fired when the bitrate changes, the extra data emitted is the bitrate +- `canplay`: Fired when the player can resume playback of the media data, the extra data emitted is the currentTime +- `canplaythrough`: Fired when the player can resume playback of the media data and buffering is unlikely, the extra data emitted is the currentTime +- `destroy`: Fired when the the player is destroyed, there is no extra data emitted along +- `durationchange`: Fired when the duration changes, the extra data emitted is the duration +- `emptied`: Fired when the player's source is cleared, there is no extra data emitted along +- `ended`: Fired when playback has stopped because the end of the media resource was reached, the extra data emitted is the currentTime +- `error`: Fired when an error occurs, the extra data emitted is an associative array e.g.: + ```brightscript + { + "error": "", + "errorObject": { + "code": , + "message": + } + } + ``` +- `intenttofallback`: Fired when the player has encountered an error playing a THEOlive stream and is going to try to playback a different stream. It also includes data about the error that is triggering fallback. +- `loadeddata`: Fired when the player can render the media data at the current playback position for the first time, the extra data emitted is the currentTime +- `loadedmetadata`: Fired when the player determines the duration and dimensions of the media resource, the extra data emitted is the currentTime +- `pause`: Fired when the "paused" changes to true, the extra data emitted is the currentTime +- `play`: Fired when the "paused" changes to false, the extra data emitted is the currentTime +- `playing`: Fired when playback is ready to start after having been paused or delayed due to lack of media data, the extra data emitted is the currentTime +- `endpointloaded`: Fired when the player has loaded the data for a THEOlive source and is ready to begin loading the stream +- `distributionloadstart`: Fired when the player begins to load the data for a THEOlive source +- `distributionloaded`: Fired when a THEOlive distribution has been successfully loaded. +- `distributionoffline`: Fired when a THEOlive stream is not available for playback +- `seeked`: Fired when the "seeking" changes to false after the current playback position was changed, the extra data emitted is the currentTime +- `seeking`: Fired when "seeking" changes to true, and the player has started seeking to a new position, the extra data emitted is the currentTime +- `sourcechange`: Fired when the player's source changes, the extra data emitted is an associative array e.g.: + ```brightscript + { + "source": { + "sources": [ + { + "liveOffset": 4, + "nativeUiRendering": false, + "contentProtection": { + "drmParams": { + KeySystem: "widevine" + licenseServerURL: "https://example.com/license" + } + }, + "src": "https://example.com/stream.mpd", + "type": "dash" + } + ] + } + } + ``` +- `timeupdate`: Fired when the current playback position changed as part of normal playback or in an especially interesting way, for example discontinuously, the extra data emitted is the currentTime diff --git a/theoplayer_versioned_docs/version-v10/changelog.md b/theoplayer_versioned_docs/version-v10/changelog.md new file mode 100644 index 000000000000..b65c23ef8c78 --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/changelog.md @@ -0,0 +1,1085 @@ +# Changelog + +These are the release notes for THEOplayer 10.0.0 and higher. For older versions, see: +* [Version 9.x](https://optiview.dolby.com/docs/theoplayer/v9/changelog/) +* [Version 8.x](https://optiview.dolby.com/docs/theoplayer/v8/changelog/) +* [Version 7.x](https://optiview.dolby.com/docs/theoplayer/v7/changelog/) +* [Version 5.x and 6.x](https://optiview.dolby.com/docs/theoplayer/v6/changelog/) +* [Version 2.x, 3.x and 4.x](https://optiview.dolby.com/docs/theoplayer/v4/changelog/) + +## 🚀 10.13.0 (2026/03/25) + +### Web + +#### ✨ Features + +- Added support for `clearBufferWhenSettingTargetQuality` for DASH streams. This allows manual quality switches on DASH to occur immediately. + +#### ⚡ Improvements + +- Improved handling of unreachable `csai` ad break URLs by adding a timeout of 3s. If the download times out, the player will now throw an ad error and not play the ad break. + +#### 🐛 Issues + +- Fixed issue where very small periods in DASH manifests would cause the player to crash. +- Fixed an issue where no content steering was done for text track `AdaptationSet`s in a DASH stream. +- Fixed an issue in low performant Android WebViews where playback stalls were made worse by trying to recover too fast. +- Fixed an issue where the player would not use the cached segments of the streaming `csai` ad. +- Fixed an issue where the player would not preload the next `csai` ad breaks when it already preloaded another `csai` ad break. +- Fixed an issue where the player would not play the scheduled `csai` ad breaks when one of the ad breaks starting at the same time could not be fetched. +- Fixed an issue where OptiView Lens CMCD headers were being duplicated when playing a DVR-enabled OptiView Live source. +- Fixed an issue where the player would have an incorrect `currentProgramDateTime` during the second ad break when playing multiple consecutive ad breaks on an OptiView Ads stream. +- Fixed an issue where playback would end when transitioning between ad breaks in an OptiView Ads stream on iOS Safari. + +### Android + +#### ✨ Features + +- Added `TextTrack.captionChannel` property to retrieve the CEA-608 channel and/or CEA-708 service numbers of closed caption text tracks. + +#### 🐛 Issues + +- Fixed an issue where all but the first CEA-608/CEA-708 channel was ignored. +- Fixed an issue where `AdBreak.getTimeOffset` would always return 0 for IMA ads. +- Fixed Nielsen ID3 tags not being reported during HESP playback. +- Fixed an issue where the `CHANGE` event was missing when an audio or video track was automatically enabled by the player (e.g. for a default track). +- Fixed an issue when selecting specific video qualities may lead player to choose a completely different, sometimes invalid, quality. + +### iOS + +#### ✨ Features + +- Added `move` method to `CachingTask` to help move the cached stream assets to a specified directory URL. + +#### 🐛 Issues + +- Fixed an issue where the downloaded assets were not properly cleared from storage after calling `remove()` on an active `CachingTask`. +- Fixed an issue where `Ads.Omid` APIs would not apply correctly. + +### Roku + +#### ⚡ Improvements + +- Updated Mux SDK to version 2.6.2 in the Roku Mux connector. + +#### 🐛 Issues + +- Fixed an issue where the `emptied` event was no longer being dispatched. + +## 🚀 10.12.1 (2026/03/17) + +### iOS + +#### ⚡ Improvements + +- Improved startup time for HESP-enabled OptiView Live streams on slower networks. + +#### 🐛 Issues + +- Fixed an issue where the first video frame would appear stuck for a while when starting playback of an HESP OptiView Live stream. + +## 🚀 10.12.0 (2026/03/12) + +### Web + +#### ✨ Features + +- Added default values for the `mpt` and `mpv` ad tag parameters for Google DAI. +- Added the `AdBreak.id` API. +- Added the experimental `View.player` property to the MultiView API to access the player underlying that view. + +#### 🐛 Issues + +- Fixed an issue where the player would not parse Nielsen cues when playing an OptiView Live stream. +- Fixed an issue where the player would not dispatch ad events when playing a Google DAI DASH live stream. +- Fixed an issue in HLS streams with TS segments where setting a `targetQuality` could sometimes cause an infinite loop. +- Fixed an issue where the player would still receive id3 events from the previous Google DAI source after resetting the source to a non Google DAI source. +- Fixed an issue where, when playing an OptiView Ads enabled stream, subsequent switches from ad to content would take longer and longer each time. +- Fixed an issue where the backdrop doesn't respect the aspect ratio when an ad is played with another aspect ratio in an OptiView Ads stream. +- Fixed an issue where the player would not pause the content in double box layout when clicking on an ad clickthrough for an OptiView Ads stream. +- Fixed an issue where OptiView Live streaming fallback functionality was not behaving as expected when playing HESP streams. +- Fixed an issue where the player would sometimes play a Google IMA preroll ad again when switching from ad to content while playing an OptiView Ads stream in native fullscreen or native PiP. +- Fixed an issue where the content would be paused when playing an OptiView Ads double-box advertisement. +- Fixed an issue where the double box layout would not dismiss when the VAST ad creative was unavailable for OptiView Ads. +- Fixed an issue where the player would sometimes not play the VAST ad unmuted on iOS Safari for an OptiView Ads stream. + +#### ⚠ Known Limitations + +- Using OptiView Ads with Picture-in-Picture (PiP) on Firefox is not supported. The default PiP button will be hidden in this scenario to discourage usage. + +### Android + +#### 💥 Breaking Changes + +- `LatencyManager.currentLatency` now returns `null` when the player is not actively playing. + +#### ✨ Features + +- Added default values for the `mpt` and `mpv` ad tag parameters for Google DAI. +- Added the `AdBreak.idAsString` API. +- Added `Logger.HESP` logging tag for debugging HESP playback issues. + +#### 👎 Deprecations + +- Deprecated `MediaTailorAdAvail.id` in favor of `AdBreak.idAsString`. + +### iOS + +#### ✨ Features + +- Added the `bytes` property to the `CachingTask` API which estimates the total amount of bytes that the task will download. +- Added the `AdBreak.id` API. +- Added default values for the `mpt` and `mpv` ad tag parameters for Google DAI. +- Added better error handling for HESP loading during startup with bad network conditions. + +#### ⚡ Improvements + +- Improved performance when accessing the `bytesCached` property of `CachingTask`. +- Improved error handling during ABR switches when playing OptiView Live sources. +- Improve error details (error code and message) when storage is low during a caching task. In a future major version, we will send better error metadata where possible: ie. send `THEOErrorCode.CACHE_SOURCE_ERROR` instead of `THEOErrorCode.NETWORK_ERROR`. + +#### 🐛 Issues + +- Fixed an issue where text tracks were not synced properly with Chromecast. +- Fixed an issue where HESP playout would occasionally fail to start or stall shortly after startup. +- Fixed an issue where a `CastError` was thrown during Chromecast connection establishment. +- Fixed an issue where retrying segment downloads for OptiView Live sources in bad network conditions would cause a fallback instead of continuing with the retried segment download. +- Fixed an issue where autoplay would not work when setting Millicast sources. +- Fixed an issue where setting `muted` on the player before setting a `MillicastSource` would be ignored. +- Fixed an issue where a quality switch on an OptiView Live HESP source caused unintended fallbacks. +- Fixed an issue where the ABR controller would switch up too fast after startup or after a previous quality switch. +- Fixed an issue during HESP playback where sometimes a `playing` event would be missing after resuming playback. + +### Roku + +#### ✨ Features + +- Added the `AdBreak.id` API. +- Added default values for the `mpt` and `mpv` ad tag parameters for Google DAI. + +#### ⚡ Improvements + +- Updated the Mux SDK in the THEOMuxConnector to 2.6.0. + +#### 🐛 Issues + +- Fixed an issue in the THEOMuxConnector where the poster URL was not being recorded. + +## 🚀 10.11.1 (2026/03/05) + +### Web + +#### 🐛 Issues + +- Fixed an issue where versions 10.10.0 to 10.11.0 of the [`@theoplayer/basic-hls`](https://www.npmjs.com/package/@theoplayer/basic-hls) variant were published with an incorrect feature set. +- Fixed an issue where setting a second OptiView Live source in a row would sometimes cause the stream to fail to start. + +## 🚀 10.11.0 (2026/02/25) + +### Web + +#### ⚡ Improvements + +- Updated the OptiView Real-time streaming retry logic. Minimum backoff time for a OptiView Real-time source is now 1 second. +- OptiView Live streams played on mobile Safari will fallback faster when segments would be unavailable. +- Improved the resiliency for MPEG-DASH Content Steering when the steering server is unstable. + +#### 🐛 Issues + +- Fixed an issue where a PS4 WebMAF app could freeze when autoplay is enabled. +- Fixed an issue where autoplay on an ended stream could fire a play event before the sourcechange event, causing duplicate analytics sessions. +- Fixed an issues in MPEG-DASH Content Steering where successful manifest location downloads were reported in the `_DASH_pathway` search param. +- Fixed an issue where layer configuration passed in `MillicastSource.connectOptions` was not kept into account when switching layers after the source had been set. + +#### ⚠ Known Limitations + +- [`@theoplayer/basic-hls` version 10.11.0](https://www.npmjs.com/package/@theoplayer/basic-hls/v/10.11.0) was incorrectly published with the `basic-dash` feature set. If you're using this variant, please update to version 10.11.1 or higher for the correct feature set. + +### Android + +#### ⚡ Improvements + +- Updated Media3 to [version 1.9.2](https://github.com/androidx/media/releases/tag/1.9.2). + +#### 🐛 Issues + +- Fixed an issue where ABR was not switching to a lower quality on very low bandwidth. +- Fixed an issue where `TextTrackStyle.fontSize` was not correctly applied to TTML subtitles with a `tts:fontSize` attribute. +- Fixed an issue where changing the `player.textTrackStyle` of one player could accidentally also change the text track style of other players. +- Fixed an issue where using Picture-in-Picture with `PiPType.ACTIVITY` on apps without `Theme.AppCompat` theme could crash the application. +- Fixed an issue where autoplay on an ended stream could fire a play event before the sourcechange event, causing duplicate analytics sessions. +- Updated the Millicast SDK to version 2.5.3, which adds a necessary consumer ProGuard rule to prevent a missing symbol crash from occurring when enabling minification. +- Fixed an issue where the backdrop would not be visible for OptiView Ads. +- Fixed an issue where the player would restart a VOD source when a scheduled interstitial would not have a resume time for OptiView Ads. +- Fixed an issue where the target latency was not applied for OptiView Live v1 channels. + +### iOS + +#### ✨ Features + +- Added mobile layout support for OptiView Ads to override the ad layout when playing on iOS. + +#### ⚡ Improvements + +- Bumped the Millicast SDK version to 2.5.3 + +#### 🐛 Issues + +- Fixed an issue where playing OptiView Live streams would cause an initial audio stutter. +- Fixed an issue in OptiView Ads where subsequent adbreak requests on monetized streams would fail after receiving an ad error. +- Fixed an issue where playing a VAST ad pod would only play the first ad for OptiView Ads. +- Fixed an issue in OptiView ads where the player would pause instead of playing the main content when an ad fails to load. +- Fixed an issue where the target latency was not applied for OptiView Live v1 channels. + +### Roku + +#### 👎 Deprecations + +- Deprecated the `bitratechange` event in favor of the `activequalitychanged` event. + +## 🚀 10.10.1 (2026/02/25) + +### Web + +#### 🐛 Issues + +- Fixed an issue in HLS streams with TS segments where setting a `targetQuality` could sometimes cause an infinite loop. + +#### ⚠ Known Limitations + +- [`@theoplayer/basic-hls` version 10.10.1](https://www.npmjs.com/package/@theoplayer/basic-hls/v/10.10.1) was incorrectly published with the `basic-dash` feature set. If you're using this variant, please update to version 10.11.1 or higher for the correct feature set. + +## 🚀 10.10.0 (2026/02/11) + +### General + +#### ✨ Features + +- Added the `distributionloaded` event to the `player.theolive` API. + +### Web + +#### 🐛 Issues + +- Fixed an issue where DRM-enabled HLS streams could error on rendition switches due to missing keys. +- Fixed an issue where quality changes during HLS playback could cause an error on low-end devices. +- Fixed an issue where an HESP source with a relative manifest URL could not be played. +- Fixed an issue on Safari where sometimes the `ended` event would not be fired when the player reaches the end of a stream. +- Fixed an issue where multiple subtitle cues within a segment would not display correctly. +- Fixed an issue where an HLS live stream would not start playback after a pre-roll ad on iOS Safari. +- Fixed an issue where the player would dispatch the `pause` and `ended` event in an incorrect order when seeking to the end of a stream. +- Fixed an issue where a track's `activeQuality` could be `undefined` on a playing event with OptiView Live streams. +- Fixed an issue where an OptiView Ads stream with disabled VPAID ads could cause the player to stop serving ads. +- Fixed an issue where playing ads using Google IMA and OptiView Ads together could cause the Google IMA ad to not play. +- Fixed an issue where an incorrect waiting event could be dispatched during an ad break to ad break transition on an OptiView Ads stream. + +#### ⚠ Known Limitations + +- [`@theoplayer/basic-hls` version 10.10.0](https://www.npmjs.com/package/@theoplayer/basic-hls/v/10.10.0) was incorrectly published with the `basic-dash` feature set. If you're using this variant, please update to version 10.11.1 or higher for the correct feature set. + +### Android + +#### ✨ Features + +- Added `NetworkConfiguration` support for retries for OptiView Real-time streams. + +#### 🐛 Issues + +- Fixed an issue where the bandwidth caching parameter was ignored when caching DRM-protected streams. +- Fixed an issue during offline playback where playing a not fully downloaded content-protected (DRM) stream could cause a crash. +- Fixed an issue where a stall during playback on Chromecast for OptiView Live streams was not handled correctly. + +### iOS + +#### ✨ Features + +- Made the `contentProtection` property public on the `EndpointAPI` protocol. + +#### ⚡ Improvements + +- Fixed an issue where recovery from network errors while playing and OptiView Live stream could take longer than expected due to platform limitations. + +#### 🐛 Issues + +- Fixed an issue where using `player.ads.schedule(adDescription:)` API did not trigger an ad playback. +- Fixed an issue where the recovery logic during playback of OptiView Live streams could check incorrect endpoints. +- Fixed an issue where playback was stuck when receiving an empty VAST for OptiView Ads. +- Fixed a bug that reset the `autoplay` flag whenever an integration was added to the player. +- Fixed an issue where OptiView Ads with VAST would not play in picture-in-picture mode. +- Fixed an issue where track selection was not respected during Chromecast. + +## 🚀 10.9.0 (2026/01/29) + +### Web + +#### ✨ Features + +- Added `DashPlaybackConfiguration.contentSteering` to control whether content steering is enabled in MPEG-DASH streams. + +#### ⚡ Improvements + +- Added the ability to set a `RetryConfiguration` on a per-source basis. + +#### 🐛 Issues + +- Fixed an issue for OptiView Ads where the layout could be incorrect when playing a VAST ad in double box or L-shape layout. +- Fixed an issue where the player could not switch sources after a DAI stream errored. +- Fixed an issue where a WideVine L1 protected DASH stream would occasionally fail to play on certain Android FireTV models (AFTSS & AFTSSS). +- Fixed an issue where an `#EXT-X-KEY` with a base64 `data:` URI was sometimes parsed incorrectly from the HLS playlist. +- Fixed an issue where playback of subsequent OptiView Live sources would cause incorrect endpoints to be selected. +- Fixed an issue where MPEG-DASH content steering was sometimes not switching to a different `serviceLocation` when segment downloads failed. +- Fixed an issue where a PS4 WebMAF app could freeze upon requesting a media segment. +- Fixed an issue where the timecode text track would not be present on HESP streams that contain SEI timecodes. +- Fixed an issue in MPEG-DASH Content Steering where the `Retry-After` header was not respected when the server returned status code `429`. +- Fixed an issue where a crash would occur when playing an unsupported VPAID ad during native fullscreen on iOS Safari for an OptiView Ads stream. +- Fixed an issue in MPEG-DASH Content Steering where the `_DASH_throughput` and `_DASH_pathway` query parameters only supported a single pathway. +- Fixed an issue in MPEG-DASH Content Steering where sometimes a `serviceLocation` was chosen that was outside the provided `PATHWAY-PRIORITY` list. +- Fixed an issue in MPEG-DASH Content Steering where `_DASH_throughput` would report a pathway that was not actually downloaded. +- Fixed an issue in MPEG-DASH Content Steering where the default serviceLocation was not respected with `queryBeforeStart="false"`. +- Fixed an issue where the player would dispatch play/pause events incorrectly when playing ad break to ad break on an OptiView Ads stream. +- Fixed an issue for OptiView Ads where an IMA ad break could error when playing in iOS Safari native fullscreen. +- Fixed an issue for OptiView Ads where the audio could play multiple times for a VAST ad in Picture-in-Picture. +- Fixed an issue for OptiView Ads where the same ad could sometimes be scheduled multiple times. +- Fixed an issue where the `playing` event was sometimes not dispatched when resuming playback after fallback of an OptiView Live stream. + +### Android + +#### ⚡ Improvements + +- The player will now automatically switch to a different quality when the current quality needs a DRM key that is missing in the DRM license. (Previously, the player would crash with a `MediaCodec.CryptoException` instead.) + +#### 🐛 Issues + +- Fixed an issue where `Ads.getCurrentAds()` could contain `null` ads. +- Fixed an issue where `player.duration` was incorrectly reported as `Infinity` for MP3 files when using the `HttpEngine` network stack. +- Fixed an issue where `TrackListChangeEvent` was not triggered when the subtitles were turned off. +- Fixed an issue where the subtitle state was not maintained between the sender and receiver apps. + +#### ⚠ Known Limitations + +- When the player's ABR strategy is set to `QUALITY`, but the highest quality is missing a required DRM key, the player will fall back to *any* other quality (not necessarily the highest quality with an available DRM key). + +### iOS + +#### ✨ Features + +- Added a `LatencyManager` to control offset from live in HLS livestreams. + +### Roku + +#### ✨ Features + +- Created the THEOMuxConnector to enable Mux analytics in the THEO Roku SDK. + +#### 🐛 Issues + +- Fixed an issue where Comscore and Adobe connectors could spawn multiple lingering task threads after multiple instantiations. +- Fixed an issue where VOD Google SSAI assets would not play. +- Fixed an issue where the stall detection would wrongly say a stream with no audio was stalled. + +## 🚀 10.8.0 (2026/01/15) + +### Web + +#### ✨ Features + +- Added support for MPEG-DASH content steering. +- Added support for `player.metrics.bufferedSegments` when playing an HLS stream. + +#### ⚡ Improvements + +- OptiView Streaming sources now support more `TypedSource` properties, such as `TypedSource.abr` and `TypedSource.crossOrigin`. + +#### 🐛 Issues + +- Fixed an issue where some HLS live streams could stall indefinitely when playing over an `#EXT-X-DISCONTINUITY` on Samsung Tizen devices. +- Fixed an issue where the `player.currentTime` could be incorrect after playing a CSAI ad with OptiView Ads. +- Fixed an issue where `player.metrics.currentBandwidthEstimate` was not set when playing an HESP stream. +- Fixed an issue where the player would sometimes jump back to the first ad of an OptiView Ads break instead of continuing with the second ad of that break. +- Fixed an issue for OptiView Ads where a VAST ad break in Safari native fullscreen could stutter. + +### iOS + +#### ✨ Features + +- Added the `Network` API to `CachingTask` to help enable media playlist interception. + +#### 🐛 Issues + +- Fixed an issue where seeking to the live point could cause unnecessary buffering on OptiView Streaming (THEOlive) sources. + +#### 👎 Deprecations + +- Deprecated `DeveloperSettings` & `ManifestInterceptor` in favor of `NetworkAPI`. You can access the network API from `player.network` or `cachingTask.network`. For a comprehensive guide, please refer to [our documentation](/theoplayer/how-to-guides/network/ios-hls-media-playlist-interceptor/). + +### Roku + +#### 🐛 Issues + +- Fixed an issue where OptiView Live streams would not properly fall back to a backup feed in case of a streaming error. +- Fixed an issue where OptiView Live streams could experience endless buffering without recovering. + +## 🚀 10.7.2 (2026/01/27) + +### Web + +#### 🐛 Issues + +- Fixed an issue where HLS playback on lower spec devices could error on a quality change between qualities with identical initializers. + +## 🚀 10.7.1 (2026/01/26) + +### Web + +#### 🐛 Issues + +- Fixed an issue where HLS playback on lower spec devices could error on a quality change briefly after starting playback. + +## 🚀 10.7.0 (2025/12/16) + +### Web + +#### ✨ Features + +- Added the ability to override connect options for OptiView Real-time streams. +- Added support for casting token-protected OptiView Live DVR streams to Chromecast. +- Added Millicast connect options to the OptiView Live discovery response. + +#### ⚡ Improvements + +- Added `RetryConfiguration` support for OptiView Real-time streams. +- Improved OptiView Real-time stream stability by automatically attempting to reconnect when errors occur mid-stream. + +#### 🐛 Issues + +- Fixed an issue where the player would not play from the live point when exiting an errored casting session. +- Fixed an issue for OptiView Ads where using a CSAI adbreak would not be handled properly when going into PiP or native fullscreen. +- Fixed a regression where `currentProgramDateTime` was no longer returning `null` for non-DVR streams without program date time information. +- Fixed an issue with consecutive ad breaks on an OptiView Ads Stream where the second ad break would not play if its duration was smaller than the preceding ad break. +- Fixed an issue where the player would play a CSAI ad break muted in a double box layout for an Optiview Ads stream. +- Fixed an issue where pausing OptiView Real-time streams would show a frozen frame on browsers on Android devices. +- Fixed an issue where CEA-608 captions from the content continued showing during an SSAI ad break. + +### Android + +#### ✨ Features + +- Added `DRMConfiguration.multiSession` to enable multi-session support for streams that require different key requests for different qualities, or for streams that use key rotation. +- Added support for casting token-protected OptiView Live DVR streams to Chromecast. +- Added the ability to override connect options for OptiView Real-time streams. + +#### 🐛 Issues + +- Fixed an issue where subtitles could not be turned off while using Chromecast. +- Fixed an issue where failover of OptiView Live sources during HLS playback would return the player to non-HLS playback. + +#### 👎 Deprecations + +- Deprecated `THEOplayerConfig.isMultiSession`, use `DRMConfiguration.multiSession` instead. + +### iOS + +#### ✨ Features + +- Added Chromecast support for DVR-enabled OptiView Live streams. +- Added the ability to override connect options for OptiView Real-time streams. + +#### 🐛 Issues + +- Fixed a regression where PiP was not retained when the `retainPresentationModeOnSourceChange` setting was enabled in the `PipConfiguration`. +- Fixed an issue where the auth token was not being passed correctly with DVR enabled OptiView Live streams. + +### Roku + +#### 🐛 Issues + +- Fixed an issue where closed captions would be disabled when destroying the player while buffering. + +## 🚀 10.6.1 (2025/12/02) + +### Android + +#### 🐛 Issues + +- Fixed an issue where ID3 metadata from an HLS alternative audio rendition was not being parsed. + +## 🚀 10.6.0 (2025/12/02) + +### Web + +#### ✨ Features + +- Added a fallback to the Google DAI server-side beaconing stream when an OptiView Ads stream or OptiView Live stream with ads enabled is played via Airplay and a `daiAssetKey` is defined. +- Added support for personalized discovery call responses by configuring the `profile` property on an OptiView Live source. + +#### ⚡ Improvements + +- Added `ActiveQualityChanged` event for OptiView RealTime streams. +- Improved HLS segment selection on ABR changes to not download segments that had already been buffered in a different quality. +- The query parameters on the endpoint license acquisition URL of a DRM protected OptiView Live stream now take precedence over the query parameters that are defined in `contentProtection.queryParameters` or in the corresponding key system configuration. +- The `player.ads.dai` API is now undefined when there the DAI library is not loaded. + +#### 🐛 Issues + +- Fixed an issue where the player would always preload the Google DAI manifest when setting a Google DAI source. +- Fixed an issue where audio labels would not default to the language for HESP streams. +- Fixed an issue where the player could stall shortly on a discontinuity switch if the stream contained a small gap. +- Fixed issue where failover of OptiView Live sources during HLS playback would return the player to non-HLS playback. + +#### 👎 Deprecations + +- Deprecated `preloadPublications` on the THEOliveAPI. This will be removed in a future version. + +### Android + +#### ✨ Features + +- Added Chromecast support for DVR-enabled OptiView Live streams. +- Added support for personalized discovery call responses by configuring the `profile` property on an OptiView Live source. + +#### ⚡ Improvements + +- The query parameters on the endpoint license acquisition URL of a DRM protected OptiView Live stream now take precedence over the query parameters that are defined in `contentProtection.queryParameters` or in the corresponding key system configuration. + +#### 👎 Deprecations + +- Deprecated `preloadPublications` on the THEOliveAPI. This will be removed in a future version. + +### iOS + +#### 💥 Breaking Changes + +- THEOplayer SDK and all its integrations frameworks will now be built with Xcode 16 instead of 15. We expect no impact on applications since Apple enforced the policy of building with Xcode 16 to publish to the app store since April 24, 2025. Categorizing this as "Breaking change" since the compiler is bumped from Swift 5.10 to 6.0 with the Xcode version bump. + +#### ✨ Features + +- Added `targetQualities` property to `MediaTrack` API. Only supported for THEOlive. +- Added support for personalized discovery call responses by configuring the `profile` property on an OptiView Live source. +- Added a new experimental pipeline for chromecast, which enables new features, i.e. OptiView Live DVR. To use the new pipeline enable the `enableExperimentalPipeline` on the `CastConfiguration` object when creating the CastIntegration. + +#### 🐛 Issues + +- Fixed an issue where sometimes playback would pause after ending an OptiView Ads ad break on iPadOS. +- Fixed an issue where `player.buffered` would return the same as `player.seekable`. +- Fixed an issue where adding multiple drm query parameters would not work as expected. + +#### 👎 Deprecations + +- Deprecated `preloadPublications` on the THEOliveAPI. This will be removed in a future version. + +### Roku + +#### ✨ Features + +- Added support for personalized discovery call responses by configuring the `profile` property on an OptiView Live source. + +## 🚀 10.5.1 (2025/11/26) + +### Web + +#### 🐛 Issues + +- Fixed an issue where seeking back in an OptiView Live stream with a DVR window on iOS Safari would make the player jump to the live edge instead of the desired time. +- Fixed an issue where the current time was incorrect when returning from casting a DVR asset. + +### Android + +#### 🐛 Issues + +- Removed dependency on `kotlinx-datetime` library from OptiView Ads integration. + +## 🚀 10.5.0 (2025/11/19) + +### Web + +#### ✨ Features + +- Added support for targeted bitrate limiting on OptiView Live streams with OptiView Ads enabled. +- Added the `fallback` event to the `theoads` API to indicate when the player falls back to Google DAI when OptiView Ads is not supported or blocked. +- Added support for configuring query parameters that are common to multiple key system configurations. The parameters defined in `contentProtection.queryParameters` will be merged with any query parameters that are explicitly defined on a key system configuration, whereby the latter takes precedence. + +#### ⚡ Improvements + +- Updated OptiView Ads overlays to be available during the whole DVR range instead of being removed after it was shown. +- Improved the transition from content to ad on Safari for OptiView Ads. + +#### 🐛 Issues + +- Fixed an issue for OptiView Ads where the player could get stuck when scheduling multiple ad breaks close together. +- Fixed an issue where the player would not dispatch an `AdErrorEvent` when failing to play an ad during an OptiView Ads stream. +- Fixed a regression since 10.2.0 for OptiView Ads where a scheduled overlay could be rendered multiple times. +- Fixed an issue where incorrect events were dispatched when transitioning between content and ads for OptiView Ads. +- Fixed an issue where the cues of text tracks would never be pruned on HLS live streams. +- Fixed an issue where the player would sometimes throw a media decode error on PS5 when playing multi period DASH streams. +- Fixed an issue where the Uplynk UI was creating unnecessary DOM nodes on every `timeupdate` event, even when the Uplynk integration was not in use. +- Fixed an issue for OptiView Ads where L-Shape ad breaks on iOS would show the content instead of the backdrop. +- Fixed an issue where multiple quartile events could be dispatched when playing a Google DAI source. + +### Android + +#### ✨ Features + +- Added `TheoAdsFallbackEvent` to indicate when the player falls back to Google DAI when OptiView Ads is not supported or blocked. +- Added support for targeted bitrate limiting on OptiView Live streams with OptiView Ads enabled. +- Added support for configuring query parameters that are common to multiple key system configurations. The parameters defined in `contentProtection.queryParameters` will be merged with any query parameters that are explicitly defined on a key system configuration, whereby the latter takes precedence. + +#### 🐛 Issues + +- Fixed an issue where an `InterstitialError` event was incorrectly emitted for single ads in OptiView Ads. +- Fixed an issue where the `AddAdBreakEvent` would fire multiple times while playing a Google DAI ad. +- Fixed an issue on OptiView Ads where an additional `AdBegin` event was fired in case of an ad error or very short slate. +- Fixed an issue where the player did not always fall back to a configured Google DAI stream when it encounters a problem with the main OptiView Ads stream. +- Fixed an issue where `AdBreakBeginEvent` was fired at the start of each ad in a Google IMA/DAI ad break, instead of just once at the start of the ad break. +- Fixed an issue where a crash could occur due to locally stored bandwidth properties being null unexpectedly. +- Fixed an issue where `AdBreak.timeOffset` was always 0 for midrolls in a Google DAI livestream. +- Fixed an issue where different midroll ad breaks in a Google DAI livestream were incorrectly represented by the same `AdBreak` object. +- Fixed an issue where ad breaks in a Google DAI livestream were never removed from the Ads API after being played. +- Fixed an issue where OptiView Live was incorrectly skipping endpoints with higher priority. + +### iOS + +#### ✨ Features + +- Added `THEOadsFallbackEvent` to indicate when the player falls back to Google DAI when OptiView Ads is not supported or blocked. +- Added support for targeted bitrate limiting on OptiView Live streams with OptiView Ads enabled. +- Added support for configuring query parameters that are common to multiple key system configurations. The parameters defined in `DRMConfiguration.queryParameters` will be merged with any query parameters that are explicitly defined on a key system configuration, whereby the latter takes precedence. + +#### 🐛 Issues + +- Fixed an issue where both SGAI and SSAI were enabled for a SSAI only OptiView Live stream. +- Fixed an issue where accessing the ad break of a Google DAI ad would crash the application. +- Fixed an issue where playback would not automatically start when setting a new source and calling play after connecting to AirPlay. +- Fixed an issue where the picture-in-picture presentation mode was not preserved when an adbreak ended for OptiView Ads. +- Fixed an issue where player controls and API's were broken when returning from a Chromecast session. + +#### 👎 Deprecations + +- Deprecated the `adBreak` property of the `Ad` protocol, this property can still be used but will become optional with the next major version. + +### Chromecast + +#### 🐛 Issues + +- Fixed an issue where a mismatch could occur between enabled tracks on the sender versus the receiver, causing unexpected behaviour in audio track selection. + +### Chromecast CAF + +#### ✨ Features + +- Added support for configuring query parameters that are common to multiple key system configurations. + +### Roku + +#### ✨ Features + +- Added support for targeted bitrate limiting on OptiView Live streams with OptiView Ads enabled. + +#### 🐛 Issues + +- Fixed an issue where a crash could occur due to event listener cleanup during player destruction. + +## 🚀 10.4.1 (2025/11/14) + +### Web + +#### ⚡ Improvements + +- Improved the performance of CEA-608 parsing and rendering. + +#### 🐛 Issues + +- Fixed an issue where the cues of text tracks would never be pruned on HLS live streams. + +### iOS + +#### 🐛 Issues + +- Fixed an issue where accessing the ad break of a Google DAI ad would crash the application. +- Fixed an issue where unmuting the player on iOS failed after muting a stream that contains an IMA ad. +- Fixed an issue where after loading a VMAP ad, additional VMAP ads would fail to load and playout would be broken. + +#### 👎 Deprecations + +- Deprecated the `adBreak` property of the `Ad` protocol, this property can continue to be used but will become optional with the next major version. + +## 🚀 10.4.0 (2025/11/05) + +### General + +#### ⚡ Improvements + +- Aligned the position of the video during an OptiView Ads L-Shape interstitial to be consistent across SDKs. + +### Web + +#### ✨ Features + +- Added DVR switching for OptiView Live streams so users can seek between live sources (HESP/Millicast) and DVR sources (HLS) on DVR-enabled channels. +- Added support for DAI SSAI as the primary stream for OptiView Live streaming. + +#### 🐛 Issues + +- Fixed an issue for OptiView Ads where Overlay interstitials did not update during an ad break interstitial where the content continues playing. +- Fixed an issue for OptiView Ads where the backdrop set in the source description wasn't used correctly. + +### Android + +#### 🐛 Issues + +- Fixed a regression where `TheoLiveSource.headers` were no longer being passed to the discovery call for OptiView Live streams. +- Fixed an issue where sideloaded WebVTT chapters and thumbnails tracks could not both be enabled at the same time. +- Fixed an issue where ad configuration parameters were not being applied to DAI OptiView Live streams. +- Fixed an issue where the player could crash while loading an OptiView Live channel that is unavailable. + +#### 👎 Deprecations + +- Deprecated `TheoAdsErrorEvent`. Use the `AdErrorEvent` on the Ads API instead. + +### iOS + +#### ✨ Features + +- Added a convenience initializer to `GoogleDAITypedSource` to enable DRM with Google DAI. +- Added support for DAI SSAI as the primary stream for OptiView Live streaming. + +#### 🐛 Issues + +- Fixed an issue for OptiView Ads where the backdrop set in the source description wasn't used correctly. + +### Roku + +#### 🐛 Issues + +- Added protection against unexpected values being set for `encoding_type` on Conviva metadata. + +## 🚀 10.3.0 (2025/10/23) + +### Web + +#### 🐛 Issues + +- Fixed an issue where embedded subtitles could sometimes disappear after repeatedly seeking back and forth in an MPEG-DASH stream. +- Fixed an issue where disconnecting a headset while playing an MPEG-DASH live stream causes the player to stall. + +### Android + +#### ✨ Features + +- Added SSAI fallback through DAI for OptiView Ads if an ad blocker prevents ads from playing when using OptiView Streaming. +- Added support for `adTagParameters` on `gamProperties` for overlays and `backdropURIGamProperties` for backdrops on OptiView Ads. +- Added support for DAI SSAI as a primary stream source via OptiView Streaming. + +#### 🐛 Issues + +- Fixed an issue where EZDRM ClearKey license responses were not correctly handled and could result in playback failures. +- Fixed an issue where HLS streams with gzip compressed playlists failed to play on older Android devices when the HTTP response contains a `Content-Encoding` header with a lowercased header name (i.e. `content-encoding`). +- Fixed an issue where OptiView Ads playback was broken after the application comes back from background. + +#### 👎 Deprecations + +- Deprecated `THEOplayerConfig.getPipConfiguration()`, use `THEOplayerConfig.getPip()` instead. +- Deprecated `THEOplayerConfig.getNetworkConfiguration()`, use `THEOplayerConfig.getNetwork()` instead. +- Deprecated `THEOplayerConfig.getTHEOLiveConfiguration()`, use `THEOplayerConfig.getTheoLive()` instead. +- Deprecated `THEOplayerConfig.castConfiguration`, use `THEOplayerConfig.cast` instead. +- Deprecated `THEOplayerConfig.googleImaConfiguration`, use `THEOplayerConfig.googleIma` instead. + +### iOS + +#### ✨ Features + +- Added support for `adTagParameters` on `gamProperties` for overlays and `backdropURIGamProperties` for backdrops on OptiView Ads. +- Added `averageBandwidth` property to the `Quality` API. +- Added `activeQuality` property to the `MediaTrack` API. +- Deprecated `activeQualityBandwidth` property from the `MediaTrack` API, use `activeQuality` instead. To access the bandwidth value, use the `bandwidth` property of `activeQuality`. +- Added `Ad.isSlate` API to indicate whether the ad is slate or not. +- Added `playerMetrics` API with `droppedVideoFrames` property. +- Added `renderedFramerate` property to `Metrics` API. + +#### ⚡ Improvements + +- Improved ad break reporting for Google DAI by already creating an ad break when not all information is known from Google DAI. We will dispatch `UpdateAdBreakEvent` when more information is known from Google DAI. + +#### 🐛 Issues + +- Fixed an issue where the `player.muted` and `player.volume` properties were not preserved when setting a source when OptiView Ads is included. +- Fixed an issue where `player.ads.playing` would return `false` when joining a Google DAI stream in the middle of an advertisement. +- Fixed an issue where the `TextTrackListEventTypes.REMOVE_TRACK` event listener would not trigger. +- Fixed an issue where the `aspectRatio` and `videoRect` APIs were not working correctly. + +#### 👎 Deprecations + +- Deprecated return type of `metrics` API. The type will change from `Any?` to `Metrics` with the next major version. + +### Roku + +#### ✨ Features + +- Added Google DAI support for OptiView Live streams. + +## 🚀 10.2.2 (2025/10/14) + +### Web + +#### 🐛 Issues + +- Fixed an issue where the `TheoAdDescription.adTagParameters` were not used for interstitial with the `LSHAPE_CONTENT` layout on OptiView Ads. + +### Android + +#### 🐛 Issues + +- Fixed an issue where the second and following Ad breaks were not playing for Optiview Ads. + +### iOS + +#### 🐛 Issues + +- Fixed an issue where playing OptiView Streaming (THEOlive) streams could crash due to a race condition. + +## 🚀 10.2.1 (2025/10/13) + +### Web + +#### 🐛 Issues + +- Fixed an issue where the `TheoAdDescription.adTagParameters` were not used for backdrops on OptiView Ads. +- Fixed a regression in Chromium-based browsers on macOS where HESP streams would sometimes fail to start. +- Fixed an issue where the player would not play any ads after the player has errored on playing a l-shape content interstitial during native fullscreen for an OptiView Ads stream. +- Fixed an issue where the player would show a black screen during native fullscreen when the player already errored on playing a l-shape content interstitial during native fullscreen and then switched back to inline playback for an OptiView Ads stream. + +### iOS + +#### 🐛 Issues + +- Fixed an issue where the `THEOAdDescription.adTagParameters` were not used for backdrops on OptiView Ads. + +## 🚀 10.2.0 (2025/10/09) + +### Web + +#### ✨ Features + +- Added VAST ad support for Smart TVs with OptiView Ads. +- Added support for adding an authToken to OptiView live streams when casting (given that a cast receiver is used with the [useShakaForHls](https://developers.google.com/cast/docs/web_receiver/shaka_migration/) flag set). +- The [`@theoplayer/extended` package on npm](https://www.npmjs.com/package/@theoplayer/extended) now also supports OptiView Live streams. +- Added support for adTagParameters on gamProperties for Overlays and backdropURIGamProperties for backdrops on OptiView Ads. + +#### ⚡ Improvements + +- Improved the startup times on certain smart TVs. +- Improved the ABR to select higher resolutions on smart TVs whose `devicePixelRatio` is greater than `1.0`. +- `InterceptableRequest.redirect()` and `.respondWith()` now accept iterables and native `Headers` objects when replacing the request/response headers. + +#### 🐛 Issues + +- Fixed an issue where a VAST ad could be invisible in combination with OptiView Ads. +- Fixed an issue where the player shows a black screen when it tries to load an l-shape content interstitial during native fullscreen or native picture-in-picture for an OptiView Ads stream. +- Fixed an issue where the player would sometimes show a black screen instead of video while falling back on OptiView live streams. +- Fixed an issue where the seekable was not correct on certain HLS streams. +- Fixed an issue where the player would sometimes stall for a very short time on Safari right after starting playback on some HLS streams. +- Fixed an issue where old devices without WebAssembly support could not transmux MPEG-TS segments. +- Fixed an issue where an HLS live stream with a very short DVR window would stall immediately on iOS Safari when initiating playback. +- Fixed an issue where the player would not switch back to the content after playing back to back l-shape content interstitials on an OptiView Ads stream. +- Fixed an issue where OptiView live streams didn't start playing after a channel transitioned from offline to playing. + +### Android + +#### ✨ Features + +- Added `Player.poster` API for displaying the poster image in the player. +- Added `CurrentSourceChangeEvent`, which is dispatched when the player receives a new source from `SourceDescripion.sources`. +- Allow overriding `adTagParameters` for an individual overlay interstitial. + +#### ⚡ Improvements + +- Increased the maximum number of HTTP 3xx redirects to follow to 20, to align with standard browser behavior. + +#### 🐛 Issues + +- Setting `SourceDescription.poster` will now display the poster both in the player UI and when casting to Chromecast. +- Fixed an issue where live streams on Chromecast would start at the beginning of their DVR window if the current time was unknown. +- Fixed an issue for OptiView Ads where the current time was incorrect during an ad break with `DOUBLE` layout. +- Fixed an issue where the `Content-Length` header was not available in `HTTPResponse.headers` when using the new default network stack. Note that when the response body is compressed, this header will still be unavailable. +- Fixed an occasional `InterruptedException` being logged to Logcat while playing an LL-HLS stream when the `Logger.Media3` logs are enabled. +- Fixed an issue where SVG overlay images might not be visible in an OptiView Ads stream. +- Fixed a regression where `Player.readyState` was not updated while playing a Google IMA ad. +- Fixed an issue where the selected text track would get disabled on multi-period DASH streams if the codec of the text tracks between the periods were different. + +### iOS + +#### ✨ Features + +- Added `Quality` and `VideoQuality` protocols. `ActiveQualityChangedEvent` now has a `quality` property. +- Added the option to override `adTagParameters` for an individual overlay interstitial. +- Added the CurrentSourceChangeEvent, which is dispatched when the player starts playing a new source. +- Added `qualities` property to `MediaTrack`. +- The player now dispatches `EncryptedEvent` and `ContentProtectionSuccessEvent` during a DRM flow. `EncryptedEvent` indicates the start of a DRM flow, while `ContentProtectionSuccessEvent` indicates the success. Use `PlayerEventTypes.ENCRYPTED` and `PlayerEventTypes.CONTENT_PROTECTION_SUCCESS` to listen to these events. + +#### ⚡ Improvements + +- Reporting errors for THEOlive (OptiView Streaming) streams via CMCD headers + +#### 🐛 Issues + +- Fixed an issue where THEOlive (OptiView Streaming) would not start playing after coming back from the background. +- Fixed an issue where deinitializing the player during the loading of a THEOlive (OptiView Streaming) stream would cause a crash. + +### Chromecast CAF + +#### ✨ Features + +- Added support for adTagParameters on gamProperties for Overlays on OptiView Ads. + +### Roku + +#### ⚡ Improvements + +- Improved URL rewriting in `THEOM3u8TagRemover` so relative URLs that begin with a slash are handled correctly. + +## 🚀 10.1.1 (2025/09/30) + +### Web + +#### 🐛 Issues + +- Fixed an issue where the player would run into a fatal decode error on HESP streams on Chromium based browsers without hardware acceleration. + +## 🚀 10.1.0 (2025/09/24) + +### General + +#### ✨ Features + +- Added the `adTagParameters` property to OptiView `Interstitial`. + +### Web + +#### ⚡ Improvements + +- Added `segmenterror` and `manifesterror` events to be used for detecting offline status. + +#### 🐛 Issues + +- Fixed an issue where live streams on Chromecast would start at the beginning of their DVR window if the current time was unknown. +- Fixed an issue where the player would sometimes stall about 10 seconds after stream start on devices with slow appends on certain HLS streams. + +#### 👎 Deprecations + +- Deprecated the `segmentnotfound`, `manifestnotfound`, `offline`, and `online` events. Use the new `manifesterror` and `segmenterror` events to detect offline status. Use the `manifestupdate` event to detect online status. + +### Android + +#### ✨ Features + +- Added Google IMA VAST support to OptiView Ads. + +#### 🐛 Issues + +- Fixed an issue where the player would crash with an `IllegalArgumentException` when playing certain low-latency HLS streams. +- Fixed an issue where the player could stall indefinitely when enabling an embedded subtitle track containing no actual subtitles. +- Fixed an issue where some HLS streams with gzip compressed playlists failed to play when using the new default network stack on Android 14 or higher (or when using Cronet). + +### iOS + +#### 🐛 Issues + +- Fixed an issue where the quartile events would not be dispatched for OptiView Ads. +- Fixed an issue where the player would not switch to the next adbreak when playing adbreak to adbreak with OptiView Ads. +- Fixed an issue that causes a crash after listening to `TextTrackListEventTypes.ADD_TRACK` and loading webVTT subtitles in an app that is compiled using Swift 6 and is using `@preconcurrency import THEOplayerSDK`. +- Fixed an issue where Dolby OptiView Streams would crash in a rare race condition during playback. + +### Roku + +#### ✨ Features + +- Made the Conviva connector able take a new player instance after the previous instance was destroyed. +- Added `encoding_type` to custom metadata sent to Conviva. + +## 🚀 10.0.1 (2025/09/16) + +### Android + +#### 🐛 Issues + +- Fixed an issue where HTTP POST requests made by the player (such as DRM license requests) failed to be sent using the new default network stack on Android 14 or higher (or when using Cronet). +- Fixed `MillicastSource` referencing types from the native Millicast SDK that were not correctly included in the published API of the Millicast integration. + +## 🚀 10.0.0 (2025/09/12) + +### Announcing THEOplayer 10.0 + +We are happy to announce the tenth major version of THEOplayer, releasing all the improvements and developments our team has achieved since version 9.0. + +THEOplayer 10.0 includes **some breaking changes per SDK**. Please review them carefully in the respective changelog for your SDK. + +- On Android, THEOplayer now always uses the Media3 pipeline for all playback, bringing bug fixes, performance improvements and increased stability across a wider range of devices! Check out our [Media3 guide](/theoplayer/how-to-guides/android/media3/getting-started/) for more information. + +- The Android SDK will now automatically use modern network stacks with HTTP/2 and HTTP/3 support when available, optimizing media delivery to your viewers. + +- [OptiView Ads](https://optiview.dolby.com/docs/theoads/) is now fully supported on iOS. This brings our personalized advertising solution to all major platforms. + +For more info on navigating our breaking changes, take a look at our migration guides for [Web](/theoplayer/getting-started/sdks/web/migrating-to-theoplayer-10/), [Android](/theoplayer/getting-started/sdks/android/migrating-to-theoplayer-10/), [iOS](/theoplayer/getting-started/sdks/ios/migrating-to-theoplayer-10/) and [React Native](/theoplayer/getting-started/frameworks/react-native/migrating-to-react-native-theoplayer-10/). + +### Web + +#### 💥 Breaking Changes + +- Removed `AdBreakEvent.ad`, use `AdBreakEvent.adBreak` instead. +- Removed `THEOplayerAdDescription` type, use `CsaiAdDescription` instead. +- Removed `WebVTTRegion.identifier`, use `WebVTTRegion.id` instead. +- Removed `PlayerConfiguration.vr`. This configuration was already ignored since version 9.0.0, because the player always uses WebXR. + - Note that `SourceDescription.vr` is not affected, and is still required to play a virtual reality source. +- Removed `MediaTailorSource.adParams`, use `MediaTailorSource.adsParams` instead. +- Removed `PlayerConfiguration.verizonMedia`, use `PlayerConfiguration.uplynk` instead. +- Removed `'verizon-media'` as a valid source integration ID for Uplynk sources (previously Verizon Media). Uplynk sources must now have their `integration` set to `'uplynk'` instead. +- Removed THEOlive publication events (`publicationloadstart`, `publicationloaded` and `publicationoffline`), use the equivalent distribution events instead (`distributionloadstart`, `endpointloaded` and `distributionoffline` respectively). +- Enabled `GoogleImaConfiguration.useAdUiElementForSsai` by default, allowing Google DAI to show additional ad UI elements on top of the player if needed (such as a skip button for skippable ads). +- Removed support for THEOlive sources using `source.integration = 'theolive'`. THEOlive sources must now have their `type` set to `'theolive'` instead. + +### Android + +#### 💥 Breaking Changes + +- Updated `minSdk` to API 23 ("Marshmallow"). This aligns with [other Android Jetpack libraries requiring API 23 as of June 2025](https://developer.android.com/jetpack/androidx/versions#version-table). +- Updated to target Kotlin 2.0 language level, to [align with AndroidX Core 1.17.0](https://developer.android.com/jetpack/androidx/releases/core#core_and_core-ktx_version_117_2). This requires Kotlin Gradle Plugin 2.0.0 or newer. +- Removed support for the legacy playback pipeline (using `TypedSource.playbackPipeline = PlaybackPipeline.LEGACY`). The player will now always use the Media3 playback pipeline. + - This brings down the `.aar` size of the Core SDK from ~33 MB to ~2 MB (excluding dependencies). +- Removed support for the legacy cache backend (using `CachingParameters.storageType = CacheStorageType.LEGACY`). All caching tasks will now use the Media3 cache backend, and any previously cached streams that used the legacy backend will need to be re-downloaded. +- Changed `NetworkConfiguration.useHttpEngine` to be enabled by default, allowing the player to switch to a modern network stack with HTTP/2 and HTTP/3 support if available. +- Removed unused `GoogleDaiConfiguration.format`. +- Removed `MediaTailorSource.adParams`, use `MediaTailorSource.adsParams` instead. +- Removed the `DashPlaybackConfiguration.ignoreAvailabilityWindow()` method, use the `.ignoreAvailabilityWindow` property instead. +- Removed `KeySystemConfiguration.isUseCredentials`, use `KeySystemConfiguration.useCredentials` instead. +- Removed `ConaxDRMConfiguration.Builder.fairPlay()`, use `ConaxDRMConfiguration.Builder.fairplay()` instead. +- Removed THEOlive publication events (`PublicationLoadStartEvent`, `PublicationLoadedEvent` and `PublicationOfflineEvent`), use the equivalent distribution events instead (`DistributionLoadStartEvent`, `EndpointLoadedEvent` and `DistributionOfflineEvent` respectively). +- Removed `THEOplayerGlobal.playbackSettings`. This API is not supported in the Media3 playback pipeline. +- Removed `SourceChangeEvent.playbackPipeline`. + +#### 🐛 Issues + +- Fixed an issue where a THEOlive stream would not start playing on `play()` after first playing a different stream. + +### iOS + +#### 💥 Breaking Changes + +- In an effort to align with the changes made by Apple regarding the [App Store publishing policy](https://developer.apple.com/news/upcoming-requirements/?id=02212025a), starting from THEOplayer 10.0 we will distribute our SDK builds using Xcode 16. Effectively, this means that developing a client application using THEOplayer iOS/tvOS SDK will require a minimum version of Xcode 16. +- Removed the flag `useLegacyPlaybackEngine` in the initializer of `THEOliveConfiguration`. +- Removed THEOlive publication events (`PublicationLoadStartEvent`, `PublicationLoadedEvent` and `PublicationOfflineEvent`), use the equivalent distribution events instead (`DistributionLoadStartEvent`, `EndpointLoadedEvent` and `DistributionOfflineEvent` respectively). +- Removed the `destroy` method. Instead, destroy the player by removing its reference `self.player = nil`. +- Removed the `set` from the subscript of the `TextTrackList` API. The `TextTrackList` is a read-only list. + +#### ✨ Features + +- Added Google IMA VAST support to OptiView Ads. + +### Roku + +#### 💥 Breaking Changes + +- Removed the `getHeader` method from the Network API in favor of the new `getHeaders` method. + +#### ⚡ Improvements + +- Added the `getHeaders` method to Network API. +- Added protection against race conditions during destruction of the player. diff --git a/theoplayer_versioned_docs/version-v10/chromecast/index.mdx b/theoplayer_versioned_docs/version-v10/chromecast/index.mdx new file mode 100644 index 000000000000..393f11623dc9 --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/chromecast/index.mdx @@ -0,0 +1,13 @@ +--- +displayed_sidebar: chromecast +sidebar_label: Introduction +sidebar_position: 1 +--- + +# THEOplayer Chromecast SDK + +import Intro from '../shared/_intro.mdx'; +import SidebarDocCardList from '@site/src/components/SidebarDocCardList'; + + + diff --git a/theoplayer_versioned_docs/version-v10/connectors/android/index.mdx b/theoplayer_versioned_docs/version-v10/connectors/android/index.mdx new file mode 100644 index 000000000000..89d8a57cd415 --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/connectors/android/index.mdx @@ -0,0 +1,11 @@ +--- +sidebar_position: 0 +sidebar_label: Overview +pagination_label: Android Connectors +--- + +# Connectors for THEOplayer Android SDK + +import DocCardList from '@theme/DocCardList'; + + diff --git a/theoplayer_versioned_docs/version-v10/connectors/index.mdx b/theoplayer_versioned_docs/version-v10/connectors/index.mdx new file mode 100644 index 000000000000..6dcfe4206687 --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/connectors/index.mdx @@ -0,0 +1,47 @@ +--- +displayed_sidebar: web +--- + +# Connectors for THEOplayer + + + + + +import DocCardList from '@theme/DocCardList'; +import useBaseUrl from '@docusaurus/useBaseUrl'; + + diff --git a/theoplayer_versioned_docs/version-v10/connectors/ios/index.mdx b/theoplayer_versioned_docs/version-v10/connectors/ios/index.mdx new file mode 100644 index 000000000000..d8a198e19019 --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/connectors/ios/index.mdx @@ -0,0 +1,11 @@ +--- +sidebar_position: 0 +sidebar_label: Overview +pagination_label: iOS & tvOS Connectors +--- + +# Connectors for THEOplayer iOS & tvOS SDK + +import DocCardList from '@theme/DocCardList'; + + diff --git a/theoplayer_versioned_docs/version-v10/connectors/react-native/index.mdx b/theoplayer_versioned_docs/version-v10/connectors/react-native/index.mdx new file mode 100644 index 000000000000..31b96d4a99fe --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/connectors/react-native/index.mdx @@ -0,0 +1,11 @@ +--- +sidebar_position: 0 +sidebar_label: Overview +pagination_label: React Native Connectors +--- + +# Connectors for THEOplayer React Native SDK + +import DocCardList from '@theme/DocCardList'; + + diff --git a/theoplayer_versioned_docs/version-v10/connectors/roku/adobe-edge/01-getting-started-aep-connector.mdx b/theoplayer_versioned_docs/version-v10/connectors/roku/adobe-edge/01-getting-started-aep-connector.mdx new file mode 100644 index 000000000000..113b1b366aa6 --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/connectors/roku/adobe-edge/01-getting-started-aep-connector.mdx @@ -0,0 +1,107 @@ +--- +sidebar_label: Getting started +sidebar_custom_props: { icon: '🚀' } +--- + +# Getting started with the Adobe Edge Connector for the Roku SDK + +Here's how to get started integrating the Adobe Edge Connector with the THEOplayer Roku SDK. + +## Prerequisites + +In order to set up the Adobe Edge Connector in your Roku application, you'll need the following: + +- Your Adobe Edge domain and config ID (also known as data stream ID) +- An app with the THEOPlayer SDK for Roku already integrated, see our [Getting Started guide](https://www.theoplayer.com/docs/theoplayer/getting-started/sdks/roku/getting-started/). + +## Integration + +1. First you must download the THEO Adobe Edge Connector as a component library. Add a ComponentLibrary node to your MainScene.brs file, giving it an id of `THEOAEPConnector` and providing the URI for the THEOAEPConnector.pkg. Replace the `{SDK_VERSION}` tag with the version of the THEO Roku SDK you're using. The earliest version of the connector is 9.2.0: + +```xml + +``` + +2. Then in the Brightscript file for your MainScene, listen for the loading of the ComponentLibrary to complete by observing the `loadStatus` field. + +```brightscript +sub Init() + THEOAEPNode = m.top.findNode("THEOAEPConnector") + THEOAEPNode.observeField("loadStatus", "onLibraryLoadStatusChanged") +end sub + +sub onLibraryLoadStatusChanged(event as object) + THEOAEPNode = event.getROSGNode() + + if THEOAEPNode = invalid + return + end if + + if THEOAEPNode.loadStatus = "ready" + ' Success + else if THEOAEPNode.loadStatus = "failed" + ? "Failed to load component library, please check URL. "; THEOAEPNode.uri + end if +end sub +``` + +3. Add the THEOAEPConnector component to the SceneGraph file where your THEOPlayer is defined + +```xml + + +``` + +4. Then in the Brightscript file, configure the connector by calling the configure method, passing the player instance and your Adobe Edge configuration. + +```brightscript +m.player = m.top.findNode("THEOPlayer") +m.aepConnector = m.top.findNode("THEOAEPConnector") +aepConfig = { + configId: "", + domainName: "", + mediaChannel: "My Channel", + mediaPlayerName: "My Player", + mediaAppVersion: "1.0", + logLevel: 3 +} +m.aepConnector.callFunc("configure", m.player, aepConfig) +``` + +5. Next, when you start playing the asset, call the `startSession` method and pass it the session details for the asset you're playing. You may also include an optional session configuration: + +```brightscript +m.player.source = sourceDescription + +aepSessionConfig = {} +aepSessionConfig["config.channel"] = "My Channel" +aepSessionConfig["config.adpinginterval"] = 5 +aepSessionConfig["config.mainpinginterval"] = 30 + +aepSessionDetails = { + name: "my-asset-id", + friendlyName: sourceDescription.title, + contentType: "video", + streamType: "vod", + length: 300, + customMetadata: { + key1: "value1", + key2: "value2", + } +} +m.aepConnector.callFunc("startSession", aepSessionDetails, aepSessionConfig) +``` + +See the [API documentation](https://github.com/adobe/aepsdk-roku/blob/main/Documentation/api-reference.md) for more on how to structure the data for Adobe Edge. + +6. When the video has stopped playing because it ended or the user exited, end the Adobe Edge session. + `m.aepConnector.callFunc("endSession")` +7. If you are exiting the player screen altogether, and destroying the player, make sure to destroy the connector at the same time, but before calling destroy on the SDK: + +```brightscript +m.aepConnector.callFunc("destroy") +m.aepConnector = invalid + +m.player.callFunc("destroy") +m.player = invalid +``` diff --git a/theoplayer_versioned_docs/version-v10/connectors/roku/adobe-edge/02-API-reference.mdx b/theoplayer_versioned_docs/version-v10/connectors/roku/adobe-edge/02-API-reference.mdx new file mode 100644 index 000000000000..0f74c9945344 --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/connectors/roku/adobe-edge/02-API-reference.mdx @@ -0,0 +1,133 @@ +--- +sidebar_label: API reference +sidebar_custom_props: { icon: '*️⃣' } +--- + +# Adobe Edge Platform Connector API + +The attributes, methods and events for the THEOAEPConnector. + +## Attributes + +| Name | Type | Default | Access Permission | Description | +| ------------ | ---------------- | ---------------- | ----------------- | ---------------------------------------- | +| id | string | | read,write | The id of the node. | +| ecid | string | invalid | read | User's Experience Cloud ID. | +| MEDIA_EVENTS | associativeArray | AEP Media Events | read | Constant with the AEP media event enums. | + +## Methods + +| Method | Params | Description | +| ---------------------- | ---------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| configure | player: THEOplayer, configuration: THEOAEPConfiguration | Adds the THEOplayer instance to monitor, and applies a configuration to the AEP SDK. | +| destroy | none | Destroy the connector. It also ends the current session, if any. | +| endSession | none | End the current AEP session, but do not destroy the connector. | +| getExperienceCloudId | none | Retrieves the ECID for the user. The ECID will be added to the `ecid` field on the connector once it has been retrieved. | +| resetIdentities | none | Resets the identities used in the SDK for the user. | +| sendMediaEvent | eventXDM: AssociativeArray | Send a media event to AEP. | +| setContentInfo | contentMetadata: AssociativeArray | Sets or updates the content metadata for the current session. Partials are supported and will be merged with the existing content metadata. See below for the schema of content metadata. | +| setExperienceCloudId | ecid: string | Sets a pre-existing ECID for the user on the SDK. | +| startSession | sessionDetails: THEOAEPMediaSessionDetails, sessionConfig: (optional) object | Starts a AEP session with the supplied session details and optional config. See below for the schema of details and config. | +| stopAndStartNewSession | sessionDetails: THEOAEPMediaSessionDetails, sessionConfig: (optional) object | Stops the existing session if any. Starts a AEP session with the supplied session details and optional config. See below for the schema of details and config. | + +### AEP Connector Config + +The configuration the AEP connector is the THEOConnectorConfiguration interface. + +```brightscript +configuration = { + configId: "", + domainName: "", + mediaChannel: "My Channel", + mediaPlayerName: "My Player", + mediaAppVersion: "1.0.0" + logLevel: 3 +} +``` + +The `logLevel` property is optional. The accepted values are (VERBOSE: `0`, DEBUG: `1`, INFO: `2`, WARNING: `3`, ERROR: `4`). + +### Session Details and Config + +The session details and session config control the metadata for the session you're starting. See the [AEP SDK documentation](https://github.com/adobe/aepsdk-roku/blob/main/Documentation/api-reference.md#createMediaSession) for expected values. The `customMetadata` property is optional. Values on that object must be strings. + +#### THEOAEPMediaSessionDetails + +```brightscript +aepSessionDetails = { + streamType: "vod" + friendlyName: "My Asset", + name: "my-media-id", + length: 596, + contentType: "video", + customMetadata: { + key1: "value1", + key2: "value2" + } +} +``` + +#### Session Config + +The optional session config should follow the schema described in the [AEP SDK documentation](https://github.com/adobe/aepsdk-roku/blob/main/Documentation/api-reference.md#createMediaSession). + +```brightscript +aepSessionConfig = {} +aepSessionConfig["config.channel"] = "My Channel" +aepSessionConfig["config.adpinginterval"] = 5 +aepSessionConfig["config.mainpinginterval"] = 30 +``` + +### Getting the Experience Cloud ID + +To get an ECID for a user, you'll need to observe the `ecid` field on the connector, and then call `getExperienceCloudId` on the connector. The field will update with the ECID when it is available and trigger your observer. + +```brightscript +m.aepConnector.observeField("ecid", "onEcidChange") + +sub onEcidChange( event as object ) + m.myEcid = event.getData() +end sub + +m.aepConnector.callFunc("getExperienceCloudId") +``` + +### Reusing an existing AEP SDK library + +The AEP SDK allows you to reuse instances of the SDK in case you're already using the AEP SDK in your application. This is done by adding a Task node to the scene. The THEO AEP Connector can reuse this Task node. In the MainScene.brs: + +```brightscript +m.aepSDK = AdobeAEPSDKInit() +m.top.appendChild(m.aepSDK.getTaskNode()) +``` + +As long as the task node is on the Scene before the connector is configured, the THEO AEP connector can pick up the AEP Task node and reuse it. + +### Supported media events + +The THEO AEP Connector will automatically detect most media events and send them to AEP for you, including player commands such as play or pause and events like bitrate change. It will not send media events related to chapters in this version: + +- `media.chapterStart` +- `media.chapterComplete` +- `media.chapterSkip` + +For these you may use the `sendMediaEvent` method and construct your own XDM payload: + +```brightscript +chapterStartXDM = { + "xdm": { + "eventType": m.aepConnector.MEDIA_EVENTS.CHAPTER_START + "mediaCollection": { + "playhead": m.theoPlayer.currentTime, + "chapterDetails": { + "friendlyName": "My Chapter", + "index": 1, + "length": 300, + "offset": 0 + } + } + } +} + +m.aepConnector.callFunc("sendMediaEvent", chapterStartXDM) +``` diff --git a/theoplayer_versioned_docs/version-v10/connectors/roku/comscore/01-getting-started-comscore-connector.mdx b/theoplayer_versioned_docs/version-v10/connectors/roku/comscore/01-getting-started-comscore-connector.mdx new file mode 100644 index 000000000000..2a627bc96ca2 --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/connectors/roku/comscore/01-getting-started-comscore-connector.mdx @@ -0,0 +1,120 @@ +--- +sidebar_label: Getting started +sidebar_custom_props: { icon: '🚀' } +--- + +# Getting started with the Comscore Connector for the Roku SDK + +Here's how to get started integrating the Comscore Connector with the THEOplayer Roku SDK. + +## Prerequisites + +In order to set up the Comscore Connector in your Roku application, you'll need the following: + +- Your Comscore publisher ID and publisher secret (available in your Comscore Direct dashboard under Mobile Apps > Get Tag). +- An app with the THEOPlayer SDK for Roku already integrated, see our [Getting Started guide](https://www.theoplayer.com/docs/theoplayer/getting-started/sdks/roku/getting-started/). + +## Integration + +1. First you must download the THEO Comscore Connector as a component library. Add a ComponentLibrary node to your MainScene.brs file, giving it an id of `THEOComscoreConnector` and providing the URI for the THEOComscoreConnector.pkg. Replace the `{SDK_VERSION}` tag with the version of the THEO Roku SDK you're using. The earliest version of the connector is 1.5.0: + +```xml + +``` + +2. Then in the Brightscript file for your MainScene, listen for the loading of the ComponentLibrary to complete by observing the `loadStatus` field. + +```brightscript +sub Init() + THEOComscoreNode = m.top.findNode("THEOComscoreConnector") + THEOComscoreNode.observeField("loadStatus", "onLibraryLoadStatusChanged") +end sub + +sub onLibraryLoadStatusChanged(event as object) + THEOComscoreNode = event.getROSGNode() + + if THEOComscoreNode = invalid + return + end if + + if THEOComscoreNode.loadStatus = "ready" + ' Success + else if THEOComscoreNode.loadStatus = "failed" + ? "Failed to load component library, please check URL. "; THEOComscoreNode.uri + end if +end sub +``` + +3. Add the THEOComscoreConnector component to the SceneGraph file where your THEOPlayer is defined + +```xml + + +``` + +4. Then configure the connector by calling the configure method, passing the player instance and your Comscore customer key. + +```brightscript +m.player = m.top.findNode("THEOplayer") +m.comscoreConnector = m.top.findNode("THEOComscoreConnector") +m.comscoreConnector.callFunc("configure", m.player, { publisherId: "MY_PUBLISHER_ID", publisherSecret: "MY_PUBLISHER_SECRET", applicationName: "MY_APPLICATION_NAME"}) +``` + +5. Next, when you start playing the asset, call the `startSession` method and pass it the content metadata for the asset you're playing: + +```brightscript +m.player.source = sourceDescription +contentMetadata = { + adLoadFlag: false, + assetId: "myAssetId", + c3: "Arbitrary C3 value", + c4: "*null", + c6: "*null", + clipLength: 600, + completeEpisodeFlag: true, + contentGenre: "Sports", + digitalAirDate: "2025-03-04", + episodeNumber: "59", + episodeSeasonNumber: "5", + episodeTitle: "The Game Last Night", + programTitle: "The Sports Show", + publisherBrandName: "Sports Publisher Network", + stationTitle: "KXYZ", + tvAirDate: "2025-03-04" +} +m.comscoreConnector.callFunc("startSession", contentMetadata) +``` + +See the [API documentation](https://www.theoplayer.com/docs/theoplayer/connectors/roku/comscore/API-reference/) for more on how to structure the content metadata for Comscore. + +6. Comscore requests a call to their `tick` method when the main event loop executes. If you update a global field called `tccTick`, the THEOComscoreConnector will automatically observe that field and call `tick` for you. Otherwise, you can manually call the `sendTick` method on the THEOComscoreConnector. + +```brightscript +m.global.addField("tccTick", "integer", false) +m.global.tccTick = 0 + +while true + m.global.tccTick = m.global.tccTick + 1 + msg = wait(1000, m.port) + msgType = type(msg) + if msgType = "roSGScreenEvent" + if msg.isScreenClosed() then return + end if +end while +``` + +NOTE: the `wait` method is running for 1000ms here, making the `tccTick` field get updated every second. Setting it to 0ms will cause the `tccTick` field to not get updated regularly. + +7. If the content metadata needs to change, you can update it by calling `update`. This method accepts partial content metadata: + `m.comscoreConnector.callFunc( "update", contentMetadata)` +8. When the video has stopped playing because it ended or the user exited, end the Comscore session + `m.comscoreConnector.callFunc("endSession")` +9. If you are exiting the player screen altogether, and destroying the player, make sure to destroy the connector at the same time, but before calling destroy on the SDK: + +```brightscript +m.comscoreConnector.callFunc("destroy") +m.comscoreConnector = invalid + +m.player.callFunc("destroy") +m.player = invalid +``` diff --git a/theoplayer_versioned_docs/version-v10/connectors/roku/comscore/02-API-reference.mdx b/theoplayer_versioned_docs/version-v10/connectors/roku/comscore/02-API-reference.mdx new file mode 100644 index 000000000000..53b3e5d00951 --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/connectors/roku/comscore/02-API-reference.mdx @@ -0,0 +1,121 @@ +--- +sidebar_label: API reference +sidebar_custom_props: { icon: '*️⃣' } +--- + +# Comscore Connector API Reference + +The attributes, methods and events for the THEOComscoreConnector. + +## Attributes + +| Name | Type | Default | Access Permission | Description | +| ----------- | ---------------- | -------------------- | ----------------- | -------------------------------------------- | +| id | string | | read,write | The id of the node. | +| MEDIA_TYPES | associativeArray | Comscore Media Types | read | Constant with the Comscore media type enums. | +| AD_TYPES | associativeArray | Comscore Ad Types | read | Constant with the Comscore ad type enums. | + +## Methods + +| Method | Params | Description | +| -------------------- | ------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | +| configure | player: THEOplayer, configuration: THEOConnectorConfiguration, metadata: (optional) THEOComscoreReadableMetadata or THEOComscoreTagMetadata | Add a player to monitor, configure the Comscore SDK, and also pass in optional metadata for your content. | +| destroy | none | Destroy the connector. It also ends the current session, if any. | +| endSession | none | End the current Comscore session, but do not destroy the connector. | +| update | metadata: THEOComscoreReadableMetadata or THEOComscoreTagMetadata | Updates the content metadata for the current session. | +| sendTick | none | Sends a tick to Comscore. This is only needed if you do not implement the `tccTick` field in your main event loop. | +| startSession | mediaType: string, metadata: (optional) THEOComscoreReadableMetadata or THEOComscoreTagMetadata | Starts a Comscore streaming session with the specified media type, and optionally applies the content metadata. If not passing content metadata, you will need to add it separately with the `update` method before calling `startSession` | +| reportPlaybackEvent | eventType: string, eventDetail: AssociativeArray | Reports a playback event with the associated data to Comscore. | +| reportPlaybackFailed | errorMessage: string | Reports a playback failure to Comscore. | +| setAdInfo | adInfo: AssociativeArray | Sets the supplied ad info to Comscore. adInfo should be in the form of ComscoreContentInfo | +| setContentInfo | contentMetadata: AssociativeArray | Sets or updates the content metadata for the current session. Partials are supported and will be merged with the existing content metadata. See below for the schema of content metadata. | +| startSession | contentMetadata: AssociativeArray | Starts a Comscore session with the supplied content metadata. See below for the schema of content metadata. | + +### Comscore Config + +The configuration the Comscore connector is the THEOConnectorConfiguration interface. + +```brightscript +configuration = { + publisherId: "MY_PUBLISHER_ID", + publisherSecret: "MY_PUBLISHER_SECRET", + applicationName: "MY_APPLICATION_NAME" +} +``` + +The `applicationName` property is optional. If omitted, Comscore will automatically collect it from the manifest file. + +To get your publisher ID and secret, log into your Comscore account. Go to the Direct dashboard, and switch to the Mobile App tab. Then click the Get Tag button, and a dialog should show with the ID and secret in it. + +### Content Metadata + +Content metadata should be an AssociativeArray following Comscore's schema for streaming tags. However, the THEOComscoreConnector also will accept a more human readable format. These are in the THEOComscoreReadableMetadata and THEOComscoreTagMetadata interfaces. NOTE: if you omit a string value, replace it with `"*null"`, which is the value requested by Comscore for empty fields. + +#### THEOComscoreReadableMetadata + +```brightscript +comscoreMetadata = { + adLoadFlag: false, + assetId: "myAssetId", + c3: "Arbitrary C3 value", + c4: "*null", + c6: "*null", + clipLength: 600, + completeEpisodeFlag: true, + contentGenre: "Sports", + digitalAirDate: "2025-03-04", + episodeNumber: "59", + episodeSeasonNumber: "5", + episodeTitle: "The Game Last Night", + programTitle: "The Sports Show", + publisherBrandName: "Sports Publisher Network", + stationTitle: "KXYZ", + tvAirDate: "2025-03-04" +} +``` + +#### THEOComscoreTagMetadata + +NOTE: all values must be strings for this object, with Booleans being represented as `"0"` and `"1"`. + +```brightscript +comscoreMetadata = { + ns_st_ia: "0", + ns_st_ci: c3.cm.id, + c3: "Arbitrary C3 value", + c4: "*null", + c6: "*null", + ns_st_cl: "600", + ns_st_ce: "1", + ns_st_cg: "Sports", + ns_st_ddt: "2025-03-04", + ns_st_en: "59", + ns_st_sn: "5", + ns_st_ep: "The Game Last Night", + ns_st_pr: "The Sports Show", + ns_st_pu: "Sports Publisher Network", + ns_st_st: "KXYZ", + ns_st_tdt: "2025-03-04" +} +``` + +### Sending Ticks + +Comscore wants a tick to be sent to it on every run of the main event loop. You can do this manually by calling the `sendTick` method on the THEOComscoreConnector: +`m.comscoreConnector.callFunc("sendTick")` + +However, if you want to have the connector automatically send the tick for you, in your `main.brs` file, add an integer field to the global node called `tccTick`. Set it equal to 0 and then increment it on each run of your event loop. Note that the `wait` line will make it run every 1000 milliseconds. + +```brightscript +m.global.addField("tccTick", "integer", false) +m.global.tccTick = 0 + +while true + m.global.tccTick = m.global.tccTick + 1 + msg = wait(1000, m.port) + msgType = type(msg) + if msgType = "roSGScreenEvent" + if msg.isScreenClosed() then return + end if +end while +``` diff --git a/theoplayer_versioned_docs/version-v10/connectors/roku/conviva/01-getting-started-conviva-connector.mdx b/theoplayer_versioned_docs/version-v10/connectors/roku/conviva/01-getting-started-conviva-connector.mdx new file mode 100644 index 000000000000..56c427c8b5f3 --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/connectors/roku/conviva/01-getting-started-conviva-connector.mdx @@ -0,0 +1,96 @@ +--- +sidebar_label: Getting started +sidebar_custom_props: { icon: '🚀' } +--- + +# Getting started with the Conviva Connector for the Roku SDK + +Here's how to get started integrating the Conviva Connector with the THEOplayer Roku SDK. + +## Prerequisites + +In order to set up the Conviva Connector in your Roku application, you'll need the following: + +- Your Conviva customer key (available in your Conviva Pulse dashboard) +- An app with the THEOPlayer SDK for Roku already integrated, see our [Getting Started guide](https://www.theoplayer.com/docs/theoplayer/getting-started/sdks/roku/getting-started/). +- Optionally for debug and testing, your Conviva Touchstone gateway URL, which should be in the format of `"https://MY_TOUCHSTONE_DOMAIN.ts-testonly.conviva.com/"` + +## Integration + +1. First you must download the THEO Conviva Connector as a component library. Add a ComponentLibrary node to your MainScene.brs file, giving it an id of `THEOConvivaConnector` and providing the URI for the THEOConvivaConnector.pkg. Replace the `{SDK_VERSION}` tag with the version of the THEO Roku SDK you're using. The earliest version of the connector is 1.5.0: + +```xml + +``` + +2. Then in the Brightscript file for your MainScene, listen for the loading of the ComponentLibrary to complete by observing the `loadStatus` field. + +```brightscript +sub Init() + THEOConvivaNode = m.top.findNode("THEOConvivaConnector") + THEOConvivaNode.observeField("loadStatus", "onLibraryLoadStatusChanged") +end sub + +sub onLibraryLoadStatusChanged(event as object) + THEOConvivaNode = event.getROSGNode() + + if THEOConvivaNode = invalid + return + end if + + if THEOConvivaNode.loadStatus = "ready" + ' Success + else if THEOConvivaNode.loadStatus = "failed" + ? "Failed to load component library, please check URL. "; THEOConvivaNode.uri + end if +end sub +``` + +3. Add the THEOConvivaConnector component to the SceneGraph file where your THEOPlayer is defined + +```xml + + +``` + +4. Then in the Brightscript file, configure the connector by calling the configure method, passing the player instance and your Conviva customer key. + +```brightscript +m.player = m.top.findNode("THEOPlayer") +m.convivaConnector = m.top.findNode("THEOConvivaConnector") +m.convivaConnector.callFunc("configure", m.player, "MY_CUSTOMER_KEY") +``` + +NOTE: that if you want to debug first and use Conviva's Touchstone service to validate your integration, you can include the gateway URL and a debug parameter in the configure call: +`m.convivaConnector.callFunc("configure", m.player, "MY_CUSTOMER_KEY", "MY_TOUCHSTONE_GATEWAY_URL", true)` + +5. Next, when you start playing the asset, call the `startSession` method and pass it the content metadata for the asset you're playing: + +```brightscript +m.player.source = sourceDescription +contentMetadata = { + defaultReportingResource: "MyCDN", + playerName: "My Player", + assetName: "My Asset Name", + encodedFramerate: 24 +} +m.convivaConnector.callFunc("startSession", contentMetadata) +``` + +See the [API documentation](https://www.theoplayer.com/docs/theoplayer/connectors/roku/conviva/API-reference/) for more on how to structure the content metadata for Conviva. + +6. If you desire to monitor for CDN changes, you can optionally add a configuration for that after starting the session. + `m.convivaConnector.callFunc("monitorCdnChanges", { mycdn: ["my-cdn.net"], theo: ["cdn.theoplayer.com"] })` +7. If the content metadata needs to change, you can update it by calling `setContentInfo`. This method accepts partial content metadata: + `m.convivaConnector.callFunc( "setContentInfo", {assetName: "New Program"})` +8. When the video has stopped playing because it ended or the user exited, end the Conviva session + `m.convivaConnector.callFunc("endSession")` +9. If you are exiting the player screen altogether, and destroying the player, make sure to destroy the connector at the same time, but before calling destroy on the SDK: + +```brightscript +m.convivaConnector.callFunc("destroy") +m.convivaConnector = invalid + +m.player.callFunc("destroy") +m.player = invalid +``` diff --git a/theoplayer_versioned_docs/version-v10/connectors/roku/conviva/02-API-reference.mdx b/theoplayer_versioned_docs/version-v10/connectors/roku/conviva/02-API-reference.mdx new file mode 100644 index 000000000000..d235c72df298 --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/connectors/roku/conviva/02-API-reference.mdx @@ -0,0 +1,94 @@ +--- +sidebar_label: API reference +sidebar_custom_props: { icon: '*️⃣' } +--- + +# Conviva Connector API reference + +The attributes, methods and events for the THEOConvivaConnector. + +## Attributes + +| Name | Type | Default | Access Permission | Description | +| ---- | ------ | ------- | ----------------- | ------------------- | +| id | string | | read, write | The ID of this node | + +## Methods + +| Method | Params | Description | +| ---------------------- | ------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| configure | player: THEOplayer, customerKey: string, gatewayUrl: string (Optional), debug: boolean (Optional) | Configure the Conviva SDK for use. The `gatewayUrl` param is the URL for the Touchstone service for use in validating your Conviva integration. Omit this for production builds. | +| destroy | none | Destroy the connector. It also ends the current session, if any. | +| endSession | none | End the current Conviva session, but do not destroy the connector. | +| getContentInfo | none | Returns the content metadata for the current session. | +| monitorCdnChanges | mappings: CDNMonitoringConfig, defaultCdn: string (optional) | Updates the CDN monitoring settings. If passed a CDN monitoring config (see below), it will begin monitoring the downloaded segments for changes in CDN. This will update the defaultReportingResource for the current session if a CDN change is detected If passed invalid as the first parameter, it will stop the monitoring and use any string passed as the second param as the defaultReportingResource. | +| reportPlaybackEvent | eventType: string, eventDetail: AssociativeArray | Reports a playback event with the associated data to Conviva. | +| reportPlaybackFailed | errorMessage: string | Reports a playback failure to Conviva. | +| setAdInfo | adInfo: AssociativeArray | Sets the supplied ad info to Conviva. adInfo should be in the form of ConvivaContentInfo | +| setContentInfo | contentMetadata: AssociativeArray | Sets or updates the content metadata for the current session. Partials are supported and will be merged with the existing content metadata. See below for the schema of content metadata. | +| startSession | contentMetadata: AssociativeArray | Starts a Conviva session with the supplied content metadata. See below for the schema of content metadata. | +| stopAndStartNewSession | contentMetadata: AssociativeArray | Stops the existing Conviva session and starts a new one with the supplied content metadata. See below for the schema of content metadata. | + +### DPI Methods + +The THEO Conviva Connector now exposes methods for Conviva DPI (Digital Product Insights) integration that the application can use to report application level analytics. If you are using Conviva for both DPI and Video, call `configureDPI` first for application analytics, then call `configure` when you have access to the player. In depth documentation for the parameters passed to these methods is provided in the (Conviva DPI Integration guide)[https://pulse.conviva.com/learning-center/content/sensor_developer_center/sensor_integration/roku/roku_stream_sensor.htm#ConvivaDPISensorIntegrationforRoku]: + +| Method | Params | Description | +| ------------------- | -------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | +| configureDPI | appId: string, customerKey: string, gatewayUrl: string (Optional), debug: boolean (Optional) | Configure the Conviva SDK for use for Conviva DPI. The `gatewayUrl` param is the URL for the Touchstone service for use in validating your Conviva integration. Omit this for production builds. | +| setUserId | userId: string | Set the user ID for this DPI session. | +| setChannelInfo | channelInfo: assocarray | Set the channel load times for this DPI session. | +| trackCustomEvent | eventName: string, eventData: assocarray | Report a custom DPI event to Conviva. | +| trackClick | clickDetails: assocarray | Report a click event. | +| trackAppError | error: assocarray | Report an application error. | +| trackNetworkRequest | requestDetails: assocarray | Report the stats for a network request. | +| setCustomTags | customTags: assocarray | Add custom tags to this DPI session. | +| unsetCustomTags | customTags: array of strings | Remove custom tags from this DPI session. | + +### CDN Monitoring Config + +The configuration for CDN monitoring should be an AssociativeArray with keys that are the name of the CDN and values that are arrays of strings to search for in segment URLs. + +```brightscript +cdnMappings = { + akamai: ["akamaized.net"], + theo: ["dev.theoads.live", "cdn.theoplayer.com"] + level3: ["llnw.com"] +} +``` + +Passing a config as the only param will start CDN change monitoring with the provided configuration, or update the config if it is already started. +`m.theoConvivaConnector.callFunc("monitorCDNChanges", cdnMappings)` +However, if you want to stop CDN change monitoring, pass `invalid` as the first parameter, and the string you want to use for the defaultReportingResource as the second parameter. +`m.theoConvivaConnector.callFunc("monitorCDNChanges", invalid, "theo")` + +### Content Metadata + +Content metadata should be an AssociativeArray following [Conviva's schema](https://pulse.conviva.com/learning-center/content/sensor_developer_center/sensor_integration/roku/roku_stream_sensor.htm#PredefinedVideoandContentMetadata). +However, the THEOConviaConnector does provide a shortcut for c3 data. You may specify the c3 data by its full name: + +```brightscript +contentMetadata = { + customMetadata: { + myCustomTag: "Value", + "c3.cm.contentType": "DVR", + "c3.cm.name": "CMS" + } +} +``` + +However, we also support using an object notation: + +```brightscript +contentMetadata = { + customMetadata: { + myCustomTag: "Value", + c3: { + cm: { + contentType: "DVR", + name: "CMS" + } + } + } +} +``` diff --git a/theoplayer_versioned_docs/version-v10/connectors/roku/index.mdx b/theoplayer_versioned_docs/version-v10/connectors/roku/index.mdx new file mode 100644 index 000000000000..e217fc58c7b8 --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/connectors/roku/index.mdx @@ -0,0 +1,11 @@ +--- +sidebar_position: 0 +sidebar_label: Overview +pagination_label: Roku Connectors +--- + +# Connectors for THEOplayer Roku SDK + +import DocCardList from '@theme/DocCardList'; + + diff --git a/theoplayer_versioned_docs/version-v10/connectors/roku/mux/01-getting-started-mux-connector.mdx b/theoplayer_versioned_docs/version-v10/connectors/roku/mux/01-getting-started-mux-connector.mdx new file mode 100644 index 000000000000..4e9f4cff527d --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/connectors/roku/mux/01-getting-started-mux-connector.mdx @@ -0,0 +1,104 @@ +--- +sidebar_label: Getting started +sidebar_custom_props: { icon: '🚀' } +--- + +# Getting started with the Mux Connector for the Roku SDK + +Here's how to get started integrating the Mux Connector with the THEOplayer Roku SDK. + +## Prerequisites + +In order to set up the Mux Connector in your Roku application, you'll need the following: + +- Your Mux environment key +- An app with the THEOPlayer SDK for Roku already integrated, see our [Getting Started guide](https://www.theoplayer.com/docs/theoplayer/getting-started/sdks/roku/getting-started/). + +## Integration + +1. First you must download the THEO Mux Connector as a component library. Add a ComponentLibrary node to your MainScene.brs file, giving it an id of `THEOMuxConnector` and providing the URI for the THEOMuxConnector.pkg. Replace the `{SDK_VERSION}` tag with the version of the THEO Roku SDK you're using. The earliest version of the connector is 10.9.0: + +```xml + +``` + +2. Then in the Brightscript file for your MainScene, listen for the loading of the ComponentLibrary to complete by observing the `loadStatus` field. + +```brightscript +sub Init() + THEOMuxNode = m.top.findNode("THEOMuxConnector") + THEOMuxNode.observeField("loadStatus", "onLibraryLoadStatusChanged") +end sub + +sub onLibraryLoadStatusChanged(event as object) + THEOMuxNode = event.getROSGNode() + + if THEOMuxNode = invalid + return + end if + + if THEOMuxNode.loadStatus = "ready" + ' Success + else if THEOMuxNode.loadStatus = "failed" + ? "Failed to load component library, please check URL. "; THEOMuxNode.uri + end if +end sub +``` + +3. Add the THEOMuxConnector component to the SceneGraph file where your THEOPlayer is defined. + +```xml + + +``` + +4. Then in the Brightscript file, configure the connector by calling the configure method, passing the player instance and your Mux configuration. + +```brightscript +m.player = m.top.findNode("THEOPlayer") +m.muxConnector = m.top.findNode("THEOMuxConnector") +muxConfig = { + env_key: "", +} +m.muxConnector.callFunc("configure", m.player, muxConfig) +``` + +5. Next, when you start playing the asset, call the `startSession` method and pass it the metadata for the asset you're playing: + +```brightscript +m.player.source = sourceDescription + +muxContentMetadata = { + video_id: "", + video_title: "" +} + +m.muxConnector.callFunc("startSession", muxContentMetadata) +``` + +There are more properties available to add to the metadata, but `video_id` and `video_title` are required. See [Mux's schema for streaming metadata](https://www.mux.com/docs/guides/make-your-data-actionable-with-metadata#optional-configurable-metadata) for more properties that are available for Mux. + +6. If you are using the THEOplayer in a size other than fullscreen, before you start the session, you can set the presentation mode to reflect the different size. This is also referred to as the playback mode. + +```brightscript +m.muxConnector.callFunc("setPresentation", m.muxConnector.PRESENTATION_MODES.INLINE) +m.muxConnector.callFunc("startSession", muxContentMetadata) +``` + +The `setPresentation` method can also be called mid-session if the presentation mode changes during a session. The available presentation modes are `FULLSCREEN`, `INLINE`, `MINI`, and `PIP`. + +7. If you desire to monitor for CDN changes, you can optionally add a configuration for that to start monitoring. + `m.muxConnector.callFunc("monitorCdnChanges", { mycdn: ["my-cdn.net"], theo: ["cdn.theoplayer.com"] })` + +8. When the video has stopped playing because it ended or the user exited, end the Mux session. + `m.muxConnector.callFunc("endSession")` + +9. If you are exiting the player screen altogether, and destroying the player, make sure to destroy the connector at the same time, but before calling destroy on the player: + +```brightscript +m.muxConnector.callFunc("destroy") +m.muxConnector = invalid + +m.player.callFunc("destroy") +m.player = invalid +``` diff --git a/theoplayer_versioned_docs/version-v10/connectors/roku/mux/02-API-reference.mdx b/theoplayer_versioned_docs/version-v10/connectors/roku/mux/02-API-reference.mdx new file mode 100644 index 000000000000..9821361ec4ee --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/connectors/roku/mux/02-API-reference.mdx @@ -0,0 +1,87 @@ +--- +sidebar_label: API reference +sidebar_custom_props: { icon: '*️⃣' } +--- + +# Mux Connector API + +The attributes, methods and events for the THEOMuxConnector. + +## Attributes + +| Name | Type | Default | Access Permission | Description | +| ------------------ | ---------------- | ---------------------- | ----------------- | ---------------------------------------------- | +| id | string | | read,write | The id of the node. | +| CONTENT_TYPES | AssociativeArray | Mux Content Types | read | Constant with the Mux content types enums. | +| PRESENTATION_MODES | AssociativeArray | Mux Presentation Modes | read | Constant with the Mux presentation mode enums. | + +## Methods + +| Method | Params | Description | +| ----------------- | -------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| configure | player: THEOplayer, configuration: THEOMuxConfiguration, metadata: (optional) AssociativeArray | Add a player to monitor, configure the Mux SDK, and also pass in optional metadata for your content. | +| destroy | none | Destroy the connector. It also ends the current session, if any. | +| endSession | none | End the current Mux session, but do not destroy the connector. | +| monitorCdnChanges | mappings: CDNMonitoringConfig, defaultCdn: string (optional) | Updates the CDN monitoring settings. If passed a CDN monitoring config (see below), it will begin monitoring the downloaded segments for changes in CDN. This will update the defaultReportingResource for the current session if a CDN change is detected If passed invalid as the first parameter, it will stop the monitoring and use any string passed as the second param as the defaultReportingResource. | +| notifyError | code: integer, message: string, context: string (optional), severity: string (optional), isBusinessException: boolean (optional) | Report an error to Mux. Note that most errors should be automatically reported. Severity defaults to "fatal". | +| setPresentation | presentationMode: MuxPresentationModes, data: (optional) AssociativeArray | Change the reported presentation mode (also called playback mode) for the player. Can also take optional arbitrary data about the mode. | +| startSession | metadata: (optional) THEOMuxMetadata | Starts a Mux streaming session with the specified media type, and optionally applies the content metadata. See below for the schema of content. If not passing content metadata, you will need to add it separately with the `update` method before calling `startSession` | + +### Mux Config + +The configuration the Mux connector is the THEOMuxConfiguration interface. All properties except for `env_key` are optional. + +```brightscript +configuration = { + env_key: "", + viewer_user_id: "", + mux_base_url: "" +} +``` + +In order to get debug output from Mux in your console, you need to add the settings to your application's manifest file. + +``` +mux_debug_events=partial +mux_debug_beacons=partial +``` + +The accepted values for the debug properties are `full`, `partial`, and `none`, defaulting to `none`. + +### CDN Monitoring Config + +The configuration for CDN monitoring should be an AssociativeArray with keys that are the name of the CDN and values that are arrays of strings to search for in segment URLs. + +```brightscript +cdnMappings = { + akamai: ["akamaized.net"], + theo: ["dev.theoads.live", "cdn.theoplayer.com"] + level3: ["llnw.com"] +} +``` + +Passing a config as the only param will start CDN change monitoring with the provided configuration, or update the config if it is already started. +`m.muxConnector.callFunc("monitorCDNChanges", cdnMappings)` +However, if you want to stop CDN change monitoring, pass `invalid` as the first parameter, and the string you want to use for the defaultReportingResource as the second parameter. +`m.muxConnector.callFunc("monitorCDNChanges", invalid, "theo")` + +### Content Metadata + +Content metadata should be an AssociativeArray following [Mux's schema for streaming tags](https://www.mux.com/docs/guides/make-your-data-actionable-with-metadata#optional-configurable-metadata). All properties on it are optional, except for `video_id` and `video_title`. + +For content type metadata values, there is an enum property on the THEOMuxConnector named `CONTENT_TYPES`. Its values are SHORT, MOVIE, CLIP, EPISODE, TRAILER, and EVENT. For example: `metadata.video_content_type = m.muxConnector.CONTENT_TYPES.MOVIE`. + +### Presentation Modes + +The THEOMuxConnector supports reporting changes in the presentation mode (also called playback mode) your application uses the player in, such as fullscreen or inline. The `PRESENTATION_MODES` enum property on the THEOMuxConnector holds the possible values (FULLSCREEN, INLINE, MINI, and PIP). For example, if your application changes the THEO player so it is in a list row component, you could call: + +```brightscript +m.muxConnector.callFunc("setPresentation", m.muxConnector.PRESENTATION_MODES.INLINE) +``` + +There is also an optional `data` parameter for that method that can be an arbitrary associative array, as long as it can be converted to JSON. + +```brightscript +presentationModeData = { reason: "Viewed Asset", timestamp: 1767735434 } +m.muxConnector.callFunc("setPresentation", m.muxConnector.PRESENTATION_MODES.FULLSCREEN, presentationModeData) +``` diff --git a/theoplayer_versioned_docs/version-v10/connectors/web/index.mdx b/theoplayer_versioned_docs/version-v10/connectors/web/index.mdx new file mode 100644 index 000000000000..a04740bc67c1 --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/connectors/web/index.mdx @@ -0,0 +1,11 @@ +--- +sidebar_position: 0 +sidebar_label: Overview +pagination_label: Web Connectors +--- + +# Connectors for THEOplayer Web SDK + +import DocCardList from '@theme/DocCardList'; + + diff --git a/theoplayer_versioned_docs/version-v10/examples/01-basic.mdx b/theoplayer_versioned_docs/version-v10/examples/01-basic.mdx new file mode 100644 index 000000000000..13de62f28b54 --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/examples/01-basic.mdx @@ -0,0 +1,31 @@ +--- +sidebar_custom_props: { icon: '▶️' } +--- + +# Basic player + +import useBaseUrl from '@docusaurus/useBaseUrl'; +import styles from './shared.module.css'; + + + +
+ Code + ```html showLineNumbers +
+ + ``` +
diff --git a/theoplayer_versioned_docs/version-v10/examples/index.mdx b/theoplayer_versioned_docs/version-v10/examples/index.mdx new file mode 100644 index 000000000000..1fbed27d2ec8 --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/examples/index.mdx @@ -0,0 +1,14 @@ +--- +sidebar_position: 0 +sidebar_label: Overview +pagination_label: Examples +pagination_next: examples/basic +--- + +# Examples + +See the player in action! + +import DocCardList from '@theme/DocCardList'; + + diff --git a/theoplayer_versioned_docs/version-v10/examples/shared.module.css b/theoplayer_versioned_docs/version-v10/examples/shared.module.css new file mode 100644 index 000000000000..396b62da55c7 --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/examples/shared.module.css @@ -0,0 +1,8 @@ +.player { + width: 100%; + /* + * Make the player slightly higher than necessary, + * to avoid scrollbars. + */ + aspect-ratio: 16 / 9.1; +} diff --git a/theoplayer_versioned_docs/version-v10/external/android-connector b/theoplayer_versioned_docs/version-v10/external/android-connector new file mode 160000 index 000000000000..749108044767 --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/external/android-connector @@ -0,0 +1 @@ +Subproject commit 749108044767de5da7f033496eb76f6cadadc16b diff --git a/theoplayer_versioned_docs/version-v10/external/flutter-theoplayer-sdk b/theoplayer_versioned_docs/version-v10/external/flutter-theoplayer-sdk new file mode 160000 index 000000000000..9210dd4c3852 --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/external/flutter-theoplayer-sdk @@ -0,0 +1 @@ +Subproject commit 9210dd4c3852e9a6f0e06b9fe6d3265ecd10de69 diff --git a/theoplayer_versioned_docs/version-v10/external/iOS-Connector b/theoplayer_versioned_docs/version-v10/external/iOS-Connector new file mode 160000 index 000000000000..4b93f19e6f9e --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/external/iOS-Connector @@ -0,0 +1 @@ +Subproject commit 4b93f19e6f9e68039dd03cba4aea388ff40c84af diff --git a/theoplayer_versioned_docs/version-v10/external/react-native-connectors b/theoplayer_versioned_docs/version-v10/external/react-native-connectors new file mode 160000 index 000000000000..8b31580d1171 --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/external/react-native-connectors @@ -0,0 +1 @@ +Subproject commit 8b31580d1171c31811908c99aa8a996ac8136170 diff --git a/theoplayer_versioned_docs/version-v10/external/react-native-theoplayer b/theoplayer_versioned_docs/version-v10/external/react-native-theoplayer new file mode 160000 index 000000000000..384689367f2d --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/external/react-native-theoplayer @@ -0,0 +1 @@ +Subproject commit 384689367f2d5a0a26f03aca783d1d5dd7b91b37 diff --git a/theoplayer_versioned_docs/version-v10/external/web-connectors b/theoplayer_versioned_docs/version-v10/external/web-connectors new file mode 160000 index 000000000000..db4a876f7a43 --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/external/web-connectors @@ -0,0 +1 @@ +Subproject commit db4a876f7a43f8e44663ecb9ee146588891f62b6 diff --git a/theoplayer_versioned_docs/version-v10/faq/02-how-to-combat-autoplay-policies.md b/theoplayer_versioned_docs/version-v10/faq/02-how-to-combat-autoplay-policies.md new file mode 100644 index 000000000000..858cae0c365d --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/faq/02-how-to-combat-autoplay-policies.md @@ -0,0 +1,38 @@ +# How to combat autoplay policies + +This short article explains what autoplay is, where autoplay is restricted, and what THEOplayer does to facilitate working with autoplay. + +When you enable [autoplay](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/video#autoplay) for a HTML5 video, you instruct the viewer's browser to automatically play the content as soon as possible without action from the viewer. + +## Restrictions + +Browsers are restricting their autoplay capabilities. These policies are the result of the continuous misuse of autoplay which causes bad user experiences. + +There are two types of autoplay: + +- Unmuted Autoplay: autoplay with audio enabled. +- Muted Autoplay: autoplay with audio disabled. + +The first type is considered more abrupt, while the second type is considered more user-friendly. Some browsers which normally disallow unmuted autoplay allow it when the viewer explicitly indicates so\*. + +## API + +##### Web SDK + +An HTML5 video player can't circumvent these technical limitations, but it can offer an API which enables you in a smart way to switch between muted and unmuted autoplay. + +THEOplayer has the `mutedAutoplay` property in the `PlayerConfiguration`. When you set this property to all, THEOplayer will run in unmuted autoplay on browsers where this is allowed, and in muted autoplay where autoplay with sound is not allowed. You can find a valid example below: + +```js +// ... +var player = new THEOplayer.Player(element, { + // ... + mutedAutoplay: 'all', + // ... +}); +// ... +player.autoplay = true; +// ... +``` + +There's a possibility that new restrictions will be introduced in the future, so it's advised to keep autoplay restrictions in mind when developing your product. diff --git a/theoplayer_versioned_docs/version-v10/faq/04-why-does-fullscreen-not-behave-as-expected-on-ios.md b/theoplayer_versioned_docs/version-v10/faq/04-why-does-fullscreen-not-behave-as-expected-on-ios.md new file mode 100644 index 000000000000..7621a108f9cb --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/faq/04-why-does-fullscreen-not-behave-as-expected-on-ios.md @@ -0,0 +1,37 @@ +# Why does fullscreen not behave as expected on iOS + +One of the most frequently encountered issues on iOS devices is unexpected behavior concerning fullscreen playback. + +This is in fact an iOS limitation, since iOS + Safari does not allow showing non-video elements in fullscreen, as mentioned on this [support matrix](https://caniuse.com/#feat=fullscreen). + +THEOplayer's workaround involves playback in full-window, which sets THEOplayer's container to a `width` and `height` of 100%. Other elements can be placed on top of this view by giving it the CSS property `position: absolute;` (Combined with a top/bottom/right/left value) If this is not desired, reduce the `z-index` of these other elements. + +Note that this solution keeps the THEOplayer UI intact, but doesn't get rid of the address bar as desired in some cases. + +Alternatively, developers can use the [allowNativeFullscreen](pathname:///theoplayer/v10/api-reference/web/interfaces/PlayerConfiguration.html#allowNativeFullscreen) property mentioned here, which pushes the video element to fullscreen as seen below. + +```js + +``` + +The downside of this approach is that the iOS native look & feel will replace the custom UI, although the address bar will be gone. + +When you go full-window in an iframe, you won't see the container of the video grow because the iframe can't get any larger. diff --git a/theoplayer_versioned_docs/version-v10/faq/05-why-does-network-api-not-work-on-ios-devices.md b/theoplayer_versioned_docs/version-v10/faq/05-why-does-network-api-not-work-on-ios-devices.md new file mode 100644 index 000000000000..c38185f885a0 --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/faq/05-why-does-network-api-not-work-on-ios-devices.md @@ -0,0 +1,5 @@ +# Why does the Network API not work on iOS devices + +Most Network API capabilities are not available on iOS devices. Generally speaking, video playback on iOS behaves like a black box. This black box handles the requests (and responses) related to video manifests and segments, which makes them impossible to intercept. This limits the possible uses of the Network API on such devices. + +The Network API can still be used to intercept and alter requests and responses unrelated to video playback manifests and segments (e.g.: DRM-related requests and responses). diff --git a/theoplayer_versioned_docs/version-v10/faq/06-why-does-chromecast-not-work-on-ios-chrome.md b/theoplayer_versioned_docs/version-v10/faq/06-why-does-chromecast-not-work-on-ios-chrome.md new file mode 100644 index 000000000000..05cd54bc07d7 --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/faq/06-why-does-chromecast-not-work-on-ios-chrome.md @@ -0,0 +1,11 @@ +# Why does Chromecast not work on iOS Chrome? + +iOS Chrome used to support Chromecast. However, Google silently removed support for it at some point. It is also documented [on their Web Sender guide here](https://developers.google.com/cast/docs/web_sender) that: + +:::info + +Casting (Chromecast) is not supported on the iOS Chrome browser. + +::: + +You can still implement Chromecast inside a native iOS app following our guide [here](../how-to-guides/03-cast/01-chromecast/06-enable-chromecast-on-the-sender.md). diff --git a/theoplayer_versioned_docs/version-v10/faq/07-why-cant-we-select-other-video-quality-on-ios-tvos.md b/theoplayer_versioned_docs/version-v10/faq/07-why-cant-we-select-other-video-quality-on-ios-tvos.md new file mode 100644 index 000000000000..663c038205f3 --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/faq/07-why-cant-we-select-other-video-quality-on-ios-tvos.md @@ -0,0 +1,22 @@ +# Why can't I select another video quality on iOS/tvOS? + +**In short**: Apple technically restricts video players from doing this, and there is no workaround. + +#### The case for iOS Safari, macOS Safari, iOS SDK and tvOS SDK + +Any HTML5 video player, like THEOplayer, needs to use native technologies to do video playback, decoding and decryption. On web browsers, video players typically leverage the MSE and EME API by default. If this API is not available, then video players have to rely on native playback to handle video playback, decoding, decryption and ABR selection. + +On iOS browsers, THEOplayer has to use the native playback pipeline, instead of the [MSE](https://developer.mozilla.org/en-US/docs/Web/API/Media_Source_Extensions_API) and [EME](https://developer.mozilla.org/en-US/docs/Web/API/Encrypted_Media_Extensions_API) API. The native playback pipeline on iOS also exposes an API, but this API doesn't expose any information on the available qualities in a HLS stream, nor does it indicate which quality is currently active. + +When a FairPlay DRM protected stream is used, we are limited by the same scenario on macOS Safari since for DRM playback we rely on the native pipeline. + +The underlying AVFoundation stack on iOS/tvOS SDKs, which THEOplayer has to use, brings along the technical limitation that you cannot select a specific video quality. Instead, you can set a maximum resolution or bitrate as explained [here](../how-to-guides/06-mediatrack/03-how-to-select-video-track-quality.md#ios-tvos-sdk). + +In result, THEOplayer cannot offer functionality to developers and viewers to change qualities on these scenarios. + +## Resources + +The following resources provide more information: + +- https://developer.mozilla.org/en-US/docs/Web/API/Media_Source_Extensions_API +- [How to programmatically select a video track quality](../how-to-guides/06-mediatrack/03-how-to-select-video-track-quality.md#ios-tvos-sdk) diff --git a/theoplayer_versioned_docs/version-v10/faq/08-is-youtube-supported.md b/theoplayer_versioned_docs/version-v10/faq/08-is-youtube-supported.md new file mode 100644 index 000000000000..3a127889b949 --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/faq/08-is-youtube-supported.md @@ -0,0 +1,18 @@ +# Is YouTube supported + +This question above is typically asked by customers who have experience with the YouTube embedded player. It's also related to the following questions: + +- Does THEOplayer support the playback of YouTube videos? +- How do you embed YouTube inside THEOplayer? + +It is not legal to embed YouTube videos inside any video player, and overlay any custom UI elements. You can not use the YouTube embedded player inside THEOplayer. + +Source: https://developers.google.com/youtube/terms/required-minimum-functionality: + +> You must not display overlays, frames, or other visual elements in front of any part of a YouTube embedded player, including player controls. Similarly, you must not use overlays, frames or other visual elements to obscure any part of an embedded player, including player controls. + +Links: + +- https://developers.google.com/youtube/terms/api-services-terms-of-service +- https://developers.google.com/youtube/terms/required-minimum-functionality +- https://developers.google.com/youtube/terms/developer-policies diff --git a/theoplayer_versioned_docs/version-v10/faq/09-why-does-player-load-only-one-audio-track.md b/theoplayer_versioned_docs/version-v10/faq/09-why-does-player-load-only-one-audio-track.md new file mode 100644 index 000000000000..f211ca4aa536 --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/faq/09-why-does-player-load-only-one-audio-track.md @@ -0,0 +1,15 @@ +# Why does the player load only one audio track (even though there are several in the manifest) + +You may be asking this question if you notice a discrepancy in the number of audio tracks present in the manifest and the audio tracks that you can select from the player UI. + +Similar questions may be: + +- How to make all audio tracks in of my stream appear in THEOplayer +- Why the player does not return the correct audio tracks? +- Why does the player detect only one of the audio tracks of my manifest? + +First of all, a reassuring word: if your manifest is well-formed and contains multiple audio tracks, you do not need to do anything to import them all, as the player does this by default. + +However, if your audio tracks are missing, it usually means that something in the manifest is wrong. **If the manifest is indeed correct according to specs, this kind of behavior may occur if the video track includes also audio** (even in the presence of separated audio tracks). In this case, the player considers that audio track as primary and ignores all the others. + +In other words, when you want to be able to switch between different audio tracks, take care that all of them are included in the manifest separately from the video and that the video track does not include any audio track. This will also result in a slightly faster download time. diff --git a/theoplayer_versioned_docs/version-v10/faq/10-is-it-possible-to-see-360-picture.md b/theoplayer_versioned_docs/version-v10/faq/10-is-it-possible-to-see-360-picture.md new file mode 100644 index 000000000000..65377ef577dd --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/faq/10-is-it-possible-to-see-360-picture.md @@ -0,0 +1,5 @@ +# Is it possible to see 360 degrees photo with THEOplayer + +This question is asked by those users and developers that are wondering if the player 360 degree functionality can be used to view also images. + +No, this cannot be done. The player is intended for video sources, so an image as input is not officially supported, which is also true for 3D images. diff --git a/theoplayer_versioned_docs/version-v10/faq/11-why-visibilty-api-doesnt-work-in-iframe-on-safari-and-ie11.md b/theoplayer_versioned_docs/version-v10/faq/11-why-visibilty-api-doesnt-work-in-iframe-on-safari-and-ie11.md new file mode 100644 index 000000000000..b9a4f3c4269d --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/faq/11-why-visibilty-api-doesnt-work-in-iframe-on-safari-and-ie11.md @@ -0,0 +1,11 @@ +# Why the Visibility API does not work through an iframe on Safari and IE11 + +This question may be asked when you observe a different behavior of the Visibility API on different browsers. + +The [Visibility API](pathname:///theoplayer/v10/api-reference/web/interfaces/Visibility.html) provides developers a way to observe how much of the player is visible. + +When the player is embedded in an iframe, this API does not work on Safari and IE11. This depends on the fact that the player uses the [Intersection Observer API](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#Browser_compatibility) if it's available in the browser. Unfortunately, IE and Safari do not have support for this, so the player necessarily falls back to scroll events for these environments. + +This is the reason why on those browsers the Visibility API works correctly when the player is on the page but it is not functional through an iframe. + +February 2019: A piece of good news: the Intersection Observer API is now in beta in Safari: https://webkit.org/blog/8582/intersectionobserver-in-webkit/ diff --git a/theoplayer_versioned_docs/version-v10/faq/12-what-is-an-impression.md b/theoplayer_versioned_docs/version-v10/faq/12-what-is-an-impression.md new file mode 100644 index 000000000000..d490a1afe37e --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/faq/12-what-is-an-impression.md @@ -0,0 +1,7 @@ +# What is an impression + +This article explains what an impression is and how THEOplayer calculates impressions. + +THEOplayer will count an impression when the video or audio source is being played for the first time by our SDK. This can be triggered by a user clicking the Play button, or by playing the video automatically (autoplay). When you pause, play or seek within the same video or audio source, it still will be counted as only one impression. If a user refreshes the page or reloads the application, a second impression will be counted. If the content contains ads, these will not be counted towards the impression count. Except when the content only contains ads, then these will be counted towards the impression count. + +As an example, if you start a video, pause the video and then resume again it is only considered one impression. If on the other hand you start a video and then refresh your browser, or reload your application, it would be considered 2 impressions. diff --git a/theoplayer_versioned_docs/version-v10/faq/14-how-to-know-when-livestream-is-playing.md b/theoplayer_versioned_docs/version-v10/faq/14-how-to-know-when-livestream-is-playing.md new file mode 100644 index 000000000000..2271b0b72811 --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/faq/14-how-to-know-when-livestream-is-playing.md @@ -0,0 +1,15 @@ +# How to know whether a live stream is playing + +You can check if a stream being played is live or VOD by checking its duration. If the duration returns `Infinity`, the stream would be live. Examples: + +##### Web SDK + +```js +var isLive = player.duration === Infinity; // true or false +``` + +##### Android SDK + +```java +boolean isLive = Double.isNaN(tpv.getPlayer().getDuration()); // true or false +``` diff --git a/theoplayer_versioned_docs/version-v10/faq/15-which-error-related-events-does-player-expose.md b/theoplayer_versioned_docs/version-v10/faq/15-which-error-related-events-does-player-expose.md new file mode 100644 index 000000000000..fe9c5520f615 --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/faq/15-which-error-related-events-does-player-expose.md @@ -0,0 +1,20 @@ +--- +sidebar_custom_props: { 'faqCategory': 'Error handling' } +--- + +# Which error related events does the player expose + +THEOplayer exposes different types of errors. Refer to "[How to do error handling](../how-to-guides/07-miscellaneous/04-error/01-how-to-do-error-handling.md)" +for information on how to programmatically detect an `error` event through an event listener. + +Note that only the `error` events in the "Player API" are fatal. +Error events dispatched in different APIs (e.g. Ads API) are considered non-fatal, because some level of playback might still be possible, or the video player might recover from it. + +| API | Event | Use | Example/how to trigger | +| :--------------------: | :------------------------------------------: | :----------------------------------------------------------------------------: | :-----------------------------------------------------------------------------: | +| Player | error | Triggered for media issues, NOT network issues | A poorly encoded segment | +| | segmentnotfound (not on iOS + only for DASH) | A segment was not found | A 404 returned on a segment | +| Ads API | aderror | Something went wrong during ad handling | Empty ad tag / Adblocker | +| Network API (web only) | offline | Thrown to indicate that the stream is offline | DASH: take whole stream offline

HLS: take 1 segment offline is enough | +| Chromecast API | error | Thrown to indicate that there was an error while casting / trying to cast | Unplugged Chromecast power cable during casting | +| Android Player API | NoSupportedRepresentationFoundEvent | Indicates that none of the provided representations is supported by the player | Trying to play a 4k stream encoded in AV1 | diff --git a/theoplayer_versioned_docs/version-v10/faq/16-why-did-subtitles-stop-working.md b/theoplayer_versioned_docs/version-v10/faq/16-why-did-subtitles-stop-working.md new file mode 100644 index 000000000000..97f8a26f0001 --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/faq/16-why-did-subtitles-stop-working.md @@ -0,0 +1,22 @@ +# Why did my subtitles stop working + +This question is occasionally asked by developers who've configured the latest release of THEOplayer. + +### Before version 2.80 + +The most common reason on an older build why closed captions are no longer working is because the **`texttrackrendering` feature isn't enabled**. To verify whether this feature is enabled you can execute the query below. + +```js +var subsEnabled = THEOplayer.features.indexOf('texttrackrendering') > -1; +``` + +### After version 2.80 + +Starting in THEOplayer version 2.80 the `texttrackrendering` feature is no longer an optional feature. It is instead part of the default build, and is always enabled. + +### Other frequent reasons: + +- A new stream is configured which does not list any subtitles in its manifest. +- The subtitle file can't be retrieved. (e.g. 404) +- There are CORS issues with the subtitle file. +- The subtitle file is encoded in a non-compatible format. diff --git a/theoplayer_versioned_docs/version-v10/faq/17-how-does-mei-affect-autoplay-on-chrome.md b/theoplayer_versioned_docs/version-v10/faq/17-how-does-mei-affect-autoplay-on-chrome.md new file mode 100644 index 000000000000..058e6ccb43ab --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/faq/17-how-does-mei-affect-autoplay-on-chrome.md @@ -0,0 +1,18 @@ +# How does Media Engagement Index (MEI) affect Autoplay on Chrome + +The question above is related to the following questions: + +- Why is autoplay not working on Chrome? +- Is THEOplayer limited by the Media Engagement Index? + +In summary, **it's possible that on the desktop-version of Chrome (unmuted) autoplay is no longer working on your web page due to the Media Engagement Index**. The following two strategies can help you resolve this issue: + +1. Increase your MEI. +2. Enable muted autoplay. ([How to combat autoplay policies](02-how-to-combat-autoplay-policies.md)) + +You can read more about Chrome's autoplay policy at https://www.theoplayer.com/blog/chrome-autoplay-policy-what-you-need-to-know. A demo illustrating this policy can be viewed at http://demo.theoplayer.com/autoplay-policy. + +Remarks + +- The following scenario is possible due to the Chrome autoplay policy: when you first land on a web page, unmuted autoplay is not permitted. When you click through to another page, or refresh the page, unmuted autoplay is permitted, due to the additional user interactions which affect the MEI. +- You can check your MEI at chrome://media-engagement/. diff --git a/theoplayer_versioned_docs/version-v10/faq/18-what-does-error-unknown-cdm-mean.md b/theoplayer_versioned_docs/version-v10/faq/18-what-does-error-unknown-cdm-mean.md new file mode 100644 index 000000000000..f6bee4faa067 --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/faq/18-what-does-error-unknown-cdm-mean.md @@ -0,0 +1,15 @@ +--- +sidebar_custom_props: { 'faqCategory': 'Error handling' } +--- + +# What does the error message 'Unknown CDM error' mean + +If you got to see this page, you probably know that CDM stands for Content Decryption Module, which is a component in the DRM pipeline, a part of the content protection process. + +There are 2 scenarios where this error can be triggered: + +- If a user is watching a DRM-protected stream, and then tries to Airplay **their whole screen** (In the device status bar as opposed to Airplaying by clicking the icon in THEOplayer when watching in Safari). Because it cannot be guaranteed that the content is not being hijacked in this scenario, the player throws the "Unknown CDM error". This scenario is Mac/Safari specific. +- A second scenario where you would see this error is when, on iOS, you record your screen with built-in or third-party software while playing DRM-protected content. This scenario is iOS specific. + Safari uses media error code 5, according to VideoJS documentation (https://docs.videojs.com/mediaerror) + +Using this knowledge, developers could handle this error by capturing the 2 cases under one, more generic message towards the user e.g. 'This content is protected and can't be viewed this way.' diff --git a/theoplayer_versioned_docs/version-v10/faq/19-what-does-error-something-went-wrong-during-playback-mean.md b/theoplayer_versioned_docs/version-v10/faq/19-what-does-error-something-went-wrong-during-playback-mean.md new file mode 100644 index 000000000000..008ce8ca98e3 --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/faq/19-what-does-error-something-went-wrong-during-playback-mean.md @@ -0,0 +1,31 @@ +--- +sidebar_custom_props: { 'faqCategory': 'Error handling' } +--- + +# What does the error message 'Something went wrong with Native playback' mean + +This error, "Something went wrong with Native playback", occurs whenever the player struggles on the native rendering pipeline of the browser in use. The error code itself can be different, and it reflects the HTML5 MediaError interface. + +"Something went wrong with Native playback" is a possible error message which can be exposed by THEOplayer. Although it sounds generic, it is related to native rendering, as explained above. + +## Native Rendering + +Native rendering is used when THEOplayer leverages the native media playback pipeline. Usually, THEOplayer leverages this when this pipeline is the only possible pipeline, for example when you can't use MSE. + +Examples: + +- When doing playback on iOS Safari, THEOplayer will do native playback, because native rendering is the only option on iOS Safari. +- When a plain MP4 asset is configured, instead of an HLS or MPEG-DASH stream, THEOplayer will do native rendering. + +Native rendering can log an error due to multiple causes, but they relate to MediaError code. There are several MediaError codes, but for this case the ones relevant are: + +- `MEDIA_ERR_DECODE: 3` – This is shown when a media resource was deemed as usable, but when trying to decode the media resource in question it appears to have some problems in it (can be segments missing,...). +- `MEDIA_ERR_SRC_NOT_SUPPORTED: 4` – The source added to the player is not suitable for this playback. A good example would be trying to play a DRM protected DASH stream on Safari (Safari only supports HLS-FairPlay) + +The THEOplayer API can be used to access the MediaError code: `player.error.code` + +This line will return the MediaError together with the specific code. This makes it easier to find out what the error exactly means, and allows developers to plan for further actions. + +## Related articles + +- https://developer.mozilla.org/en-US/docs/Web/API/MediaError diff --git a/theoplayer_versioned_docs/version-v10/faq/20-why-are-not-all-response-headers-exposed.md b/theoplayer_versioned_docs/version-v10/faq/20-why-are-not-all-response-headers-exposed.md new file mode 100644 index 000000000000..591fce0e7993 --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/faq/20-why-are-not-all-response-headers-exposed.md @@ -0,0 +1,5 @@ +# Why are not all response headers exposed + +You may ask this question if, for example, you are trying to intercept a certain XHR response to use data contained in custom headers but you don't find these among the exposed headers (see documentation below regarding network interceptors). + +This happens because by default, only some headers are exposed by default. You can however decide to specify which additional headers you want exposed. This is done through the Access-Control-Expose-Headers response header. It "indicates which headers can be exposed as part of the response by listing their names" (see [documentation](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Access-Control-Expose-Headers)). diff --git a/theoplayer_versioned_docs/version-v10/faq/21-why-does-currentime-seem-to-be-off.md b/theoplayer_versioned_docs/version-v10/faq/21-why-does-currentime-seem-to-be-off.md new file mode 100644 index 000000000000..fac5e4bbffca --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/faq/21-why-does-currentime-seem-to-be-off.md @@ -0,0 +1,60 @@ +# Why does the currentTime seem off in my livestream & what can I do about it + +THEOplayer has a currentTime property, which returns you the current playback position in the video (in seconds). For VOD this works as you would expect. If you have a video, let it play for 30 seconds and query the currentTime, the player will report 30 seconds. However, if you start watching a livestream and query the currentTime after 30 seconds, you won't get 30 seconds reported. Nor will you get the time that would have elapsed if you watched the segments in the most recent manifest file until the point where you queried the currentTime. This might seem odd, but there's a very good reason for this, which we'll explain in a bit, along with some workarounds if you do want to use one of the aforementioned definitions of currentTime in a live streaming context. + +To calculate the currentTime, THEOplayer follows the HTML5 specification. However, for livestreams, this is not specified. Hence, if you try to use currentTime for synchronization between players, you'd get different behavior among different players. It's even possible to see different behavior among different streaming protocols in conjunction with the same player. + +The internal implementation THEOplayer uses, is constructed to never have a negative currentTime. A few things are being checked to ensure this: + +- Check if it's a VOD. In this case the timeline starts at 0 +- In case it's a live stream, there are two options + +**It's a live-EVENT stream** + +- Manifest contains `EXT-X-PLAYLIST-TYPE: EVENT` +- All renditions started at the same time, so the first segment would have timestamp 0 + +**It's a livestream with a DVR window** + +- For these some players choose to start the 0-offset at the start of the first segment +- However, segments are not necessarily aligned across multiple renditions: +- Switching renditions can cause new content to become available before the start timestamps of the first rendition +- Such a segments would halve a negative start timestamp +- To avoid negative timestamps, THEOplayer keeps an offset of 3 target durations from the start as its zero-reference + +How can you deal with this if you want to synchronize players or get a zero-based timestamp? You have **3 options**: + +1. Use `EXT-X-PROGRAM-DATE-TIME`, which gives you an absolute time reference. +2. Make your stream an event stream by including `EXT-X-PLAYLIST-TYPE: EVENT` in the manifest +3. Use the player's seekable property (which is based on the manifest) and query seekable.start(0) to find the starting time of your stream + 3.1 Attach an event listener for the 'durationchange' event (triggered the first time a media playlist is loaded) + 3.2 Upon this event, store player.seekable.start(0) in a variable 'timeOffset' and remove the eventlistener + 3.3 Subtract the value of 'timeOffset' from the player's currentTime to get a zero-based timestamp + +Here's a code snippet for option 3 : + +```js +function AbsoluteTimeline(player) { + var timeOffset = 0; + + function durationchangeHandler() { + timeOffset = player.seekable.start(0); + player.removeEventListener('durationchange', durationchangeHandler); + } + player.addEventListener('durationchange', durationchangeHandler); + + return { + getOffset: function () { + return timeOffset; + }, + getCurrentTime: function () { + return player.currentTime - timeOffset; + }, + seek: function (timestamp) { + player.currentTime = timestamp + timeOffset; + }, + }; +} + +var timeline = AbsoluteTimeline(player); +``` diff --git a/theoplayer_versioned_docs/version-v10/faq/22-how-to-remove-cors-restrictions.md b/theoplayer_versioned_docs/version-v10/faq/22-how-to-remove-cors-restrictions.md new file mode 100644 index 000000000000..357efc4144ca --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/faq/22-how-to-remove-cors-restrictions.md @@ -0,0 +1,5 @@ +# How to remove CORS restrictions from a reproduction stream + +A "CORS-issue" is a common cause of a stream not starting. In a nutshell, a CORS issue implies that the origin is not allowed to fetch the resource. This issue has to be resolved from the server-side. + +Additionally, sometimes we ask customers to alter their CORS-policy in order to playback streams from a development environment. A CORS-issue blocks us from deploying the stream in our development environment. diff --git a/theoplayer_versioned_docs/version-v10/faq/23-which-network-calls-does-THEOplayer-do.md b/theoplayer_versioned_docs/version-v10/faq/23-which-network-calls-does-THEOplayer-do.md new file mode 100644 index 000000000000..e8d4ce606964 --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/faq/23-which-network-calls-does-THEOplayer-do.md @@ -0,0 +1,13 @@ +# Which network calls (or requests) does THEOplayer do + +The question above is related to the following questions: + +- What is the call to license.theoplayer.com? +- Why is THEOplayer sending a request to licensing.theoplayer.com? +- What is the call to licenseapi.theoplayer.com, and why is it failing? + +THEOplayer can do three different network requests to `*.theoplayer.com` which are not related to your stream. + +1. `license.theoplayer.com`: this request logs an impression to THEOplayer's analytics server. THEOplayer uses impressions to know how many views you've received, because it's taken into account for billing purposes. The analytics server does not track personal information on your users. +2. `licensing.theoplayer.com/t?`: this request serves as a fallback request when the call to license.theoplayer.com fails. +3. `licenseapi.theoplayer.com/api/v1/check`: this request happens when your current license is invalid, for example on a domain (or IP-address) which hasn't been whitelisted. This request will not be successful because there's no service configured for this request. (This might change in the future.) diff --git a/theoplayer_versioned_docs/version-v10/faq/24-why-does-playback-not-work-using-chrome-iphone-simulator.md b/theoplayer_versioned_docs/version-v10/faq/24-why-does-playback-not-work-using-chrome-iphone-simulator.md new file mode 100644 index 000000000000..c99a406ab813 --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/faq/24-why-does-playback-not-work-using-chrome-iphone-simulator.md @@ -0,0 +1,19 @@ +# Why does the playback not work when using the Chrome iPhone/iPad simulator + +You might need an answer to this question if you are testing your page using the Chrome iPhone/iPad simulator and notice that, reloading the page, the video player stops working (even though the ads, if any, are displayed correctly) and some errors are displayed in the console. + +Similar questions are: + +- Why does the playback not work when using Mozilla in Responsive Design Mode? +- Why does the playback not work when using the Edge emulator to test my page on other platforms? +- Why does the playback not work when testing device-specific viewports with the browser dev tools? + +The simple answer is that this occurs because the video player gets confused between the user agent (set as iOS during the simulation) and the browser actually in use. This does not imply that there is any problem with the video player. In fact, when the tested page will be accessed by an actual iOS device, the video player will work fine, in absence of other (unrelated) issues. + +The same behavior is to be expected in similar tests, that is to say when a platform is emulated on another and they do not share the same playback logic of the native video element. + +Some more details: + +If you use Chrome + iOS simulator, your user-agent will change to iOS/Safari. THEOplayer detects this new user-agent, and because it's iOS it'll think that the MSE API is not available, and that they need to use the playback logic of the native video element. However, you're still on Chrome, so this alternate native iOS playback logic is not available. These circumstances lead to playback failure. It works for ads because they typically do not use the HLS protocol, so we do not have to leverage MSE. + +It is not advisable to use (or rely on) the Chrome + iOS simulator mode to test anything else than the view mode. The native APIs which iOS offers are not available in this mode, so it's not really a useful testing mode. diff --git a/theoplayer_versioned_docs/version-v10/faq/25-what-does-error-can-only-be-initiated-by-user-gesture-mean.md b/theoplayer_versioned_docs/version-v10/faq/25-what-does-error-can-only-be-initiated-by-user-gesture-mean.md new file mode 100644 index 000000000000..127423c396a4 --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/faq/25-what-does-error-can-only-be-initiated-by-user-gesture-mean.md @@ -0,0 +1,26 @@ +--- +sidebar_custom_props: { 'faqCategory': 'Error handling' } +--- + +# What does the error message 'can only be initiated by a user gesture' imply? Can I still force the desired action + +You may get this error if you are trying to have the player execute an action without it being initiated by the user. A typical example is going fullscreen or automatically starting playback (often on mobile). + +Related questions are: + +- Why can’t I set the player to fullscreen mode on screenrotation? (Related error message: “Failed to execute 'requestFullScreen' on 'Element': API can only be initiated by a user gesture.”) +- Why is an error generated if I want to automatically start playback when certain conditions are met (Related error message: DOMException: play() can only be initiated by a user gesture) + +The short answer is no, you cannot (and should not) force an action that gets this kind of error message: this is a block implemented by the browser to protect the user. + +The details: + +In some cases, the browser deems that a certain behavior cannot be initiated automatically and needs instead to be started by the user (or user action). This happens because these behaviors may be perceived as bad or harmful by a user, if automated. In other words, this limitation is implemented by the browser to protect the user from (for example) invasive pop ups, advertisement, etc., as well as from more serious threats to a good and safe web surfing. + +To our knowledge, there is no way to force the browser to ignore this error, and you probably shouldn't want to do so, for the above-mentioned reasons. Therefore, if you incur in this situation you may want to find an alternative way to achieve the desired result (or take the hint from the browser and reconsider whether what you want to achieve is appropriate for your use case and good for the user). + +Update 7/12/2018 + +This behavior is common on devices and on Safari. + +Chrome 71, released a few days ago, also introduces the need for user interaction to go fullscreen. diff --git a/theoplayer_versioned_docs/version-v10/faq/26-how-to-remove-unwanted-cc-track-ios-safari.md b/theoplayer_versioned_docs/version-v10/faq/26-how-to-remove-unwanted-cc-track-ios-safari.md new file mode 100644 index 000000000000..86bdcc548193 --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/faq/26-how-to-remove-unwanted-cc-track-ios-safari.md @@ -0,0 +1,21 @@ +# How to remove unwanted CC track in iOS or Safari + +This article is intended to show how to remove any unwanted CC tracks that might be showing up in iOS or Safari. This can be done by editing the HLS master playlist. + +**Unwanted CC in Safari native** + +![Unwanted CC in Safari](../../../theoplayer/assets/img/unwanted-cc-safari.png) + +**Unwanted CC in THEOplayer iOS** + +![Unwanted CC in iOS](../../../theoplayer/assets/img/unwanted-cc-ios.png) + +## How to remove unwanted cc tracks? + +To remove any unwanted cc tracks, the “CLOSED-CAPTION” attribute has to be set to “NONE” inside the HLS master playlist. This is to be compatible with the HLS specification: https://tools.ietf.org/html/rfc8216#section-4.3.4.2 + +If it is a multi-variant stream, this has to be done for all variants. + +```text +CLOSED-CAPTION=NONE +``` diff --git a/theoplayer_versioned_docs/version-v10/faq/31-mediatek-limitations.md b/theoplayer_versioned_docs/version-v10/faq/31-mediatek-limitations.md new file mode 100644 index 000000000000..8826ab5e69c0 --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/faq/31-mediatek-limitations.md @@ -0,0 +1,39 @@ +# MediaTek limitations + +This page overviews a list of known issues caused by the MediaTek chipset. + +## 1. Switching to fullscreen halts playback for approximately 10 seconds + +The MediaTek decoder seems lackluster at handling a transition to fullscreen when **experimental rendering** is enabled because THEOplayer uses a separate Android Activity for fullscreen. Using the default rendering pipeline does not trigger this issue. A workaround is doing fullscreen without detaching the SurfaceView from the window. + +### Why does THEOplayerView use a separate activity for fullscreen? + +THEOplayerView uses a separate Activity for fullscreen so that the fullscreen view is completely isolated from the Activity the THEOplayerView is in. +The Activity has its own orientation, window settings, and back button behavior. +By using a separate Activity, we can leave those settings and the view hierarchy intact in the Activity in which the THEOplayerView is embedded. + +A downside of this in case of experimental rendering is that we need to move the SurfaceView that holds the Surface on which video is rendered. +This, however, means that the Surface is destroyed and a new one is created. +On newer devices, this is normally no problem because the decoder is decoupled from the Surface. +When the Surface is destroyed, a new one can be attached to the same decoder. +On devices with an API lower than 23 (and some other devices which bug) however, the decoder can not change the Surface on which it draws without re-initialization. +This means that on older and some buggy devices, switching to fullscreen will make the video hang until the next keyframe is reached in the stream. + +### Solution: Fullscreen without detaching the SurfaceView from the window + +If an implementer does not want the Surface to be destroyed when going fullscreen, the implementer needs to implement this themselves to fit within the Activity. + +A few things are needed for this: + +1. FullscreenCoupling needs to be disabled (with `getTPV().getSettings().setFullScreenOrientationCoupled(false)`). +2. If the UI is enabled, the fullscreen button needs to be hidden or overwritten. This needs to be done with [custom CSS and/or custom JavaScript](../../version-v4/faq/01-how-to-add-css-or-javascript-files-to-android-ios.md). +3. Orientation needs to be handled in the Activity. + 3.1 To change the orientation of the Activity, [`setRequestedOrientation`]() has to be called on the Activity or the Activity needs to be allowed to rotate. Allowing the activity to rotate means that the android:screenOrientation property in the [manifest](https://developer.android.com/guide/topics/manifest/manifest-intro) needs to be set to multiple values or not set. + 3.2 To make sure that the Activity is not recreated on an orientationchange,android:configChanges field in the manifest need to include "orientation|screenSize". + 3.3 To detect the change, the onConfigurationChanged method needs to be overridden in the Activity. In the implementation the orientation can be checked and fullscreen can be initiated or stopped depending on it. +4. To make the THEOplayerView fill the whole Activity without moving the view, the THEOplayerView and all of its parents view's width and height layout parameters need to be set to "match_parent" and they all need to be the first child-view (with a non-zero surface area). +5. To hide the navigation buttons and status bar, the Activity should change the window and visibility flags. this can be done with: + 5.1 getWindow().getDecorView().[setSystemUiVisibility]()(SYSTEM_UI_FLAG_LOW_PROFILE|SYSTEM_UI_FLAG_FULLSCREEN|SYSTEM_UI_FLAG_LAYOUT_STABLE| SYSTEM_UI_FLAG_IMMERSIVE_STICKY|SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION|SYSTEM_UI_FLAG_HIDE_NAVIGATION); + 5.2 getWindow().[setFlags]()(FLAG_FULLSCREEN, FLAG_FULLSCREEN); +6. To let the player exit fullscreen on a back button press instead of stopping the Activity, the onBackPressed method of the Activity should be overridden with the desired behavior. +7. When going back from fullscreen, the original settings for the window and back button behavior need to be set back to desired values. diff --git a/theoplayer_versioned_docs/version-v10/faq/33-how-to-use-proguard-with-android-sdk.md b/theoplayer_versioned_docs/version-v10/faq/33-how-to-use-proguard-with-android-sdk.md new file mode 100644 index 000000000000..ef1914c4986e --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/faq/33-how-to-use-proguard-with-android-sdk.md @@ -0,0 +1,29 @@ +# How to use ProGuard with THEOplayer Android SDK + +ProGuard is a popular tool to obfuscate and optimize Java code in Android projects. Depending on the settings, this tool can clash with the THEOplayer Android SDK. + +Below, you can find a list of rules tested against THEOplayer Android SDK on 28 Nov 2018. + +``` +-keep class com.theoplayer.android.** {*;} +-dontwarn com.theoplayer.android.** +-keep public class com.google.android.gms.* { public *; } +-dontwarn com.google.android.gms.** +-keep class android.support.v7.app.MediaRouteActionProvider {*;} +-dontwarn android.support.v7.app.MediaRouteActionProvider + +# In case of using yospace integration +-keep class com.yospace.util.** {*;} +-dontwarn com.yospace.util.** + +# For native Google IMA integration +-keep class com.google.obf.** { *; } +-keep interface com.google.obf.** { *; } +-keep class com.google.ads.interactivemedia.** { *; } +-keep interface com.google.ads.interactivemedia.** { *; } + +# And in case of using a CastOptionsProvider and/or custom MediaRouteActionProvider for chromecast, you have to keep those classes too. +# eg: +# -keep class com.yourcomp.yourchromecastpackage.** {*;} +# -dontwarn com.yourcomp.yourchromecastpackage.** +``` diff --git a/theoplayer_versioned_docs/version-v10/faq/34-self-hosting-theoplayer.md b/theoplayer_versioned_docs/version-v10/faq/34-self-hosting-theoplayer.md new file mode 100644 index 000000000000..2c45fc719106 --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/faq/34-self-hosting-theoplayer.md @@ -0,0 +1,38 @@ +# Self-hosting and versioning of THEOplayer + +Your licensed THEOplayer can also be hosted on your own servers or CDN. +This can be useful when you do not want to have a dependency on a third-party hosting infrastructure, for using THEOplayer on internal/local (and even offline) networks or for using THEOplayer inside mobile apps. + +There are two approaches to download the THEOplayer SDK for self-hosting purposes: + +1. Use [NPM](https://www.npmjs.com/package/theoplayer). +2. Download the SDK through [https://portal.theoplayer.com](https://portal.theoplayer.com). + +:::important + +When self-hosting THEOplayer, it is important you regularly update your self-hosted THEOplayer files in order to benefit from the latest improvements. + +::: + +In order to download the THEOplayer package and host it on your server, you will first have to determine which version of the player you want to use. +Read up about version changes in the [changelog](../changelog.md). + +## Configuring self-hosting + +Once you extracted the ZIP package to your server, you must configure THEOplayer and provide the information where the resources can be found. +For this, you should configure 1 parameter correctly: + +- `libraryLocation`: This parameter should point to the location of the library. It is the location where the ZIP package has been extracted and the resources are available on the server. + +Of course, also keep in mind to correctly link to the correct JavaScript library and CSS file. + +```html + + +``` + +## Common mistakes + +- Configuring the libraryLocation incorrectly. The referred location/folder should contain `theoplayer.d.js`, `theoplayer.e.js`, `theoplayer.p.js`, `THEOplayer.js`, and so on, and they need to all have the same version. +- Using the THEOplayer library on a web page which resides on a non-whitelisted domain (e.g. http://localhost/index.html). Although you can host your library assets anywhere, you can only use the actual video player on white-listed domains. +- Linking to an unreachable JavaScript or CSS library. diff --git a/theoplayer_versioned_docs/version-v10/faq/35-does-theoplayer-support-ext-x-daterange.md b/theoplayer_versioned_docs/version-v10/faq/35-does-theoplayer-support-ext-x-daterange.md new file mode 100644 index 000000000000..71d4d651938f --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/faq/35-does-theoplayer-support-ext-x-daterange.md @@ -0,0 +1,23 @@ +# Does THEOplayer support EXT-X-DATERANGE + +Yes, the HLS tag `#EXT-X-DATERANGE` is supported in THEOplayer as of 2.61.0. To enable it, hlsDateRange needs to be added to either the player configuration or the source description and be set to true. The date range metadata will be made available through the TextTrack API. + +`#EXT-X-DATERANGE` is a way of providing timed metadata in an HLS manifest. It is used to define date range metadata in a media playlist. A possible use case is defining timed metadata for interstitial regions such as advertisements, but can be used to define any timed metadata needed by your stream. + +As indicated above, `#EXT-X-DATERANGE` is supported in THEOplayer as of 2.61.0. However, the feature is not enabled by default. To enable it, add hlsDateRange to the player configuration and set it to true. You can also choose (instead) to enable/disable the feature per source by adding the same option to a source in your source description. + +The TextTrack API is used to retrieve the timed metadata. A MetadataTextTrack will provide cues which contain the timed metadata and will dispatch an event when started and ended. + +## Remarks + +- A manifest with EXT-X-DATERANGEs needs to have an EXT-X-PROGRAM-DATE-TIME to be able to calculate dates from playback times. This is also a specification requirement. +- If the tag name for a date range tag in the manifest is incorrect, the tag will be ignored +- If the name of any attribute is misspelled in a date range tag in the manifest, the attribute will not be parsed +- When using native browser playback features such as FairPlay content protection, the player might use more resources to parse date ranges from the manifest than in other scenarios. + +## Resources + +The following resources provide more information: + +- [HLS Specification - #EXT-X-DATERANGE](https://tools.ietf.org/html/draft-pantos-hls-rfc8216bis-04#section-4.4.2.7) +- [API reference - TextTrackType](pathname:///theoplayer/v10/api-reference/web/types/TextTrackType.html) diff --git a/theoplayer_versioned_docs/version-v10/faq/36-can-clipping-be-used-in-a-playlist.md b/theoplayer_versioned_docs/version-v10/faq/36-can-clipping-be-used-in-a-playlist.md new file mode 100644 index 000000000000..5f05d447a81d --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/faq/36-can-clipping-be-used-in-a-playlist.md @@ -0,0 +1,94 @@ +# Can clipping be used on a playlist + +Yes. This is in principle not different from using it on a single video: a startTime and an endTime must be given for each video and applied when the video is loaded/played. + +Let’s expand slightly the idea. You can have 2 use cases: + +- The same start and end time can be used for all contents. +- Each content has a different start and end time. + +## The same start and end time can be used for all contents + +In this case, you can apply the Clip API without any further precaution or modification. You can find an example at the page Video clipping in THEOplayer (see below). Please remember to make sure that clipping happens after the source is set (e.g.: use a `durationchange` event). + +## Each content has a different start and end time. + +In this case, some adjustment is needed to be able to provide and read the right custom start and end time for each content. One possible way to do it is to simply pass such data together with the source data and read it directly from there when clipping the video, like in the example below. + +```js +// an array is provided, containing multiple player.source. Each source contains startTime and endTime. +var playlist = [ + { + source: { + sources: { + src: 'https://cdn.theoplayer.com/video/big_buck_bunny/big_buck_bunny_metadata.m3u8', + startTime: 100, + endTime: 150, + }, + title: 'Big Buck Bunny', + description: 'Big Buck Bunny', + poster: 'https://cdn.theoplayer.com/video/big_buck_bunny/poster.jpg', + }, + }, + { + source: { + sources: { + src: 'https://cdn.theoplayer.com/video/star_wars_episode_vii-the_force_awakens_official_comic-con_2015_reel_(2015)/index.m3u8', + startTime: 120, + endTime: 180, + }, + title: 'Star Wars Reel', + description: 'Star Wars Reel', + poster: 'https://cdn.theoplayer.com/video/star_wars_episode_vii-the_force_awakens_official_comic-con_2015_reel_(2015)/poster.jpg', + }, + }, + { + source: { + sources: { + src: 'https://cdn.theoplayer.com/video/tears_of_steel/index.m3u8', + startTime: 50, + endTime: 150, + }, + title: 'Tears of Steel', + description: 'Tears of Steel', + poster: 'https://cdn.theoplayer.com/video/tears_of_steel/poster.jpg', + }, + }, +]; + +// the desired source is set in the player - +// this is not reported here as it depends on your implementation, +// but an example can be seen in the resources linked below. +// For the purpose of this example +// player.source = playlist[0]; + +// the following lines make sure that +// when the first playing event is fired for each (new) content +// clipping times are read from directly within the player.source + +function firstplaying() { + player.clip.startTime = player.source.sources.startTime; + player.clip.endTime = player.source.sources.endTime; + THEOplayer.players[0].removeEventListener('durationchange', firstplaying); +} + +THEOplayer.players[0].addEventListener('sourcechange', function () { + THEOplayer.players[0].removeEventListener('durationchange', firstplaying); + THEOplayer.players[0].addEventListener('durationchange', firstplaying); +}); +``` + +Notes: + +- In this example, we are only describing how to apply the clipping, not how to play a playlist. For this, please consult the linked resources. +- The example is provided only in JavaScript because clipping is currently available only for the JavaScript SDK. It may be used also in other SDKs through JavaScript injection. + +## Resources + +The following resources provide more information: + +API reference - [Clip API](pathname:///theoplayer/v10/api-reference/web/interfaces/Clip.html) + + + +Clipping - [How-to guide](../how-to-guides/07-miscellaneous/06-clipping.md) diff --git a/theoplayer_versioned_docs/version-v10/faq/37-can-timeline-thumbnails-be-made-available-before-playback-start.md b/theoplayer_versioned_docs/version-v10/faq/37-can-timeline-thumbnails-be-made-available-before-playback-start.md new file mode 100644 index 000000000000..4d398f6f1dbc --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/faq/37-can-timeline-thumbnails-be-made-available-before-playback-start.md @@ -0,0 +1,15 @@ +# Can timeline thumbnails be made available before playback start + +Yes, this is possible using the preload feature, provided your timeline is already visible. Both “metadata” and “auto” will be effective values to this end. + +If the player on your implementation shows the timeline before playback start (differently than on our demo pages), you may indeed be interested to show the timeline thumbnails, and possibly other data (e.g.: video duration). As explained above, this may be achieved using the preload. Both values “metadata” and “auto” will work for this. The advantage of using “auto” is that also some media files will be buffered, reducing the start-up time. To know more about preload, please visit the linked resources. + +In case your timeline is not visible before playback start, however, using preload will have no visible impact on the timeline thumbnails. + +## Resources + +The following resources provide more information: + +- [Preloading - How to](../how-to-guides/07-miscellaneous/09-preloading.md) +- [What are the benefits of preloading?](38-what-are-the-benefits-of-preloading.md) +- [PreloadType API reference](pathname:///theoplayer/v10/api-reference/web/types/PreloadType.html) diff --git a/theoplayer_versioned_docs/version-v10/faq/38-what-are-the-benefits-of-preloading.md b/theoplayer_versioned_docs/version-v10/faq/38-what-are-the-benefits-of-preloading.md new file mode 100644 index 000000000000..bc19e12c864b --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/faq/38-what-are-the-benefits-of-preloading.md @@ -0,0 +1,19 @@ +# What are the benefits of preloading + +Choosing whether to preload parts of the video before it starts playing will help you considerably improve the user experience. + +Preloading involves loading parts of a video source before the video starts playing. When the video later starts playing, it can do this much faster because it has already downloaded some data. This can improve the user experience dramatically when you expect the user will want to play the video. On the other hand, when the video is less likely to be played, you can configure the player to not preload it and save bandwidth. + +Interactive video experiences are one example use case for this functionality. In an interactive video, the user must choose between multiple options at the end of a video, with each option leading to a different video. Using preloading will help you ensure a smooth transition between videos (to this purpose you may also want to use other THEOplayer features, such as Cache API and Canvas API - see Resources). + +Choosing to preload your video content will also make some data regarding the current source available before the user initiates playback. Such data include, for example, the video duration and the timeline thumbnails. + +## Resources + +The following resources provide more information: + +- https://www.w3.org/TR/html5/embedded-content-0.html#attr-media-preload: HTML5 specification +- [Preloading - How-to](../how-to-guides/07-miscellaneous/09-preloading.md) +- [API reference: preloading](pathname:///theoplayer/v10/api-reference/web/types/PreloadType.html) +- [API reference: Cache API](pathname:///theoplayer/v10/api-reference/web/interfaces/Cache.html) +- [API reference: Canvas API](pathname:///theoplayer/v10/api-reference/web/interfaces/Canvas.html) diff --git a/theoplayer_versioned_docs/version-v10/faq/39-what-are-the-player-seeking-and-seeked-events.md b/theoplayer_versioned_docs/version-v10/faq/39-what-are-the-player-seeking-and-seeked-events.md new file mode 100644 index 000000000000..c87fe70a6afb --- /dev/null +++ b/theoplayer_versioned_docs/version-v10/faq/39-what-are-the-player-seeking-and-seeked-events.md @@ -0,0 +1,20 @@ +# What are the player seeking and seeked events and when are they fired + +They are events related to the playback of media files. `seeking` is fired when the user starts seeking/moving to a new position. `seeked` is fired when the user is finished seeking/moving to a new position and the player has buffered a video portion, being therefore ready to play. + +The player `seeking` and `seeked` events are not to be confused with the homonym `