Comment on page

Migrate From v5

Why should you Migrate?
Firework Android SDK v6 is a ground-up re-built version of our Android SDK and thus not an incremental version of v5. This new version brings an improved video watching experience and seamless integration with a similar set of features for running short-form shoppable videos and setting up live-stream shopping in your apps. All the future major feature upgrades would be on top of v6. So it is mandatory to migrate if you want to make use of all the latest features being introduced. This guide will help you upgrade with ease.
Please discuss this with your Firework point of contact before deciding to go ahead with the migration.
Feature Comparison with V5
Last Updated July 19, 2023
Features
v5
v6
Discover Feed
✅
✅
Channel Feed
✅
✅
Playlist Feed
✅
✅
Playlist Group Feed
✅
Coming Soon
​Dynamic Content
✅
✅
Hashtag Feed
❌
✅
SKU Feed
❌
✅
Horizontal/Vertical/Grid Layouts
✅
✅
CTA button on Videos
✅
✅
CTA button click handler and listener
✅
✅
Shoppable Videos (Product Cards & Shopping experience
✅
✅
Video Analytics Events listener
✅
✅
Share button click listener
✅
✅
Feed item click listener
✅
✅
Video Player configurations
✅
✅
Share and Deep-link mechanism
✅
✅
Autoplay in Feed and its configuration
✅
✅
Livestream
✅
✅
IMA Ads
✅
✅
FWAI Ads
✅
✅
Storyblock
✅
✅
Picture in Picture(Outside App)
❌
✅
Picture in Picture(Inside App)
❌
✅
Multihost Livestream(Agora)
❌
✅
Low Latency Livestream
❌
✅
Retail Media Network (RMN) Ad support
❌
✅
Interstitial Ima Ad support
❌
✅
Interstitial FWAI Ad support
❌
✅
In-App Language Switching
✅
✅
Migration Steps
1. Update Dependencies
The new SDK is available in maven central so you have to add mavenCentral() in your repositories.
Remove the below dependencies from build.gradle
implementation 'com.github.loopsocial:firework_sdk:{sdk_version}' 
    
implementation 'com.github.loopsocial:AndroidAdsService:v20.0.0'
//or
implementation 'com.github.loopsocial:AndroidAdsService:v19.5.0'
//or
implementation 'com.github.loopsocial:AndroidAdsService:v19.8.0'
​
Add the following
def fireworkSdkVersion = "latest_firework_sdk_version"
​
implementation 'com.firework:sdk:$fireworkSdkVersion'
​
// Only for single host (Optional)
implementation 'com.firework.external.livestream:singleHostPlayer:$fireworkSdkVersion'
​
// Only for multi host (Optional)
implementation 'com.firework.external.livestream:multiHostPlayer:$fireworkSdkVersion'
​
//Either 1 of the below image loading related depedencies can be added.
// Glide Impl (Optional)
implementation 'com.firework.external.imageloading:glide:$fireworkSdkVersion'
​
// Picasso Impl (Optional)
implementation 'com.firework.external.imageloading:picasso:$fireworkSdkVersion'
​Learn more about dependencies of v6​
2. Android Manifest Changes
Remove the following activity from AndroidManifest.xml file as it is no longer required in v6.
//Activity needed for video playback
<activity android:name="com.loopnow.fireworklibrary.PlaybackActivity" />
​
In v5, If you enabled adding checksum to data reporting by adding the following snippet to AndroidManifest.xml, you can remove it. Enabling check sum is now part of SDK initialization which can be found in the next step.
<meta-data android:name="Firework:Checksum" android:value="true" />
3. SDK Initialization Changes
Remove the below initialization code required for v5, which must be added in your app's application class
FwSDK.initialize(this, clientId, userId, object : FwSDK.SdkStatusListener {
    override fun currentStatus(status: SdkStatus, extra: String) {
        Log.v("SdkStatusLog", "$status   -> $extra " )
        when(status) {
            SdkStatus.Initialized -> {
                Log.v("SdkStatusLog","Firework SDK Initialized");
            }
        }
    }
})
Instead, Initialize our v6 SDK as below in the onCreate() of Application class
// build Firework Android SDK configuration
        val config = FireworkSdkConfig.Builder(this)
            .checksumRequired(false)
            .clientId(FW_CLIENT_ID) // Client OAUTH Id
            .userId("example app user ID") // User Id in your eco-system
            .imageLoader(GlideImageLoaderFactory.createInstance()) // glide, picasso, or your ImageLoader implementation
            .enableCache(true) // Enable or disable video players cache, enabled by default
            .maxCacheSizeBytes(MAX_CACHE_SIZE_BYTES) // Max cache size used by video players, 25MB by default
            .muteOnLaunch(true) // Mute videos on lauch
            .addLivestreamPlayerInitializer(SingleHostLivestreamPlayerInitializer()) // For single-host livestream use
            .addLivestreamPlayerInitializer(MultiHostLivestreamPlayerInitializer()) // For multi-host livestream use
            .build()
        
        // initialize Firework Android SDK v6
        FireworkSdk.init(
            fireworkSdkConfig = config,
            onSuccess = {
                // Initialization was successful
            },
            onError = { error ->
                when (error) {
                    is FireworkInitError.InitializationError -> {
                        // Handle initialization error
                    }
                }
            },
        )
4. Updating Video Feed Layout Components
Update the video feed view component used in layout files. Change the following used in v5
<com.loopnow.fireworklibrary.views.VideoFeedView
            android:id="@+id/integrated_videofeed"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:feedLayout="grid" 
            app:feedType="discover"/>
To below VideoFeedView for v6
<com.firework.videofeed.FwVideoFeedView
        android:id="@+id/videoFeedView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:fw_columns="3"
        app:fw_feedLayout="grid"
        app:fw_feedResource="discovery"/>
Similarly, refer to the relevant pages for other types of feed layouts in v6.
5. Video Feed Configurations
In v6, video feed configurations can be done as attributes in FWVideoFeedView in XML layout or using ViewOptions builder in Java/Kotlin Classes. Refer below page for more details
Notable changes in v6 for Video Feed Configurations compared to v5 are:
1.Display/Hide the Video Title(Caption) - change from app:showTitle="true" to app:fw_showFeedTitle="true"
2.Update feed title position to app:fw_feedTitlePosition
3.Styling the title text is not using a style defined in the themes file. Instead, it can be configured using attributes for the VideoFeedView as defined in above linked page
4.Styling the thumbnail image style for corner radius is also now using attributes in FwVideoFeedView instead of style definition in the theme file
5.Fully Custom Feed Layouts are not supported currently in v6, but we provide more ways to customize it compared to v5. 
6.New Feed Configurations available in v6
1.Column Count for Grid View
2.Feed Background Color
3.Item Spacing for spacing between feed items
4.Enable or Disable Ads on Backward Swipe
5.Number of lines of the title text
6.Display or Hide Play icon on thumbnails
7.Ad badge background color
8.Ad badge text color
9.Ad Label
Configure Video Feed
6. Video Player
All the Video player properties supported in v5 are also supported in v6. But the implementation is a bit different as it is along with FwVideoFeedView properties.
So you will need to remove the VideoPlayerProperties initialization part of v5 and then add the configuration using view properties. Refer to the specifics of each Video Player Property as documented in the below link for v6.
Another change is that ad badge styling(done as style definitions in v5) can also be defined using FwVideoFeedView properties
Video Player
Add to Cart Button styling in v6 is as follows
<resources xmlns:tools="http://schemas.android.com/tools"> 
   
   <style name="FwShoppingAddToCartButtonStyle" parent="Widget.MaterialComponents.Button.TextButton">
           <item name="android:backgroundTint">@color/white</item>
           <item name="android:textColor">@color/blue</item>
           <item name="android:textSize">@dimen/16sp</item>
           <item name="android:theme">@style/Theme.MaterialComponents.Light</item>
           <item name="shapeAppearanceOverlay">@style/FwBayaAddToCartButtonShapeAppearance</item>
   </style>
   
   <style name="FwShoppingAddToCartButtonShapeAppearance">
           <item name="cornerFamily">rounded</item>
           <item name="cornerSizeTopLeft">6dp</item>
           <item name="cornerSizeBottomLeft">6dp</item> 
           <item name="cornerSizeBottomRight">6dp</item>
           <item name="cornerSizeTopRight">6dp</item>
   </style>
   
</resources>
Add to CTA Button styling in v6 is as follows
<resources xmlns:tools="http://schemas.android.com/tools"> 
   
        <style name="FwCtaButtonStyle" parent="FwCtaButtonParentStyle">
             <item name="android:backgroundTint">@color/fw_cta_bg_bluelake</item>
             <item name="android:textColor">@color/white</item>
             <item name="android:fontFamily">sans-serif</item>
             <item name="shapeAppearanceOverlay">@style/FwCtaButtonShapeAppearance</item>
        </style>
   
     <style name="FwCtaButtonShapeAppearance">
          <item name="cornerFamily">rounded</item>
          <item name="cornerSize">@dimen/fw_cta__button_size_half</item>
     </style>
   
</resources>
7. CTA Click Handling
If CTA click handler is not implemented by the host application, the default behaviour in v6 is to open the link in the default browser of the device, while in v5 it will open in a webview within the app.
Refer this page for implementation of CTA click handler in v6.
If you have implemented CTA click handling in v5, you can remove the below handler
//Return true if you have handled the event and do not want SDK to handle it and false when you want SDK to handle the  ctaClicked event. 
FwSDK.ctaClickHandler  = object : FwSDK.CtaClickHandler {
        override fun ctaClicked(label: String, actionUrl: String?): Boolean {
            return true
        }
    }
​
and instead, add the below handler and copy the custom navigation logic within this. Refer to below code.
@FwAnalyticCallable
fun onCtaButtonClicked(event: CtaButtonClickAnalyticsEvent) {
    Log.i("fw-analytics-cta", event.label + " " + event.actionUrl)
}
​
val playerOptions = PlayerOption.Builder()
    .sdkHandleCtaButtonClick(true) // This value here determines whether the SDK should handle the CTA click or not
    .build()
    
ViewOptions
        .Builder()
        .playerOption(playerOptions)
        .ctaOption(ctaOptions)
        .build()
8. Analytics - Event Listener Updates
We have improved analytics events coverage in v6 though there are differences in the way it is implemented. Refer the analytics page below for detailed information.
v5 Event
v6 Equivalent
video-impression
No separate event for this, but can be recorded based on other events like OnPlayingChanged or OnPrepared or OnProgress
video-start
OnStarted
video-first-quartile
OnFirstQuartile
video-midpoint
OnSecondQuartile
video-third-quartile
OnThirdQuartile
video-complete
OnEnded
video-session-end
OnEnded
video-ad-start
First **** trigger of OnProgress with isAd boolean true in event data
video-ad-end
OnEnded event with isAd = true in event data
video-click-cta
This can be logged in CtaButtonClickHandler **** as all the required data is provided along with feedElementAnalyticsData
videoShare
This can be logged in ShareButtonClickListener **** as all the required data is provided along with feedElementAnalyticsData
videoStartError
OnError
videoAdStartError
OnError with isAd = true
The event data is different from v5 and it provides the following values as part of VideoInfo object
val id: String, // content id
val caption: String, // content caption (title)
val duration: Double, // duration in seconds
val badge: String?, // text of the video badge
val playerHeight: Int?, // content width
val playerWidth: Int?, // content height
val hasCta: Boolean, // true if the video has "call to aciton" button
val isAd: Boolean // true if the video is an Ad video
val hashtags: List<String>, // Hashtags list added to the video
val feedType: String, // The feed resource type
val channelId: String? // Channel ID if the feed resource has one
val playlistId: String? // Playlist ID if the feed resource has one
Progress is not part of event data in v6, but triggered as a separate event every 1000 milliseconds
9. Updating Shopping Interfaces
Shopping Interfaces in v6 are much more advanced and you can customize the Shopping cart behaviour too. If you have currently implemented Shopping interfaces in v5, you can go ahead and remove the Baya.cartInterface and Baya.productInterface implementations first while saving the product hydration or cart update logic for your app. This will be needed for adding to the new interfaces provided in v6.
Refer to the below page for detailed implementation information on Shoppable videos on v6

Features	v5	v6
Discover Feed	✅	✅
Channel Feed	✅	✅
Playlist Feed	✅	✅
Playlist Group Feed	✅	Coming Soon
Dynamic Content	✅	✅
Hashtag Feed	❌	✅
SKU Feed	❌	✅
Horizontal/Vertical/Grid Layouts	✅	✅
CTA button on Videos	✅	✅
CTA button click handler and listener	✅	✅
Shoppable Videos (Product Cards & Shopping experience	✅	✅
Video Analytics Events listener	✅	✅
Share button click listener	✅	✅
Feed item click listener	✅	✅
Video Player configurations	✅	✅
Share and Deep-link mechanism	✅	✅
Autoplay in Feed and its configuration	✅	✅
Livestream	✅	✅
IMA Ads	✅	✅
FWAI Ads	✅	✅
Storyblock	✅	✅
Picture in Picture(Outside App)	❌	✅
Picture in Picture(Inside App)	❌	✅
Multihost Livestream(Agora)	❌	✅
Low Latency Livestream	❌	✅
Retail Media Network (RMN) Ad support	❌	✅
Interstitial Ima Ad support	❌	✅
Interstitial FWAI Ad support	❌	✅
In-App Language Switching	✅	✅

v5 Event	v6 Equivalent
video-impression	No separate event for this, but can be recorded based on other events like OnPlayingChanged or OnPrepared or OnProgress
video-start	OnStarted
video-first-quartile	OnFirstQuartile
video-midpoint	OnSecondQuartile
video-third-quartile	OnThirdQuartile
video-complete	OnEnded
video-session-end	OnEnded
video-ad-start	First ** trigger of OnProgress with** isAd boolean true in event data
video-ad-end	OnEnded event with isAd = true in event data
video-click-cta	This can be logged in CtaButtonClickHandler **** as all the required data is provided along with feedElementAnalyticsData
videoShare	This can be logged in ShareButtonClickListener **** as all the required data is provided along with feedElementAnalyticsData
videoStartError	OnError
videoAdStartError	OnError with isAd = true

Troubleshooting

Next - Android SDK

Integration Guide - V5

Last modified 4mo ago