Project setup

SetupGradleCocoaPodsSPMNPM

BPK SmartLib is available off-the-shelf for numerous platforms and video players. Apple & Android ecosystems are of course supported but the lib also runs on web browsers, set-top-boxes or Smart TVs. Pre-packages versions of BPK SmartLib are available for the most popular video players and a generic API version is also available for players not supported yet. It is available in a variety of programming languages including Objective-C, Java, JavaScript.

To get started, you can grab a lib package depending on the platform you are running:

	Android	iOS & tvOS	Web
Platform	Android smartphone Android tablet Android TV	iPhone iPad Apple TV	Browser Smart TV STB React Native Other JavaScript platforms
Download method	Gradle	CocoaPods or SPM	NPM or JS files
Current version	...	...	...

info

In this guide, you can select With player or Without player above code samples depending on the integration you need:

• For an Analytics integration, Analytics only integration or Ad insertion integration, select With player.
• For a Broadpeak CDN integration or other optional player metrics integration, select Without player.

Please refer to Getting started for more info.

Android

The easiest way to get the BPK SmartLib is to add it as a Gradle dependency. We assume you are using Android Studio with the latest tools updates as recommended by Google.

First, add our repository to your settings.gradle:

dependencyResolutionManagement {
    repositoriesMode.set(RepositoriesMode.FAIL_ON_PROJECT_REPOS)
    repositories {
        google()
        mavenCentral()
        maven {
            url "https://delivery-platform.broadpeak.tv/android/repository/all"
        }
    }
}

caution

Since the version 04.02.04.1f725a1, the maven repository URL has changed. Please update your configuration in your gradle files.

If you need an older version, please ask Broadpeak.

Next, add the BPK SmartLib dependency to the build.gradle file of your app module:

With player

Select your player:

GenericMedia3ExoPlayerTHEOplayerVOPlayerNAGRA CONNECT PlayerBitmovinKalturaLabgencycastLabs PRESTOplayVisualOn

implementation 'tv.broadpeak.smartlib:smartlib-true:...'

We highly recommend to use Media3 1.3.1, please ask Broadpeak if you need another version.

Without player

implementation 'tv.broadpeak.smartlib:smartlib-generic:...'

iOS & tvOS

The iOS & tvOS library can be downloaded:

• using SPM (Swift Package Manager) : install the lib through Xcode in Swift or Objective-C projects
• using CocoaPods : install the lib with a Pod file and CocoaPods commands

Requirements

• Xcode 13.0 or higher
• iOS deployment target 15.0 or higher
• tvOS deployment target 15.0 or higher

Using SPM

On Xcode, open the Project and Targets settings. Select your project and go to the Package Dependencies tab.

Click +, and enter the following URL in Search or Enter Package URL:

https://delivery-platform.broadpeak.tv/ios/broadpeak/smartlib-package.git

Once resolved, select smartlib-package. Then, in Dependency rule, pick Up to Next Major Version.

Click Add Package and select the player you need.

info

• Use SmartLib-Generic if you don't need a player integration.

• The SPM package works on both iOS and tvOS platforms excepted for Labgency that is only available on iOS.

Using CocoaPods

Specify this in your Podfile:

With player

Select your player:

GenericAVPlayerVOPlayerNAGRA CONNECT PlayerKaltura PlayKitLabgencycastLabs PRESTOplayVisualOnTHEOplayer

source 'https://cdn.cocoapods.org/'
source 'https://delivery-platform.broadpeak.tv/ios/broadpeak/specs.git'

target 'your target name' do
    use_frameworks!

    # iOS dependency
    pod 'SmartLib-v3/AVPlayer', '...'

    # tvOS dependency
    pod 'SmartLib-v3/AVPlayer+tvOS', '...'
end

Without player

source 'https://cdn.cocoapods.org/'
source 'https://delivery-platform.broadpeak.tv/ios/broadpeak/specs.git'

target 'your target name' do
    use_frameworks!

    # iOS dependency
    pod 'SmartLib-v3/Generic', '...'  
    
    # tvOS dependency
    pod 'SmartLib-v3/Generic+tvOS', '...'
end

Then, you will need to add our repository and install pods:

pod repo add broadpeak https://delivery-platform.broadpeak.tv/ios/broadpeak/specs.git
pod install

You can now open your project with the xcworkspace file.

Web

The JavaScript library can be downloaded:

• using NPM: easily install the lib with a npm command
• using a file: manually download a file to include in your project

It is provided in two versions:

• With polyfills: contains methods not implemented on older JavaScript engines
• Without polyfills: does not contain modern method implementations, useful for apps built with React or Angular that already adding them

caution

Since the version 04.02.02.1b8c68e, the all-in-one package is no longer available. You will have to migrate to a modular delivery and only import modules you need.

Using NPM

The latest version is ....

You will need to add our repository:

npm config set @broadpeak:registry https://delivery-platform.broadpeak.tv/js/

Then, install dependencies following your integration type(s):

With player

Select your player:

GenericHLS.jsDash.jsShaka PlayerTHEOplayercastLabs PRESTOplayBitmovinKalturaRxPlayerNAGRA CONNECT Player SDKVOPlayerSamsung Tizen AVPlayLG webOS nativeHbbTV 1.XNAGRA CONNECT Player React NativeTHEOplayer React Native

# for all integrations
npm install @broadpeak/smartlib --save

# for an analytics integration, add these modules
npm install @broadpeak/smartlib-analytics --save
npm install @broadpeak/smartlib-hlsjs --save

