AiactivUniversalSDK

Ads and Analytics Framework

Installation

To install AiactivUniversalSDK, run the following commands:

yarn add aiactiv-universal-sdk
npx pod-install

iOS

You need to add the following code to your Info.plist file and replace FILL_YOUR_WRITE_KEY_HERE with your write key:

<key>AiactivSDKConfig</key>
<dict>
  <key>writeKey</key>
	<string>FILL_YOUR_WRITE_KEY_HERE</string>
</dict>

By default, we use the same write key for both ads and analytics. If you want to use a different write key for ad network, you can add another key-value pair like this:

<key>AiactivSDKConfig</key>
<dict>
  <key>writeKey</key>
  <string>FILL_YOUR_WRITE_KEY_HERE</string>

  <key>writeKeyForAdNetwork</key>
  <string>FILL_YOUR_WRITE_KEY_HERE</string>
</dict>

Import the AiactivUniversalSDK module in your UIApplicationDelegate

#import <WebKit/WebKit.h>
#import <AiactivUniversalSDK/AiactivUniversalSDK-Swift.h>

Configure a AiactivUniversalSDK shared instance in your app delegate's application(_:didFinishLaunchingWithOptions:) method

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
  // Override point for customization after application launch.

  [Aiactiv startWithConfig:nil];

  return [super application:application didFinishLaunchingWithOptions:launchOptions];
}

Android

You need to add the following code to your app manifest file, inside the tag and replace FILL_YOUR_WRITE_KEY_HERE with your write key:

<meta-data
  android:name="io.aiactiv.sdk.WRITE_KEY"
  android:value="FILL_YOUR_WRITE_KEY_HERE" />

By default, we use the same write key for both ads and analytics. If you want to use a different write key for ad network, you can add another meta-data like this:

<meta-data
  android:name="io.aiactiv.sdk.WRITE_KEY"
  android:value="FILL_YOUR_WRITE_KEY_HERE" />

<meta-data
  android:name="io.aiactiv.sdk.WRITE_KEY_ADNETWORK"
  android:value="FILL_YOUR_WRITE_KEY_HERE" />

Usage

AdNetwork

Banner Ad

import { BannerAdView } from 'aiactiv-universal-sdk';

// ...
<BannerAdView
  ref={bannerAdRef}
  size="320x150"
  unitID={YOUR_INVENTORY_ID}
  context={{
    // This is optional
    title: 'Got Talents show',
    keywords: 'movie, show, hot',
    screen: 'Home',
  }}
  onAdLoaded={() => console.log('JS onAdLoaded')}
  onAdFailedToLoad={(e) => console.log('JS onAdFailedToLoad', e)}
  onAdClicked={(url) => {
    // If onAdClicked isn't declared, open browser automatically when user click Ad
    Linking.openURL(url);
  }}
/>;

// ...
bannerAdRef.current.reloadAd();

Predefined sizes:

| AdSize | Width x Height | | :-------------: | :------------: | | banner | 320x50 | | fullBanner | 468x60 | | largeBanner | 320x100 | | rectangle | 250x250 | | mediumRectangle | 300x250 | | video | 480x360 |

Or custom any size in format widthxheight. Example: 640x480, 300x500...

Adaptive Banner Ad

import { BannerAdView } from 'aiactiv-universal-sdk';

// ...
<BannerAdView
  ref={bannerAdRef}
  size="320x150"
  unitID={YOUR_INVENTORY_ID}
  context={{
    // This is optional
    title: 'Got Talents show',
    keywords: 'movie, show, hot',
    screen: 'Home',
  }}
  adaptiveSize={Dimensions.get('window').width} // SDK will calculate height automatically base on Ad ratio
  onAdLoaded={() => console.log('JS onAdLoaded')}
  onAdFailedToLoad={(e) => console.log('JS onAdFailedToLoad', e)}
  onAdClicked={(url) => {
    // If onAdClicked isn't declared, open browser automatically when user click Ad
    Linking.openURL(url);
  }}
/>;

// ...
bannerAdRef.current.reloadAd();

Video Ad

To display a video ad, you need to use the VideoAdLoader function to get the vast tag URL from Aiactiv platform and then use your own player to play it.

import { VideoAdLoader } from 'aiactiv-universal-sdk';

VideoAdLoader.loadAd(YOUR_INVENTORY_ID, 'video')
  .then((vastTagUrl) => {
    console.log('JS onAdLoader', vastTagUrl);
    // Then using your own player to play this vastTagUrl
  })
  .catch((e) => {
    console.log('JS onAdFailedToLoad', e);
    // Or handle error occurs
  });

Analytics

Analytics will be initialized automatically and collect data for you. You can also manually track events with the following methods:

Track Events

import { Analytics } from 'aiactiv-universal-sdk';

Analytics.track(name: string, properties?: TrackPropertyType);

To track an event, you need to call the Analytics.track() method and pass in two parameters: name and properties.

• The name parameter is a string to name the event, for example: "Post view", "Sign up", "Purchase", etc.
• The properties parameter is an object to contain detailed information about the event, for example: post title, product type, order value, etc.

// Create an object to contain the properties of the event
const postViewEventProperties = {
  title: 'Post Title',
  category: 'Category 1, Category 2',
  keyword: 'Keyword 1, Keyword 2, ...',
  ...
};

// Track the event "Post view" with the properties created
Analytics.track('Post view', postViewEventProperties);

Identify Events

import { Analytics } from 'aiactiv-universal-sdk';

Analytics.identify(userId: string, traits?: IdentifyTraitType);

To identify a user, you need to call the Analytics.identify() method and pass in one parameter: userId.

• The userId parameter is a string to identify your user, for example: "PartnerUserID-01".
• You can also pass in another object to contain additional information about the user, for example: user name, user type, etc.

// Create an object to contain the properties of the user
const userTraits = {
    userName: 'Username 1',
    userType: 'Normal',
    ...
};

// Identify user with user ID and properties created
Analytics.identify('PartnerUserID-01', userTraits)

Screen Events

import { Analytics } from 'aiactiv-universal-sdk';

Analytics.screen(title: string, properties?: ScreenPropertyType);

To track a screen, you need to call the Analytics.screen() method and pass in one parameter: title.

• The title parameter is a string to name the screen, for example: "Login Screen", "Home Screen", etc.
• You can also pass in another object to contain detailed information about the screen, for example: login method, number of posts, etc.

// Create an object to contain the properties of the screen
const loginScreenProperties = {
    loginMethod: 'FACEBOOK/GOOGLE/OTP/QR',
    ...
};

// Track screen with screen name and properties created
Analytics.screen(title: "LoginScreen", properties: loginScreenProperties)

Author

AiACTIV TECH, [email protected]

License

AiactivUniversalSDK is available under the MIT license. See the LICENSE file for more info.