logo

Youbora

This article is a good place to start if you are looking for information on how to configure the THEOplayer Youbora integration. The THEOplayer Youbora pre-integration is part of the Analytics API. On that page you will find detailed information on how to get started by setting up the Web SDK integration. An example implementation can be seen here: http://demo.theoplayer.com/youbora-analytics-test-page-20171025

Table of Contents

SDKs

Web SDK Android SDK iOS SDK tvOS SDK Android TV SDK Chromecast SDK
Yes Yes Yes No Yes Yes

Code example

If you are configuring the Android SDK (or iOS SDK) you should use the put method. As an example, in order to achieve a similar setting as on http://demo.theoplayer.com/youbora-analytics-test-page-20171025, you would use the following:

Web SDK

Make sure you load the Youbora plugin in the head of the page:

<script src="http://smartplugin.youbora.com/v6/js/adapters/theoplayer2/6.5.7/sp.min.js"></script>

Include the following in the SourceDescription object:

var youbora = {
    "integration": "youbora",
    "accountCode": "YOUR_YOUBORA_ACCOUNT_CODE",
    "enableAnalytics": true,
    "username": "THEO",
    "content.title": "THEO 1 (VOD)",
    "content.duration": 653,
    "content.isLive": false
};
var SourceDescription = {
    "sources": [typedSource]
    "analytics": [youbora],
};
Android (TV) SDK

There are two approaches to configuring Youbora.

  • Through the Player's Source
YouboraOptions youbora = YouboraOptions.Builder.youboraOptions("YOUR_YOUBORA_ACCOUNT_CODE")
    .put("enableAnalytics", "true")
    .put("username", "THEO")
    .put("content.title", "THEO 1 (VOD)")
    .put("content.duration", "653")
    .put("content.isLive", "false")
    .build();
SourceDescription sourceDescription = SourceDescription.Builder.sourceDescription()
    .sources(typedSource)
    .analytics(youbora)
    .build();
tpv.getPlayer().setSource(sourceDescription );
  • Through the Player's Configuration - Programmatically:
// create player config
THEOplayerConfig playerConfig = new THEOplayerConfig.Builder()
        .analytics(YouboraOptions.Builder.youboraOptions("YOUR_YOUBORA_ACCOUNT_CODE").build())
        .build();

// create player
THEOplayerView tpv = new THEOplayerView(this, playerConfig);
  • Or through the Players' Configuration - XML configuration:
<com.theoplayer.android.api.THEOplayerView
    android:id="@+id/theo_player_view"
    app:youboraAccountCode="YOUR_YOUBORA_ACCOUNT_CODE" />
iOS (/tvOS) SDK

First, create a YouboraOptions object and provide it to the player's configuration. This step is required to load the Youbora plugin adapter.

let youboraOptions = YouboraOptions(accountCode: "YOUR_YOUBORA_ACCOUNT_CODE")
youboraOptions.put(key: "enableAnalytics", value: "true")
let playerConfiguration = THEOplayerConfiguration(chromeless: true, analytics: [youboraOptions])

You can then provide different Youbora option objects per source you set:

let youbora = YouboraOptions(accountCode: "YOUR_YOUBORA_ACCOUNT_CODE")
youbora.put(key: "enableAnalytics", value: "true")
youbora.put(key: "username", value: "THEO")
youbora.put(key: "content.title", value: "THEO 1 (VOD)")
youbora.put(key: "content.duration", value: "653")
youbora.put(key: "content.isLive", value: "false")
let sourceDescription = SourceDescription(source : typedSource, analytics: [youbora])
github
Make sure to follow us on GitHub!
THEO-logo-white
twitter
facebook
linkedin
Copyright © 2020. All Rights Reserved.
Leuven
New York
Singapore
Barcelona