# for an analytics only integration, add these modules
npm install @broadpeak/smartlib-analytics --save
npm install @broadpeak/smartlib-hlsjs --save

# for an ad insertion integration, add these modules
npm install @broadpeak/smartlib-analytics --save
npm install @broadpeak/smartlib-ad --save
npm install @broadpeak/smartlib-hlsjs --save

# for a real-time monitoring integration, add this module
npm install @broadpeak/smartlib-monitoring --save

# for a nanoCDN integration, add this module
npm install @broadpeak/smartlib-nanocdn --save

# for a diversity integration, add this module
npm install @broadpeak/smartlib-diversity --save

We highly recommend to use HLS.js 1.0.10, please ask Broadpeak if you need another version.

Without player

# for all integrations
npm install @broadpeak/smartlib --save

# if using React Native, add this module
npm install @broadpeak/smartlib-react-native --save

# for a real-time monitoring integration, add this module
npm install @broadpeak/smartlib-monitoring --save

# for a nanoCDN integration, add this module
npm install @broadpeak/smartlib-nanocdn --save

# for a diversity integration, add this module
npm install @broadpeak/smartlib-diversity --save

Import dependencies following your integration type(s):

With player

Select your player:

GenericHLS.jsDash.jsShaka PlayerTHEOplayercastLabs PRESTOplayBitmovinKalturaRxPlayerNAGRA CONNECT Player SDKVOPlayerSamsung Tizen AVPlayLG webOS nativeHbbTV 1.XNAGRA CONNECT Player React NativeTHEOplayer React Native

/**
 * In a module app (React, Angular)
 */

// for all integrations
import { SmartLib } from '@broadpeak/smartlib';

// for an analytics integration, import these modules
import '@broadpeak/smartlib-analytics';
import '@broadpeak/smartlib-hlsjs';

// for an analytics only integration, import these modules
import '@broadpeak/smartlib-analytics';
import '@broadpeak/smartlib-hlsjs';

// for an ad insertion integration, import these modules
import '@broadpeak/smartlib-analytics';
import '@broadpeak/smartlib-ad';
import '@broadpeak/smartlib-hlsjs';

// for a real-time monitoring integration, import this module
import '@broadpeak/smartlib-monitoring';

// for a nanoCDN integration, import this module
import '@broadpeak/smartlib-nanocdn';

// for a diversity integration, import this module
import '@broadpeak/smartlib-diversity';

/**
 * In a node app
 */
const SmartLib = require('@broadpeak/smartlib').SmartLib;

We highly recommend to use HLS.js 1.0.10, please ask Broadpeak if you need another version.

Without player

/** In a module app (React, Angular) **/
import { SmartLib } from '@broadpeak/smartlib'; // for all integrations

// if using React Native, import this module
import '@broadpeak/smartlib-react-native';

// for a real-time monitoring integration, import this module
import '@broadpeak/smartlib-monitoring';

// for a nanoCDN integration, import this module
import '@broadpeak/smartlib-nanocdn';

// for a diversity integration, import this module
import '@broadpeak/smartlib-diversity'; 

/** In a node app **/
const SmartLib = require('@broadpeak/smartlib').SmartLib;

Using JS file

Select a SmartLib package:

Type	Version	Description
Default version	...	For apps that do not require JavaScript backward compatibility or polyfills. This package can be used in React/Angular apps that are already handling it.	...
Compatibility version	...	For apps that require JavaScript backward compatibility but no polyfill. It transforms new JavaScript syntax to an older syntax to be compatible on older JavaScript engines.	...
Polyfill version	...	For apps that require JavaScript backward compatibility and polyfills. It transforms new JavaScript syntax to an older syntax and includes methods not implemented on older JavaScript engines.	...

Import dependencies following your integration type(s):

With player

Select your player:

GenericHLS.jsDash.jsShaka PlayerTHEOplayercastLabs PRESTOplayBitmovinKalturaRxPlayerNAGRA CONNECT Player SDKVOPlayerSamsung Tizen AVPlayLG webOS nativeHbbTV 1.XNAGRA CONNECT Player React NativeTHEOplayer React Native

<!-- for all integrations -->
<script src="base.smartlib.js"></script>

<!-- for an analytics integration, add these files -->
<script src="analytics.smartlib.js"></script>
<script src="hlsjs.smartlib.js"></script>

<!-- for an analytics only integration, add these files -->
<script src="analytics.smartlib.js"></script>
<script src="hlsjs.smartlib.js"></script>

<!-- for a ad insertion integration, add these files -->
<script src="analytics.smartlib.js"></script>
<script src="ad.smartlib.js"></script>
<script src="hlsjs.smartlib.js"></script>

<!-- for a real-time monitoring integration, add this file -->
<script src="monitoring.smartlib.js"></script>

<!-- for a nanoCDN integration, add this file -->
<script src="nanocdn.smartlib.js"></script>

<!-- for a diversity integration, add this file -->
<script src="diversity.smartlib.js"></script>

We highly recommend to use HLS.js 1.0.10, please ask Broadpeak if you need another version.

Without player

<!-- for all integrations -->
<script src="base.smartlib.js"></script>

<!-- if using React Native, add this file -->
<script src="reactnative.smartlib.js"></script>

<!-- for a real-time monitoring integration, add this file -->
<script src="monitoring.smartlib.js"></script>

<!-- for a nanoCDN integration, add this file -->
<script src="nanocdn.smartlib.js"></script>

<!-- for a diversity integration, add this file -->
<script src="diversity.smartlib.js"></script>

All necessary objects will be registered as global variables.