Neverending Perpetual Motion
    Have ideas to improve npm?Join in the discussion! »

    @adobe/react-native-acpmedia

    2.3.1 • Public • Published

    React Native AEP Media Extension

    npm version npm downloads CircleCI license

    @adobe/react-native-acpmedia is a wrapper around the iOS, tvOS and Android AEP Media SDK to allow for integration with React Native applications. Functionality to enable Adobe Media Analytics is provided entirely through JavaScript documented below.

    Installation

    You need to install the SDK with npm and configure the native Android/iOS project in your react native project. Before installing the Media extension it is recommended to begin by installing the Core extension and the Analytics extension.

    Note: If you are new to React Native we suggest you follow the React Native Getting Started page before continuing.

    1. Create React Native project

    First create a React Native project:

    react-native init MyReactApp

    Note: Follow React Native tvos support to create app with tvos target.

    2. Install JavaScript packages

    Install and link the @adobe/react-native-acpmedia package:

    cd MyReactApp
    npm install @adobe/react-native-acpmedia

    2.1 Link

    • React Native 0.60+

    CLI autolink feature links the module while building the app.

    • React Native <= 0.59
    react-native link @adobe/react-native-acpmedia

    Note For iOS using cocoapods, run:

    cd ios/ && pod install

    Tests

    This project contains jest unit tests which are contained in the __tests__ directory, to run the tests locally:

    make run-tests-locally
    

    Usage

    Media

    Importing the extension:
    import {ACPMedia} from '@adobe/react-native-acpmedia';
    Getting the extension version:
    ACPMedia.extensionVersion().then(version => console.log("AdobeExperienceSDK: ACPMedia version: " + version));
    Registering the extension with ACPCore:

    Note: It is recommended to initialize the SDK via native code inside your AppDelegate and MainApplication in iOS and Android respectively. However, you can still initialize the SDK in Javascript. For more information see how to initialize Core.

    iOS
    #import <RCTACPMedia/ACPMedia.h>
    
    [ACPMedia registerExtension];
    Android:
    import com.adobe.marketing.mobile.Media;
    
    Media.registerExtension();
    Javascript:
    import {ACPMedia} from '@adobe/react-native-acpmedia';
    
    ACPMedia.registerExtension();

    Media API:

    Create a media tracker:
    ACPMedia.createTracker().then(tracker =>
      this.setState({currentTracker: tracker})
    );
    Create a media tracker with optional configuration:
    var config = new Object();
    config[ACPMediaConstants.ACPMediaKeyConfigChannel] = "customer-channel";
    config[ACPMediaConstants.ACPMediaKeyConfigDownloadedContent] = true;
    ACPMedia.createTrackerWithConfig(config).then(tracker =>
      this.setState({currentTracker: tracker})
    );
    Create a Media object:
    let mediaObject = ACPMedia.createMediaObject("media-name", "media-id", 60, ACPMediaConstants.ACPMediaStreamTypeVod, ACPMediaType.Video);
    Create an AdBreak object:
    let adBreakObject = ACPMedia.createAdBreakObject("adbreak-name", 1, 0);
    Create an Ad object:
    let adObject = ACPMedia.createAdObject("media-name", "ad-id", 1, 30);
    Create a chapter object:
    let chapterObject = ACPMedia.createChapterObject('chapter-name', 2, 30, 1);
    Create a QoE object:
    let qoeObject = ACPMedia.createQoEObject(1000000, 2, 25, 10);
    Create a State object:
    let stateObject = ACPMedia.createStateObject(ACPMediaConstants.ACPMediaPlayerStateFullScreen);

    Media Tracker API:

    trackSessionStart:
    let mediaObject = ACPMedia.createMediaObject("media-name", "media-id", 60, ACPMediaConstants.ACPMediaStreamTypeVod, ACPMediaType.Video);
    var mediaMetadata = new Object();
    mediaMetadata[ACPMediaConstants.ACPVideoMetadataKeyShow] = "Sample Show";
    mediaMetadata[ACPMediaConstants.ACPVideoMetadataKeySeason] = "Sample Season";
    
    // Custom metadata keys
    mediaMetadata["isUserLoggedIn"] = "false";
    mediaMetadata["tvStation"] = "Sample TV station";
    
    tracker.trackSessionStart(mediaObject, mediaMetadata);
    trackPlay:
    tracker.trackPlay();
    trackPause:
    tracker.trackPause();
    trackComplete:
    tracker.trackComplete();
    trackSessionEnd:
    tracker.trackSessionEnd();
    trackError:
    tracker.trackError("errorId");

    trackEvent APIs

    Tracking AdBreaks

    trackEvent(AdBreakStart):
    let adBreakObject = ACPMedia.createAdBreakObject("adbreakName", 1, 0);
    tracker.trackEvent(ACPMediaEvent.EventAdBreakStart, adBreakObject, null);
    trackEvent(AdBreakComplete):
    tracker.trackEvent(ACPMediaEvent.EventAdBreakComplete, null, null);

    Tracking ads

    trackEvent(AdStart):
    let adObject = ACPMedia.createAdObject("adName", "adId", 1.0, 20.0);
    var adMetadata = new Object();
    adMetadata[ACPMediaConstants.ACPAdMetadataKeyAdvertiser] = "SampleAdvertiser";
    
    tracker.trackEvent(ACPMediaEvent.EventAdStart, adObject, adMetadata);
    trackEvent(AdSkip):
    tracker.trackEvent(ACPMediaEvent.EventAdSkip, null, null);
    trackEvent(AdComplete):
    tracker.trackEvent(ACPMediaEvent.EventAdComplete, null, null);

    Tracking chapters

    trackEvent(ChapterStart):
    let chapterObject = ACPMedia.createChapterObject("chapterName", 1.0, 30.0, 1.0);
    var chapterMetadata = new Object();
    chapterMetadata["segmentType"] = "Sample segment type";
    
    tracker.trackEvent(ACPMediaEvent.EventChapterStart, chapterObject, chapterMetadata);
    trackEvent(ChapterSkip):
    tracker.trackEvent(ACPMediaEvent.EventChapterSkip, null, null);
    trackEvent(ChapterComplete):
    tracker.trackEvent(ACPMediaEvent.EventChapterComplete, null, null);

    Tracking Player States

    trackEvent(StateStart):
    let stateObject = ACPMedia.createStateObject(ACPMediaConstants.ACPMediaPlayerStateFullScreen);
    
    tracker.trackEvent(ACPMediaEvent.EventStateStart, stateObject, null);
    trackEvent(StateEnd):
    let stateObject = ACPMedia.createStateObject(ACPMediaConstants.ACPMediaPlayerStateFullScreen);
    
    tracker.trackEvent(ACPMediaEvent.EventStateEnd, stateObject, null);

    Tracking Playback events

    trackEvent(BufferStart):
    tracker.trackEvent(ACPMediaEvent.EventBufferStart, null, null);
    trackEvent(BufferComplete):
    tracker.trackEvent(ACPMediaEvent.EventBufferComplete, null, null);
    trackEvent(SeekStart):
    tracker.trackEvent(ACPMediaEvent.EventSeekStart, null, null);
    trackEvent(SeekComplete):
    tracker.trackEvent(ACPMediaEvent.EventSeekComplete, null, null);

    Tracking bitrate changes

    trackEvent(BitrateChange):
    // If the new bitrate value is available provide it to the tracker.
    let qoeObject = ACPMedia.createQoEObject(2000000, 4, 23, 11);
    tracker.updateQoEObject(qoeObject);
    
    tracker.trackEvent(ACPMediaEvent.EventBitrateChange, null, null);
    updateCurrentPlayhead:
    tracker.updateCurrentPlayhead(1);
    updateQoEObject:
    let qoeObject = ACPMedia.createQoEObject(1000000, 2, 25, 10);
    tracker.updateQoEObject(qoeObject);

    Media Constants:

    MediaType:

    This defines the type of a media that is currently tracked.

    import {ACPMediaType} from '@adobe/react-native-acpmedia';
    
    ACPMediaType.Video
    ACPMediaType.Audio
    StreamType:

    This defines the stream type of the content that is currently tracked.

    import {ACPMediaConstants} from '@adobe/react-native-acpmedia';
    
    ACPMediaConstants.ACPMediaStreamTypeVod
    ACPMediaConstants.ACPMediaStreamTypeLive
    ACPMediaConstants.ACPMediaConstantsACPMediaStreamTypeLinear
    ACPMediaConstants.ACPMediaStreamTypePodcast
    ACPMediaConstants.ACPMediaStreamTypeAudiobook
    ACPMediaConstants.ACPMediaStreamTypeAod
    Standard video constants

    This defines the standard metadata keys for video streams.

    import {ACPMediaConstants} from '@adobe/react-native-acpmedia';
    
    ACPMediaConstants.ACPVideoMetadataKeyShow
    ACPMediaConstants.ACPVideoMetadataKeySeason
    ACPMediaConstants.ACPVideoMetadataKeyEpisode
    ACPMediaConstants.ACPVideoMetadataKeyAssetId
    ACPMediaConstants.ACPVideoMetadataKeyGenre
    ACPMediaConstants.ACPVideoMetadataKeyFirstAirDate
    ACPMediaConstants.ACPVideoMetadataKeyFirstDigitalDate
    ACPMediaConstants.ACPVideoMetadataKeyRating
    ACPMediaConstants.ACPVideoMetadataKeyOriginator
    ACPMediaConstants.ACPVideoMetadataKeyNetwork
    ACPMediaConstants.ACPVideoMetadataKeyShowType
    ACPMediaConstants.ACPVideoMetadataKeyAdLoad
    ACPMediaConstants.ACPVideoMetadataKeyMvpd
    ACPMediaConstants.ACPVideoMetadataKeyAuthorized
    ACPMediaConstants.ACPVideoMetadataKeyDayPart
    ACPMediaConstants.ACPVideoMetadataKeyFeed
    ACPMediaConstants.ACPVideoMetadataKeyStreamFormat
    Standard audio constants

    This defines the standard metadata keys for audio streams.

    import {ACPMediaConstants} from '@adobe/react-native-acpmedia';
    
    ACPMediaConstants.ACPAudioMetadataKeyArtist
    ACPMediaConstants.ACPAudioMetadataKeyAlbum
    ACPMediaConstants.ACPAudioMetadataKeyLabel
    ACPMediaConstants.ACPAudioMetadataKeyAuthor
    ACPMediaConstants.ACPAudioMetadataKeyStation
    ACPMediaConstants.ACPAudioMetadataKeyPublisher
    Standard ad constants

    This defines the standard metadata keys for ads.

    import {ACPMediaConstants} from '@adobe/react-native-acpmedia';
    
    ACPMediaConstants.ACPAdMetadataKeyAdvertiser
    ACPMediaConstants.ACPAdMetadataKeyCampaignId
    ACPMediaConstants.ACPAdMetadataKeyCreativeId
    ACPMediaConstants.ACPAdMetadataKeyPlacementId
    ACPMediaConstants.ACPAdMetadataKeySiteId
    ACPMediaConstants.ACPAdMetadataKeyCreativeUrl
    Player state constants
    import {ACPMediaConstants} from '@adobe/react-native-acpmedia';
    
    ACPMediaConstants.ACPMediaPlayerStateFullScreen
    ACPMediaConstants.ACPMediaPlayerStatePictureInPicture
    ACPMediaConstants.ACPMediaPlayerStateClosedCaption
    ACPMediaConstants.ACPMediaPlayerStateInFocus
    ACPMediaConstants.ACPMediaPlayerStateMute
    Media events

    This defines the type of a tracking event.

    import {ACPMediaEvent} from '@adobe/react-native-acpmedia';
    
    ACPMediaEvent.EventAdBreakStart
    ACPMediaEvent.EventAdBreakComplete
    ACPMediaEvent.EventAdStart
    ACPMediaEvent.EventAdComplete
    ACPMediaEvent.EventAdSkip
    ACPMediaEvent.EventChapterStart
    ACPMediaEvent.EventChapterComplete
    ACPMediaEvent.EventChapterSkip
    ACPMediaEvent.EventSeekStart
    ACPMediaEvent.EventSeekComplete
    ACPMediaEvent.EventBufferStart
    ACPMediaEvent.EventBufferComplete
    ACPMediaEvent.EventBitrateChange
    Media resume

    Constant to denote that the current tracking session is resuming a previously closed session. This information must be provided when starting a tracking session.

    import {ACPMediaConstants} from '@adobe/react-native-acpmedia';
    
    ACPMediaConstants.ACPMediaKeyMediaResumed

    Contributing

    See CONTRIBUTING

    License

    See LICENSE

    Install

    npm i @adobe/react-native-acpmedia

    DownloadsWeekly Downloads

    235

    Version

    2.3.1

    License

    Apache-2.0

    Unpacked Size

    27.9 MB

    Total Files

    94

    Last publish

    Collaborators

    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar