Overview

In Acoustic Campaign, marketers can enhance their mobile app messages by adding actions. They can guide their customers to a certain path by asking them to complete a certain action. The actions added to the messages are defined by developers in the Acoustic Campaign UI. The type of action defined in the UI is mapped to plugins in the app or to the base Campaign SDK. The SDK then initiates the action based on the type received in a notification, and the customer is directed to the respective path.

Types of actions

Acoustic Campaign provides several built-in actions and plugins for additional custom actions. You can also customize the provided plugins to add actions or write your own custom action plugins.

Standard actions

The Standard actions are provided by Acoustic and are built-in the Campaign product. They are available in the UI for developers to create these actions. The following are the Standard actions provided:

  • Open app
  • Open dialer
  • Open URL
  • Show in-box notification

Acoustic Campaign also provides plugins for additional custom actions. Install the plugins and register the actions. You can also Register an action through a JSON file.

📘

Tip

For Android, registering the action through JSON is preferred.

📘

Note ( iOS only)

When you use the 'MceNotificationActionRegistry.registerNotificationAction' method to register a notification action, the registered callback function is called whether the app is running in the foreground or the background. After the app is terminated, the method is not called for the action provided. To enable the app to react to notification action when the app is not running, use the JSON configuration file method.

Snooze action plugin

The Snooze plugin allows a user to bring back the mobile app message after some time. This action removes the notification from the notification bar and restores it after a number of minutes.

Install the snooze action plugin

To add the snooze action,

  1. Go to Mobile > Developer Resources > Actions from the left navigation menu.
  2. From the Actions page, scroll to the iOS actions text area and click New Action.
  3. From the dropdown, select Snooze action, and the template code is automatically added to the iOS actions text area.
  4. Click Save in the top right of the screen before leaving the page.

Enable the snooze action template

The following example shows how to register the plugins in your AppDelegate method for iOS:

  1. Create a registerPlugins method in the AppDelegate class if one does not already exist.
  2. In the registerPlugins method, add the following code to register the snooze action plugin. The registerPlugins method should be called in the AppDelegate didFinishLaunchingWithOptions method.

🚧

Note:

You must have initialized the SDK before registering the snooze plugin in AppDelegate.

@implementation AppDelegate - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions { [self registerPlugins]; // ... } -(void)registerPlugins { [SnoozeActionPlugin registerPlugin]; // ... } @end
class AppDelegate: UIResponder, UIApplicationDelegate { func registerPlugins(){ SnoozeActionPlugin.register() // ... } func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication. LaunchOptionsKey : Any]? = nil) -> Bool { registerPlugins() // ... } }

Send an API push with snooze action support.

To send a push notification with a snooze action, send the following to your payload.

📘

Note:

The following payload is for the push/sends API (/channels/push/sends).

{ "channelQualifiers": [ "gcxxxxxxxxx", "apxxxxxxxxx" ], "content": { "simple": { "apns": { "aps": { "alert": { "title": "s are delicious", "subtitle": "some subtitle", "body": "somebody" } }, "category-actions": [ { "name": "Snooze notification", "type": "snooze", "value": { "time": 1 }, { "name": "Open app", "type": "openApp" } ] }, "gcm": { "alert": { "subject": "Robits", "message": "s are awesome", "notification-action": { "type": "openApp", "name": "Open App", "value": null } } } } }, "contacts": [ { "channel": { "qualifier": "apxxxxxxxxx", "destination": "wwwwww|yyyyyy" } }, { "channel": { "qualifier": "gcxxxxxxxxx", "destination": "wwwwww|yyyyyy" } } ], "campaignName": "Test Push Notifications" }

Where:

  • 'xxxxxxxxx' – is the value for the channelQualifiers in the payload. Replace it with your specific appKey.
  • 'wwwwww|yyyyyy' – is the destination value in the payload. Replace it with your specific values for userId and channelId.

📘

Note:

Android provides snooze support for notifications for Android 8+, with full support in Android 12.

To install the snooze plugin, run the following command

npm install --save <sdk folder>/plugins/react-native-acoustic-mobile-push-snooze

📘

Note:

The Snooze plugin is only for iOS, as Android provides snooze support for notifications for Android 8+, with full support in Android 12.

To register the plugin:

  • Import the Acoustic mobile push snooze module to your React component:
  • import { NativeModules, Platform } from 'react-native'; const { // Other Native Modules... RNAcousticMobilePushSnooze, } = NativeModules;
  • Add plugin registration using the SnoozeAction value after the component is mounted.
  • componentDidMount() { if (Platform.OS == 'ios') { // Enable other plugins registration... RNAcousticMobilePushSnooze.registerPlugin("SnoozeAction"); } }

Send an API push with snooze action support.

To send a push notification with a snooze action, send the following to your payload.

{ "campaignName": "iOS Simple Push", "pushes": [ { "userId": "{{userId}}", "simpleMessages": [ { "appKey": "{{appKey}}", "channelId": "{{channelId}}", "content": { "aps": { "alert": { "title": "Testing Snooze", "subtitle": "Test push notification", "body": "Push payload body" }, "sound": "default" }, "category-actions": [ { "name": "Snooze notification", "type": "snooze", "value": { "time": 1 } }, { "name": "Open app", "type": "openApp" } ] } } ] } ] }

Where you must update the {{userId}},{{appKey}}, and {{channelId}} values to match the values in your environment.

To install the snooze plugin, run the following command

cordova plugin add <path to downloaded directory>/plugins/co.acoustic. mobile.push.plugin.snooze cordova prepare

To register the plugin:

@implementation AppDelegate - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions { [self registerPlugins]; // ... } -(void)registerPlugins { [SnoozeActionPlugin registerPlugin]; // ... } @end

Send an API push with snooze action support

To send a push notification with a snooze action, send the following to your payload.

{ "campaignName": "iOS Simple Push", "pushes": [ { "userId": "{{userId}}", "simpleMessages": [ { "appKey": "{{appKey}}", "channelId": "{{channelId}}", "content": { "aps": { "alert": { "title": "Testing Snooze", "subtitle": "Test push notification", "body": "Push payload body" }, "sound": "default" }, "category-actions": [ { "name": "Snooze notification", "type": "snooze", "value": { "time": 1 } }, { "name": "Open app", "type": "openApp" } ] } } ] } ] }
update the {{userId}},{{appKey}}, and {{channelId}} values to match the values in your environment.

  1. To install the plugin, add these lines to your application's .csproj:
    
    
    <Compile Include="..\..\..\plugins\Actions\Snooze\SnoozeAction.Forms.cs"> <Link>Plugins\Action Plugins\SnoozeAction.Forms.cs</Link> <Folder Include="Plugins\Action Plugins\Snooze Action\" />
  2. As well as
    
    
    <Folder Include="Plugins\Action Plugins\Snooze Action\" />
  3. In the App.xaml.cs file, add a line to register the action:
    
    
    SDK.Instance.RegisterAction("snooze", new SnoozeAction())
  4. Add the associated Snooze plugin files to your application.

The snooze data is implemented when the page is initialized.

  1. Add the snooze plug-in to the pubspec.yaml file under dependencies.
flutter_acoustic_mobile_push_snooze: path: ../../plugins/flutter_acoustic_mobile_push_snooze
  1. Go to the SDK zip file and open the plugins folder. Then go to the snooze plugin folder and open the libs folder. From the libs folder, copy the flutter_acoustic_mobile_push_snooze.dart file into your applications libs folder.
  2. Import the snooze plug-in into the dart file.
import 'package:flutter_acoustic_mobile_push_snooze/flutter_acoustic_mobile_push_snooze.dart';

You can now reference the methods within the snooze.dart file.

Display web action plugin

The display web view allows a push notification to open a web address in your application instead of opening the browser application on the device like the URL action.

Install the display web action plugin

To add the display web action,

  1. Go to Mobile > Developer Resources > Actions from the left navigation menu.
  2. From the Actions page, scroll to the iOS actions text area and click New Action.
  3. From the dropdown, select Display web action, and the template code is automatically added to the iOS actions text area.
  4. Click Save in the top right of the screen before leaving the page.

Enable the web action template

The following example shows how to register the plugins in your AppDelegate method for iOS:

  1. Create a registerPlugins method in the AppDelegate class if one does not already exist.
  2. In the registerPlugins method, add the following code to register the display web action plugin. The registerPlugins method should be called in the AppDelegate didFinishLaunchingWithOptions method.

🚧

Note:

You must have initialized the SDK before registering the web action plugin in AppDelegate.

@implementation AppDelegate - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions { [self registerPlugins]; // ... } -(void)registerPlugins { [DisplayWebViewPlugin registerPlugin]; // ... } @end
class AppDelegate: UIResponder, UIApplicationDelegate { func registerPlugins(){ DisplayWebViewPlugin.register() // ... } func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication. LaunchOptionsKey : Any]? = nil) -> Bool { registerPlugins() // ... } }

Send an API push with display web action support.

To send a push notification with a display web action, send the following to your payload.

📘

Note:

The following payload is for the push/sends API (/channels/push/sends).

{ "channelQualifiers": [ "gcxxxxxxxxx", "apxxxxxxxxx" ], "content": { "simple": { "apns": { "aps": { "alert": { "title": "Display web view", "subtitle": "web subtitle here", "body": "web subtitle here" } }, "notification-action": { "name": "Display Web", "type": "displayWebView", "value": { "url": "https://www.acoustic.com" } } }, "gcm": { "alert": { "subject": "Display web view", "message": "web message here", "notification-action": { "name": "Display Web", "type": "displayWebView", "value": { "url": "https://www.acoustic.com" } } } } } }, "contacts": [ { "channel": { "qualifier": "apxxxxxxxxx", "destination": "wwwwww|yyyyyy" } }, { "channel": { "qualifier": "gcxxxxxxxxx", "destination": "wwwwww|yyyyyy" } } ], "campaignName": "Test Push Notifications" }

Where:

  • 'xxxxxxxxx' – is the value for the channelQualifiers in the payload. Replace it with your specific appKey.
  • 'wwwwww|yyyyyy' – is the destination value in the payload. Replace it with your specific values for userId and channelId.

The following example shows how to register the display web action plugin for Android:

  1. Extract and add the acoustic-mobile-push-android-sdk-plugin-displayweb-<version number>.zip and acoustic-mobile-push-android-sdk-plugin-displayweb-<version number>.aar files from the plugins folder in the SDK package to your project as an Android library.
  2. In your app/src/main/assets/mce.plugins folder add a plugin-displayweb. json file if it does not already exist.
  3. The MceApplication.java class is already set up to read all json plugins from this directory; ensure that you define the json correctly, as shown in the following example.
{ "notification-actions": [ { "type": "displayweb", "class": "co.acoustic.mobile.push.sdk.plugin.displayweb.DisplayWebViewAction" } ] }

To install the Display Web plugin, run the following command

npm install --save <sdk folder>/plugins/react-native-acoustic-mobile-push-displayweb

📘

Note:

The plugin is available for both Android and iOS platforms.

To register the plugin:

  • Import the Acoustic mobile push display web module to your React component:
import { NativeModules, Platform } from 'react-native'; const { // Other Native Modules... RNAcousticMobilePushDisplayWeb, } = NativeModules;
  • Add plugin registration using the DisplayWebAction value after the component is mounted.
componentDidMount() { if (Platform.OS == 'ios') { // Enable other plugins registration... RNAcousticMobilePushDisplayWeb.registerPlugin("DisplayWebAction"); } }

Send an API push with display web action support.

To send a push notification with a display web push notification action, send the following to your payload.

{ "campaignName": "Android Simple Push", "pushes": [ { "userId": "{{userId}}", "simpleMessages": [ { "appKey": "{{appKey}}", "channelId": "{{channelId}}", "content": { "alert": { "subject": "Testing Display Web", "message": "Push payload body", "notification-action": { "name": "Display Web", "type": "displayWeb", "value": "{{webURL}}" } } } } ] } ] }
{ "campaignName": "iOS Simple Push", "pushes": [ { "userId": "{{userId}}", "simpleMessages": [ { "appKey": "{{appKey}}", "channelId": "{{channelId}}", "content": { "aps": { "alert": { "title": "Testing Display Web", "subtitle": "Test push notification", "body": "Push payload body" }, "sound": "default" }, "notification-action": { "name": "Display Web", "type": "displayWebView", "value": { "url": "{{webURL}}" } } } } ] } ] }

Where you must update the {{userId}},{{appKey}}, and {{channelId}} values to match the values in your environment.

To install the Display Web plugin, run the following command

cordova plugin add <path to downloaded directory>/plugins/co.acoustic. mobile.push.plugin.snooze cordova prepare

📘

Note:

The plugin is available for both Android and iOS platforms.

To register the plugin:

@implementation AppDelegate - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions { [self registerPlugins]; // ... } -(void)registerPlugins { [MCEDisplayWebPlugin registerPlugin]; // ... } @end

Send an API push with display web action support

To send a push notification with a display web push notification action, send the following to your payload.

{ "campaignName": "Android Simple Push", "pushes": [ { "userId": "{{userId}}", "simpleMessages": [ { "appKey": "{{appKey}}", "channelId": "{{channelId}}", "content": { "alert": { "subject": "Testing Display Web", "message": "Push payload body", "notification-action": { "name": "Display Web", "type": "displayWeb", "value": "{{webURL}}" } } } } ] } ] }
{ "campaignName": "iOS Simple Push", "pushes": [ { "userId": "{{userId}}", "simpleMessages": [ { "appKey": "{{appKey}}", "channelId": "{{channelId}}", "content": { "aps": { "alert": { "title": "Testing Display Web", "subtitle": "Test push notification", "body": "Push payload body" }, "sound": "default" }, "notification-action": { "name": "Display Web", "type": "displayWebView", "value": { "url": "{{webURL}}" } } } } ] } ] }

Where you must update the {{userId}},{{appKey}}, and {{channelId}} values to match the values in your environment.

  1. Add these lines to your application's .csproj:
    
    
    <Compile Include="..\..\..\plugins\Actions\DisplayWeb\DisplayWeb.Forms.cs"> <Link>Plugins\Action Plugins\DisplayWeb.Forms.cs</Link> </Compile>
  2. As well as:
    
    
    <Folder Include="Plugins\Action Plugins\DisplayWeb Action\" />
  3. In the App.xaml.cs file, add these lines to register the action:
    
    
    // iOS and Android use different names for this plugin var displayWebAction = new WebViewAction(); SDK.Instance.RegisterAction("displayWebView", displayWebAction); SDK.Instance.RegisterAction("displayweb", displayWebAction);
  4. Add the associated DisplayWeb plugin files that ship with the SDK.

The web data is implemented when the page is initialized.

  1. Add the web action (displayweb) plug-in to the pubspec.yaml file under dependencies.
flutter_acoustic_mobile_push_displayweb: path: ../../plugins/flutter_acoustic_mobile_push_displayweb
  1. Go to the SDK zip file and open the plugins folder. Then go to the web action plugin folder and open the libs folder. From the libs folder, copy the flutter_acoustic_mobile_push_displayweb.dart file into your applications lib folder.
  2. Import the web action plug-in into the dart file.
import 'package:flutter_acoustic_mobile_push_displayweb/flutter_acoustic_mobile_push_displayweb.dart';

You can now reference the methods within the displayweb.dart file.

Calendar plugin

The Calendar plugin allows a push notification to add an event to the calendar. For this plugin, there is an interactive push and a non-interactive push. The interactive action will open the UI in the app for creating a new event on the calendar with pre-populated fields such as event title, timezone, start date, and end date. The non-interactive push will automatically add the event to the calendar with the pre-populated fields as soon as the notification is tapped.

Install the calendar plugin

To add the calendar action,

  1. Go to Mobile > Developer Resources > Actions from the left navigation menu.
  2. From the Actions page, scroll to the iOS actions text area and click New Action.
  3. From the dropdown, select Calendar action, and the template code is automatically added to the iOS actions text area.
  4. Click Save in the top right of the screen before leaving the page.

Enable the calendar plugin template

The following example shows how to register the plugins in your AppDelegate method for iOS:

  1. Create a registerPlugins method in the AppDelegate class if one does not already exist.
  2. In the registerPlugins method, add the following code to register the calendar plugin. The registerPlugins method should be called in the AppDelegate didFinishLaunchingWithOptions method.

🚧

Note:

You must have initialized the SDK before registering the calendar plugin in AppDelegate.

@implementation AppDelegate - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions { [self registerPlugins]; // ... } -(void)registerPlugins { [AddToCalendarPlugin registerPlugin]; // ... } @end
class AppDelegate: UIResponder, UIApplicationDelegate { func registerPlugins(){ AddToCalendarPlugin.register() // ... } func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication. LaunchOptionsKey : Any]? = nil) -> Bool { registerPlugins() // ... } }

Send an API push with calendar action support.

To send a push notification with a calendar action, send the following to your payload.

📘

Note:

The following payload is for the push/sends API (/channels/push/sends).

{ "channelQualifiers": [ "gcxxxxxxxxx", "apxxxxxxxxx" ], "content": { "simple": { "apns": { "aps": { "alert": { "title": "Calendar Action", "subtitle": "subtitle here", "body": "subtitle here" } }, "notification-action": { "name": "Calendar", "type": "calendar", "value": { "title": "Event Title", "timeZone": "PST", "startDate": "<the event start datetime iso format>", "endDate": "<the event end datetime iso format>", "interactive": true } } }, "gcm": { "alert": { "subject": "Calendar Action", "message": "message here", "notification-action": { "name": "Calendar", "type": "calendar", "starts": { "title": "Event Title", "timezone": "PST", "date": "2022-11-10", "time": "12:08" }, "ends": { "title": "Event Title", "timezone": "PST", "date": "2022-11-12", "time": "12:08", "interactive": true } } } } } }, "contacts": [ { "channel": { "qualifier": "apxxxxxxxxx", "destination": "wwwwww|yyyyyy" } }, { "channel": { "qualifier": "gcxxxxxxxxx", "destination": "wwwwww|yyyyyy" } } ], "campaignName": "Test Push Notifications" }

Where:

  • 'xxxxxxxxx' – is the value for the channelQualifiers in the payload. Replace it with your specific appKey.
  • 'wwwwww|yyyyyy' – is the destination value in the payload. Replace it with your specific values for userId and channelId.

The following example shows how to register the calendar plugin for Android:

  1. Extract and add the acoustic-mobile-push-android-sdk-plugin-calendar-<version number>.zip and acoustic-mobile-push-android-sdk-plugin-calendar-<version number>.aar files from the plugins folder in the SDK package to your project as an Android library.
  2. In your app/src/main/assets/mce.plugins folder add a plugin-calendar. json file if it does not already exist.
  3. The MceApplication.java class is already set up to read all json plugins from this directory; ensure that you define the json correctly, as shown in the following example.
{ "notification-actions": [ { "type": "calendar", "class": "co.acoustic.mobile.push.sdk.plugin.calendar.AddToCalendarAction" } ] }

To install the Calendar plugin, run the following command

npm install --save <sdk folder>/plugins/react-native-acoustic-mobile-push-calendar

📘

Note:

The plugin is available for both Android and iOS platforms.

To register the plugin:

  • Import the Acoustic mobile calendar module to your React component:
import { NativeModules, Platform } from 'react-native'; const { // Other Native Modules... RNAcousticMobilePushCalendar, } = NativeModules;
  • Add plugin registration using the CalendarAction value after the component is mounted.
componentDidMount() { if (Platform.OS == 'ios') { // Enable other plugins registration... RNAcousticMobilePushCalendar.registerPlugin("CalendarAction"); } }

Send an API push with calendar action support.

To send a push notification with a calendar push notification action, send the following to your payload.

{ "campaignName": "Android Simple Push", "pushes": [ { "userId": "{{userId}}", "simpleMessages": [ { "appKey": "{{appKey}}", "channelId": "{{channelId}}", "content": { "alert": { "subject": "Calendar Action", "message": "message here", "notification-action": { "name": "Calendar", "type": "calendar", "starts": { "title": "Event Title", "timezone": "PST", "date": "2022-11-10", "time": "12:08" }, "ends": { "title": "Event Title", "timezone": "PST", "date": "2022-11-12", "time": "12:08", "interactive": true } } } } } ] } ] }
{ "campaignName": "iOS Simple Push", "pushes": [ { "userId": "{{userId}}", "simpleMessages": [ { "appKey": "{{appKey}}", "channelId": "{{channelId}}", "content": { "aps": { "alert": { "title": "Testing Calendar", "subtitle": "Test push notification", "body": "Push payload body" }, "sound": "default" }, "notification-action": { "type": "calendar", "name": "Calendar", "value": { "title": "Event Title", "timeZone": "PST", "startDate": "{{$isoTimestamp}}", "endDate": "{{$isoTimestamp}}", "interactive": true } } } } ] } ] }

Where you must update the {{userId}},{{appKey}}, and {{channelId}} values to match the values in your environment.

To install the Calendar plugin, run the following command

cordova plugin add <path to downloaded directory>/plugins/co.acoustic. mobile.push.plugin.calendar cordova prepare

📘

Note:

The plugin is available for both Android and iOS platforms.

To register the plugin:

@implementation AppDelegate - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions { [self registerPlugins]; // ... } -(void)registerPlugins { [MCECalendarPlugin pluginInitialize]; // ... } @end

Send an API push with calendar action support

To send a push notification with a calendar push notification action, send the following to your payload.

"campaignName": "Android Simple Push", "pushes": [ { "userId": "{{userId}}", "simpleMessages": [ { "appKey": "{{appKey}}", "channelId": "{{channelId}}", "content": { "alert": { "subject": "Calendar Action", "message": "message here", "notification-action": { "name": "Calendar", "type": "calendar", "starts": { "title": "Event Title", "timezone": "PST", "date": "2022-11-10", "time": "12:08" }, "ends": { "title": "Event Title", "timezone": "PST", "date": "2022-11-12", "time": "12:08", "interactive": true } } } } } ] } ] }
{ "campaignName": "iOS Simple Push", "pushes": [ { "userId": "{{userId}}", "simpleMessages": [ { "appKey": "{{appKey}}", "channelId": "{{channelId}}", "content": { "aps": { "alert": { "title": "Testing Calendar", "subtitle": "Test push notification", "body": "Push payload body" }, "sound": "default" }, "notification-action": { "type": "calendar", "name": "Calendar", "value": { "title": "Event Title", "timeZone": "PST", "startDate": "{{$isoTimestamp}}", "endDate": "{{$isoTimestamp}}", "interactive": true } } } } ] } ] }

Where you must update the {{userId}},{{appKey}}, and {{channelId}} values to match the values in your environment.

  1. In your application's .csproj file, add the resources:
    
    
    <Compile Include="..\..\..\plugins\Actions\Calendar\CalendarAction.Forms.cs"> <Link>Plugins\Action Plugins\CalendarAction.Forms.cs</Link> </Compile>
  2. As well as:
    
    
    <Folder Include="Plugins\Action Plugins\Calendar Action\" />
  3. In the App.xaml.cs file, add these lines to register the action:
    
    
    SDK.Instance.RegisterAction("calendar", new CalendarAction());
  4. Add the associated Calendar plugin files that ship with the SDK.

The calendar data is implemented when the page is initialized.

  1. Add the calendar plug-in to the pubspec.yaml file under dependencies.
flutter_acoustic_mobile_push_calendar: path: ../../plugins/flutter_acoustic_mobile_push_calendar
  1. Go to the SDK zip file and open the plugins folder. Then go to the calendar plugin folder and open the libs folder. From the libs folder, copy the flutter_acoustic_mobile_push_calendar.dart file into your applications lib folder.
  2. Import the calendar plug-in into the dart file.
import 'package:flutter_acoustic_mobile_push_calendar/flutter_acoustic_mobile_push_calendar.dart';

You can now reference the methods within the calendar.dart file.

Carousel plugin

The carousel plugin allows a push notification to add a carousel of photos and videos to the notification interface.

The push notification appears as a standard notification. The first image appears with its label when the user expands the notification. The label is the name of the image action. At the bottom of the notification, the Next and Previous buttons are located. Users move through the carousel's images by clicking the Next and Previous buttons. When the user clicks the button, the image changes to the next/previous image and label. The image slides into view from the right, and the next image is downloaded in the background. Clicking on the image or the text removes the notification and performs the image action.

Install the carousel action plugin

  1. Open the Xcode project and select File > New > Target.
  2. Select Notification Content Extensionand click Next.
  3. Select Carousel as the product name,ObjC as the language, and click Finish.
  4. Replace the contents of NotificationViewController.h, NotificationViewController.m, inInterface.storyboard, and info.plist with the files in the Image Carousel Plugin folder.
  5. Select Carousel Target and setup code signing by selecting a Team in the General tab.
  6. Add CarouselAction.h and CarouselAction.m to Application Target.
  7. Register the carousel plugin in the application delegate AppDelegate.m file.
  8. Add carouselAction.h to the list of import statements as shown in the following example:
    
    
    // Action Plugins #import "ActionMenuPlugin.h" #import "AddToCalendarPlugin.h" #import "AddToPassbookPlugin.h" #import "SnoozeActionPlugin.h" #import "DisplayWebViewPlugin.h" #import "TextInputActionPlugin.h" #import "ExamplePlugin.h" #import "CarouselAction.h" // add this line // MCE Inbox Plugins #import "MCEInboxActionPlugin.h" #import "MCEInboxPostTemplate.h" #import "MCEInboxDefaultTemplate.h" // MCE InApp Plugins #import "MCEInAppVideoTemplate.h" #import "MCEInAppImageTemplate.h" #import "MCEInAppBannerTemplate.h"

The following example shows how to register the plugins in your AppDelegate method for iOS:

  1. Create a registerPlugins method in the AppDelegate class if one does not already exist.
  2. In the registerPlugins method, add the following code to register the carousel plugin. The registerPlugins method should be called in the AppDelegate didFinishLaunchingWithOptions method.

🚧

Note:

You must have initialized the SDK before registering the carousel plugin in AppDelegate.

@implementation AppDelegate - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions { [self registerPlugins]; // ... } -(void)registerPlugins { [CarouselAction registerPlugin]; // ... } @end
class AppDelegate: UIResponder, UIApplicationDelegate { func registerPlugins(){ CarouselAction.register() // ... } func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication. LaunchOptionsKey : Any]? = nil) -> Bool { registerPlugins() // ... } }

Send an API push with carousel action support.

To send a push notification with a carousel action, send the following to your payload.

📘

Note:

The following payload is for the push/sends API (/channels/push/sends).

{ "channelQualifiers": [ "gcxxxxxxxxx", "apxxxxxxxxx" ], "content": { "simple": { "apns": { "aps": { "mutable-content": 1, "category": "carousel", "alert": { "title": "Testing Title", "subtitle": "Testing Subtitle", "body": "Testing Body" }, "sound": "default" }, "notification-action": { "type": "carousel", "value": 0 }, "category-name": "carousel", "category-actions": [ { "type": "next", "name": "Next" }, { "type": "prev", "name": "Previous" }, { "type": "carousel", "name": "Open", "destructive": false, "authentication": true, "foreground": true } ], "carousel": { "items": [ { "url": "https://upload.wikimedia.org/wikipedia /commons/thumb/2/24/LEGO_logo.svg/100px-LEGO_logo.svg.png", "text": "Speed" }, { "url": "https://upload.wikimedia.org/wikipedia /commons/thumb/2/24/LEGO_logo.svg/100px-LEGO_logo.svg.png", "text": "Agriculture" }, { "url": "https://upload.wikimedia.org/wikipedia /commons/thumb/2/24/LEGO_logo.svg/100px-LEGO_logo.svg.png", "text": "Containers" }, { "url": "https://upload.wikimedia.org/wikipedia /commons/thumb/2/24/LEGO_logo.svg/100px-LEGO_logo.svg.png", "text": "Connected" }, { "url": "https://upload.wikimedia.org/wikipedia /commons/thumb/2/24/LEGO_logo.svg/100px-LEGO_logo.svg.png", "text": "Cloud" } ] } } } }, "contacts": [ { "channel": { "qualifier": "apxxxxxxxxx", "destination": "wwwwww|yyyyyy" } }, { "channel": { "qualifier": "gcxxxxxxxxx", "destination": "wwwwww|yyyyyy" } } ], "campaignName": "Test Push Notifications" }

Where:

  • 'xxxxxxxxx' – is the value for the channelQualifiers in the payload. Replace it with your specific appKey.
  • 'wwwwww|yyyyyy' – is the destination value in the payload. Replace it with your specific values for userId and channelId.

The following example shows how to register the carousel plugin for Android:

  1. Extract and add the acoustic-mobile-push-android-sdk-plugin-carousel-<version number>.zip and acoustic-mobile-push-android-sdk-plugin-carousel-<version number>.aar files from the plugins folder in the SDK package to your project as an Android library.
  2. In your app/src/main/assets/mce.plugins folder, add a plugin-carousel. json file if it does not already exist.
  3. The MceApplication.java class is already set up to read all json plugins from this directory; ensure that you define the json correctly, as shown in the following example.
{ "notification-types": [ { "name": "carousel", "class": "co.acoustic.mobile.push.sdk.plugin.carousel.CarouselNotifi cationType" } ] }

To install the Carousel plugin, run the following command

npm install --save <sdk folder>/plugins/react-native-acoustic-mobile-push-imagecarousel

📘

Note:

The plugin is available for both Android and iOS platforms.

To register the plugin:

  • Import the Acoustic mobile push image carousel event handler:
import { NativeEventEmitter, NativeModules } from 'react-native'; const { // Other Event handler... RNAcousticMobilePushImageCarousel, } = NativeModules; export const RNAcousticMobilePushImageCarouselEmitter = new NativeEventEmitter(RNAcousticMobilePushImageCarousel);
  • Add plugin event listener RNAcousticMobilePushImageCarouselEmitter using the CarouselClickEvent value after the component is mounted.
componentDidMount() { this.setState({ subscriptions: [ // Other event listeners... RNAcousticMobilePushImageCarouselEmitter.addListener ("CarouselClickEvent", (e) => { // Handle dialog box action or replace it with your custom action: Alert.alert( e.dialogTitle, e.dialogMsg, [ { text: "Okay", onPress: () => {} } ] ); /////////// }) ] }); }
  • Remove subscriptions when the component is no longer mounted.
componentWillUnmount() { const { subscriptions } = this.state; subscriptions.forEach((subscription) => subscription.remove()); }

Send an API push with carousel action support.

To send a push notification with an image carousel push notification action, send the following to your payload.

{ "campaignName": "Android Simple Push", "pushes": [ { "userId": "{{userId}}", "simpleMessages": [ { "appKey": "{{appKey}}", "channelId": "{{channelId}}", "content": { "alert": { "subject": "Carousel Action", "message": "message here", "soundResourceId": 2131623, "vibrationEnabled": true, "vibrationPattern": 0, "lightsEnabled": true, "type": "carousel", "lights": [0, 1], "number": 2, "payload": { "category-name": "carousel", "carousel": [ { "image": "https://upload.wikimedia.org/wikipedia /commons/thumb/2/24/LEGO_logo.svg/100px-LEGO_logo.svg.png", "text": "Speed", "action": { "type": "carouselIteration", "name": "Lego" } }, { "image": "https://agriculture.ny.gov/sites/g/files /oee1031/files/styles/quick_links_square/public/media/2019/07 /Agricultural%20districts%20hero.jpg?h=d668167d&itok=1fa52g6P", "text": "Agriculture", "action": { "type": "carouselIteration", "name": "Agriculture" } }, { "image": "https://cdn.shopify.com/s/files/1/0196 /1722/products/LargeShippingContainers-11_100x.jpg?v=1447169372", "text": "Containers", "action": { "type": "carouselIteration", "name": "Containers" } }, { "image": "https://www.connectedvehicles.com/wp- content/uploads/2019/08/Connect-Fleet-with-OnCommand-100x100.png", "text": "Connected", "action": { "type": "carouselIteration", "name": "Connected" } }, { "image": "https://res.infoq.com/articles/cloud-to- cloudlets-data-processing/en/smallimage/cloud-to-cloudlets-data- processing-s-1601399656392.jpeg", "text": "Cloud", "action": { "type": "carouselIteration", "name": "Cloud" } } ] }, "mutable-content": 1, "category": "carousel", "title": "Testing Title", "subtitle": "Testing Subtitle", "body": "Testing Body", "sound": "default", "notification-action": { "type": "carousel", "value": 0 } } } } ] } ] }
{ "campaignName": "iOS Simple Push", "pushes": [ { "userId": "{{userId}}", "simpleMessages": [ { "appKey": "{{appKey}}", "channelId": "{{channelId}}", "content": { "aps": { "mutable-content": 1, "category": "carousel", "alert": { "title": "Testing Title", "subtitle": "Testing Subtitle", "body": "Testing Body" }, "sound": "default" }, "notification-action": { "type": "carousel", "value": 0 }, "category-name": "carousel", "category-actions": [ { "type": "next", "name": "Next" }, { "type": "prev", "name": "Previous" }, { "type": "carousel", "name": "Open", "destructive": false, "authentication": true, "foreground": true } ], "carousel": { "items": [ { "url": "https://upload.wikimedia.org /wikipedia/commons/thumb/2/24/LEGO_logo.svg/100px-LEGO_logo.svg.png", "text": "Speed" }, { "url": "https://upload.wikimedia.org /wikipedia/commons/thumb/2/24/LEGO_logo.svg/100px-LEGO_logo.svg.png", "text": "Agriculture" }, { "url": "https://upload.wikimedia.org /wikipedia/commons/thumb/2/24/LEGO_logo.svg/100px-LEGO_logo.svg.png", "text": "Containers" }, { "url": "https://upload.wikimedia.org /wikipedia/commons/thumb/2/24/LEGO_logo.svg/100px-LEGO_logo.svg.png", "text": "Connected" }, { "url": "https://upload.wikimedia.org /wikipedia/commons/thumb/2/24/LEGO_logo.svg/100px-LEGO_logo.svg.png", "text": "Cloud" } ] } } } ] } ] }

Where you must update the {{userId}},{{appKey}}, and {{channelId}} values to match the values in your environment.

Wallet (Passbook) plugin

The Wallet plugin allows a push notification to add a pass to the Wallet on the device.

Install the Wallet (Passbook) plugin

To add the Wallet (Passbook) action,

  1. Go to Mobile > Developer Resources > Actions from the left navigation menu.
  2. From the Actions page, scroll to the iOS actions text area and click New Action.
  3. From the dropdown, select Wallet menu, and the template code is automatically added to the iOS actions text area.
  4. Click Save in the top right of the screen before leaving the page.

Enable the Wallet action template

The following example shows how to register the plugins in your AppDelegate method for iOS:

  1. Create a registerPlugins method in the AppDelegate class if one does not already exist.
  2. In the registerPlugins method, add the following code to register the Wallet plugin. The registerPlugins method should be called in the AppDelegate didFinishLaunchingWithOptions method.

🚧

Note:

You must have initialized the SDK before registering the Wallet plugin in AppDelegate.

@implementation AppDelegate - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions { [self registerPlugins]; // ... } -(void)registerPlugins { [AddToWalletPlugin registerPlugin]; // ... } @end
class AppDelegate: UIResponder, UIApplicationDelegate { func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication. LaunchOptionsKey : Any]? = nil) -> Bool { registerPlugins() // ... } func registerPlugins(){ AddToWalletPlugin.register() // ... } }

Send an API push with Wallet support

To send a push notification with a Wallet pass, send the following to your payload.

📘

Note:

The following payload is for the push/sends API (/channels/push/sends).

{ "channelQualifiers": [ "apxxxxxxxxx" ], "content": { "simple": { "apns": { "aps": { "alert": { "title": "Wallet", "subtitle": "subtitle here", "body": "subtitle here" } }, "notification-action": [ "name": "Wallet", "type": "passbook", "value": { "url": "URL TO THE .PKPASS FILE FOR THE WALLET TO USE" } ] } } }, "contacts": [ { "channel": { "qualifier": "apxxxxxxxxx", "destination": "wwwwww|yyyyyy" } } ], "campaignName": "Test Push Notifications" }

Where:

  • 'xxxxxxxxx' – is the value for the channelQualifiers in the payload. Replace it with your specific appKey.
  • 'wwwwww|yyyyyy' – is the destination value in the payload. Replace it with your specific values for userId and channelId.

To install the Wallet plugin, run the following command

npm install --save <sdk folder>/plugins/react-native-acoustic-mobile-push-wallet

📘

Note:

The plugin is available only for iOS platform.

To register the plugin:

  • Import the Acoustic mobile wallet module to your React component:
import { NativeModules, Platform } from 'react-native'; const { // Other Native Modules... RNAcousticMobilePushWallet, } = NativeModules;
  • Add plugin registration using WalletAction value after the component is mounted.
componentDidMount() { if (Platform.OS == 'ios') { // Enable other plugins registration... RNAcousticMobilePushWallet.registerPlugin("WalletAction"); } }

Send an API push with wallet action support

To send a push notification with a wallet push notification action, send the following to your payload.

{ "campaignName": "iOS Simple Push", "pushes": [ { "userId": "{{userId}}", "simpleMessages": [ { "appKey": "{{appKey}}", "channelId": "{{channelId}}", "content": { "aps": { "alert": { "title": "Wallet/Passbook", "subtitle": "Test push notification", "body": "Push payload body" }, "sound": "default" }, "notification-action": { "name": "Wallet", "type": "passbook", "value": { "url": "https://acoustic-demo.s3.us-east-2. amazonaws.com/Acoustic.pkpass" } } } } ] } ] }

Where you must update the {{userId}},{{appKey}}, and {{channelId}} values to match the values in your environment.

To install the Wallet plugin, run the following command

cordova plugin add <path to downloaded directory>/plugins/co.acoustic. mobile.push.plugin.passbook cordova prepare

📘

Note:

The plugin is available only for iOS platform.

To register the plugin:

@implementation AppDelegate - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions { [self registerPlugins]; // ... } -(void)registerPlugins { [AddToWalletPlugin registerPlugin]; // ... } @end

Send an API push with wallet action support

To send a push notification with a wallet push notification action, send the following to your payload.

{ "campaignName": "iOS Simple Push", "pushes": [ { "userId": "{{userId}}", "simpleMessages": [ { "appKey": "{{appKey}}", "channelId": "{{channelId}}", "content": { "aps": { "alert": { "title": "Wallet/Passbook", "subtitle": "Test push notification", "body": "Push payload body" }, "sound": "default" }, "notification-action": { "name": "Wallet", "type": "passbook", "value": { "url": "https://acoustic-demo.s3.us-east-2. amazonaws.com/Acoustic.pkpass" } } } } ] } ] }

Where you must update the {{userId}},{{appKey}}, and {{channelId}} values to match the values in your environment.

Action Menu plugin

The Action Menu plugin allows a push notification to display a menu of provided actions on tap. The provided actions can be any of the other plugins supported by the SDK (e.g. Dial, Display Web, Open App, etc.). Once a menu item is tapped, the action will be performed.

Install the Action Menu plugin

To add the Action Menu action,

  1. Go to Mobile > Developer Resources > Actions from the left navigation menu.
  2. From the Actions page, scroll to the iOS actions text area and click New Action.
  3. From the dropdown, select Action Menu, and the template code is automatically added to the iOS actions text area.
  4. Click Save in the top right of the screen before leaving the page.

When you create an Action Menu message, you must first add the Action Menu action to your message. After that, you can add any action that you would like to appear as an item in the action menu.

For example:

  1. Add the Action Menu action to your message first.
  2. Add a Dial action
  3. Add an Open App action.
  4. Add an Open URL action.

In your push notification, you will see that the notification shows a menu with the three actions (Dial, Open, URL) that each performs an action when tapped.

Enable the Action Menu action template

The following example shows how to register the plugins in your AppDelegate method for iOS:

  1. Create a registerPlugins method in the AppDelegate class if one does not already exist.
  2. In the registerPlugins method, add the following code to register the Action Menu plugin. The registerPlugins method should be called in the AppDelegate didFinishLaunchingWithOptions method.

🚧

Note:

You must have initialized the SDK before registering the Action Menu plugin in AppDelegate.

@implementation AppDelegate - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions { [self registerPlugins]; // ... } -(void)registerPlugins { [ActionMenuPlugin registerPlugin]; // ... } @end
class AppDelegate: UIResponder, UIApplicationDelegate { func registerPlugins(){ ActionMenuPlugin.register() // ... } func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication. LaunchOptionsKey : Any]? = nil) -> Bool { registerPlugins() // ... } }

Send an API push with Action Menu action support

To send a push notification with an action menu, send the following to your payload. Each action in the category-actions section of the payload can be interchanged with any of the action plugins supported by the SDK. The maximum amount of actions in a single payload is 10.

📘

Note:

The following payload is for the push/sends API (/channels/push/sends).

{ "channelQualifiers": [ "apxxxxxxxxx" ], "content": { "simple": { "apns": { "aps": { "alert": { "title": "Action Menu", "subtitle": "subtitle here", "body": "subtitle here" } }, "notification-action": { "name": "Action Menu", "type": "showactions" }, "category-actions": [ { "name": "Open App", "type": "openApp" }, { "name": "Dial", "type": "dial", "value": "8456084889" }, { "name": "Display Web", "type": "displayWebView", "value": { "url": "https://www.google.com" } } ] } } }, "contacts": [ { "channel": { "qualifier": "apxxxxxxxxx", "destination": "wwwwww|yyyyyy" } } ], "campaignName": "Test Push Notifications" }

Where:

  • 'xxxxxxxxx' – is the value for the channelQualifiers in the payload. Replace it with your specific appKey.
  • 'wwwwww|yyyyyy' – is the destination value in the payload. Replace it with your specific values for userId and channelId.

To install the Action menu plugin, run the following command

npm install --save <sdk folder>/plugins/react-native-acoustic-mobile-push-action-menu

📘

Note:

The plugin is available only for iOS platform.

To register the plugin:

  • Import the Acoustic mobile push action menu module to your React component:
import { NativeModules, Platform } from 'react-native'; const { // Other Native Modules... RNAcousticMobilePushActionMenu, } = NativeModules;
  • Add plugin registration using ActionMenuAction value after the component is mounted.
componentDidMount() { if (Platform.OS == 'ios') { // Enable other plugins registration... RNAcousticMobilePushActionMenu.registerPlugin("ActionMenuAction"); } }

Send an API push with action menu action support.

To send a push notification with an action menu push notification with the following three actions: open app, dial, and display web; send the following to your payload.

{ "campaignName": "iOS Simple Push", "pushes": [ { "userId": "{{userId}}", "simpleMessages": [ { "appKey": "{{appKey}}", "channelId": "{{channelId}}", "content": { "aps": { "alert": { "title": "Action Menu", "subtitle": "Test push notification", "body": "Push payload body" }, "sound": "default" }, "notification-action": { "name": "Action Menu", "type": "showactions" }, "category-actions":[ { "name": "Open App", "type": "openApp" }, { "name": "Dial", "type": "dial", "value":"1234567899" }, { "name": "Display Web", "type": "displayWebView", "value": { "url": "https://www.google.com" } } ] } } ] } ] }

Where you must update the {{userId}},{{appKey}}, and {{channelId}} values to match the values in your environment.

To install the Action menu plugin, run the following command

cordova plugin add <path to downloaded directory>/plugins/co.acoustic. mobile.push.plugin.action-menu cordova prepare

📘

Note:

The plugin is available only for iOS platform.

To register the plugin:

@implementation AppDelegate - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions { [self registerPlugins]; // ... } -(void)registerPlugins { [ActionMenuPlugin registerPlugin]; // ... } @end

Send an API push with action menu action support

To send a push notification with an action menu push notification action, send the following to your payload.

{ "campaignName": "iOS Simple Push", "pushes": [ { "userId": "{{userId}}", "simpleMessages": [ { "appKey": "{{appKey}}", "channelId": "{{channelId}}", "content": { "aps": { "alert": { "title": "Action Menu", "subtitle": "Test push notification", "body": "Push payload body" }, "sound": "default" }, "notification-action": { "name": "Action Menu", "type": "showactions" }, "category-actions":[ { "name": "Open App", "type": "openApp" }, { "name": "Dial", "type": "dial", "value":"1234567899" }, { "name": "Display Web", "type": "displayWebView", "value": { "url": "https://www.google.com" } } ] } } ] } ] }

Where you must update the {{userId}},{{appKey}}, and {{channelId}} values to match the values in your environment.

Text input action plugin

You can create and send notifications that prompt users for text. When the user receives the input notification, the user clicks an action that expands and displays a text input field. After the user enters text into the field, the notification is canceled.

Android N devices and Android M (and lower devices) require different implementations for text input notifications. For Android N devices, you implement text input notifications by using the input notification action type in an expandable notification action. For Android M devices (and lower), you implement a retrieval mechanism that receives text inputs and cancels the notification.

Android N devices

Create an input notification action by overriding 'co.acoustic.mobile.push.sdk.api.notification. MceNotificationAction' with the following code, which extends 'co.acoustic.mobile.push.sdk.api.notification.MceNotificationAction.Handling' with the direct reply:

public void handleAction(Context context, String input, String type, String name, String attribution, Map payload, boolean fromNotification);

Android M (and lower) devices

  1. Implement co.acoustic.mobile.push.sdk.api.notification.MceNotificationInput and return an instance in the following method:
public MceCustomNotificationInput getCustomInput();
  1. Configure the following method to retrieve the text input and call the action when the user clicks the action.
public void createCustomInput(Context context, String type, String name, String attribution, Map payload)

To install the Text input plugin, run the following command

npm install --save <sdk folder>/plugins/react-native-acoustic-mobile-push-textinput

📘

Note:

The plugin is available only for Android platform.

👍

Registration

The plugin registration is already completed in the Acoustic plugin code.

Send an API push with text input action support.

To send a push notification with a text input action, send the following to your payload.

{ "campaignName": "Android Simple Push", "pushes": [ { "userId": "{{userId}}", "simpleMessages": [ { "appKey": "{{appKey}}", "channelId": "{{channelId}}", "content": { "alert": { "subject": "Testing Text Input", "message": "Push payload body", "type": "textinput", "notification-action": { "name": "Text Input", "type": "textinput" } } } } ] } ] }

Where you must update the {{userId}},{{appKey}}, and {{channelId}} values to match the values in your environment.

Custom actions

You can customize the plugins provided to create custom actions or create custom action plugins. You can create your own custom action notification implementation for new action types. Custom action notifications override the predefined action types in the SDK, such as dial, URL, and openApp.

Custom action methods are defined by the developer and run when an action is selected by the user with the registered type value. An example of this would be for the developer to create a method that handles viewProduct action types. The developer registers that method with the MCEActionRegistry system. Then, a push message comes in with the "notification-action" set to type="viewProduct", and the app user opens the mobile app message.

Requirements for custom action types

When a custom action type for a mobile app message is used, the marketer must also include the destructive, authentication, and foreground keys in the action definition.

The "aps" section is used for system displayed notifications.

The {{type}} of action can be anything. Predefined action types include "dial" and "url". If the {{type}} is "rich", "dial", or "url", then the destructive is false, authentication is false, and foreground is true; otherwise, those attributes need to be included.

The {{value}} depends on the type of action. If the type is "dial", then the value is a phone number to be dialed. If the type is "url", then the value is the url that is to be viewed. If the type is "rich", then the value is the rich content ID to be displayed. When the type is anything else, it is handled by the plug-in that is defined for that type.

The {{name}} of the action is the title that shows on the button. If the {{type}} is not "rich", "dial", or "url", the following keys need to be defined in the action:

  • {{destructive}} can be either true or false. This sets the style of the action button.

  • {{authentication}} can be either true or false. This allows actions to be performed with the device is locked when true.

  • {{foreground}} can be either true or false. If it is true, then the app is opened when a selection is made. If it is false, then the app is not opened.

Create custom actions

The iOS SDK provides three custom actions that you can implement:

  • Custom action using a single argument type payload
  • Custom action using an action payload and a full iOS payload
  • Custom action for text entry fields

The following example shows implementing a custom action using a single argument type. You can customize your dynamic action category types by registering your object and selector with the MCEActionRegistry class. See the following code example:


-(instancetype)init { if(self=[super init]) { MCEActionRegistry * registry = [MCEActionRegistry sharedInstance]; [registry registerTarget: [self sharedInstance] withSelector:@selector(customAction:) forAction: @"customAction"]; } return self; ]

When a notification is opened with the customAction type, your custom method is run.


-(void)customAction:(NSDictionary*)action { // Do something neat with the action payload here! }

Example of custom action using an action payload and full iOS payload. This custom action is demonstrated in the Action Menu plug-in in the sample app. The following code sample shows how to register the custom action.


MCEActionRegistry * registry = [MCEActionRegistry sharedInstance]; [registry registerTarget: [self sharedInstance] withSelector: @selector(executeAction:withPayload:) forAction: @"custom"];

The following code shows how to implement the custom action.


-(void)executeAction:(NSDictionary*)action withPayload:(NSDictionary*)payload { // the action dictionary contains the action that is being executed, eg: {"type": "custom", "value":"foo"} // the payload dictionary includes the full APNS payload, e.g. {"aps": {...}} }

You can create your own custom action notification implementation for new action types. Custom action notifications override the pre-defined action types in the SDK, such as dial, url, and openApp.

  1. To create a custom action notification, you must implement co.acoustic.mobile.push.sdk.api.notification.MceNotificationAction.
    
    
    import co.acoustic.mobile.push.sdk.api.notification.MceNotificationAction public class MyCustomAction implements MceNotificationAction { /** * This method is called when a notification action is clicked. * @param context The application context * @param type The notification action type * @param name The notification action name (can be null) * @param attribution The notification attribution (can be null) * @param payload The notification payload. The map contains the key value pairs from the notification action payload. * @param fromNotification true if this action is called from a notification and false otherwise */ public void handleAction(Context context, String type, String name, String attribution, Map payload, boolean fromNotification) { // your implementation here } /** * Initiates the action with the given options * @param context The application's context * @param initOptions The initialization options */ public void init(Context context, JSONObject initOptions){ // your implementation here } /** * Updates the action with the given options - not is use yet * @param context The application's context * @param updateOptions The update options */ public void update(Context context, JSONObject updateOptions) { // your implementation here } /** * This method is called when a notification with this action as its main action. If it returns false, the notification will not be shown. * This can be used in case there are preparations needed before the notification can be shown. * @param context The application's context * @param notificationDetails The received notification * @param sourceBundle The bundle that contained the notification * @return true to show the notification and false to not show it */ public boolean shouldDisplayNotification(Context context, NotificationDetails notificationDetails, Bundle sourceBundle) { // your implementation here } }
  2. To register your custom action for a specific type, add the following code.
    
    
    import co.acoustic.mobile.push.sdk.api.notification.MceNotificationActionRegistry MceNotificationActionRegistry.registerNotificationAction("snooze", new MyCustomAction());

Action plugins can be used to extend the behavior executed when a message is interacted with. Push messages, InApp messages and Inbox messages all use actions to define what happens when a user interacts with them. You can register your own action handlers written in javascript using the registerAction function. (See the send-email-action.js in the sample application for an example).

Custom actions can also be written in javascript:


import {NativeEventEmitter} from 'react-native'; import {RNAcousticMobilePushActionHandler} from 'NativeModules'; const emitter = new NativeEventEmitter(RNAcousticMobilePushActionHandler); export default function demonstrationAction(details) { // details.action contains the specific action payload ie {"type": "demonstration", "value": "acoustic"} // details.payload contains the entire push payload ie { "aps": { "alert": "test" }, "notification-action": {"type": "demonstration", "value": "acoustic"} } // You can place code here to use the values in those payloads to perform work on behalf of the user } // The registerAction call tells the SDK that you intend to handle actions of this type. In addition the function passed will be called for any missed actions received while your code was not running. RNAcousticMobilePushActionHandler.registerAction('demonstration', demonstrationAction); // The listener call allows this function to be called when actions arrive emitter.addListener('demonstration', demonstrationAction);

To include custom actions in your application, you must put them in a space-separated list in the custom actions key in the config.xml file. After that, you can register for callbacks to those actions through the MCEPlugin.setRegisteredActionCallback function. The callback includes both the action payload and the entire push payload for processing that action.

Register custom action callback

You have to register a callback with one or two arguments, the action, and the payload, for a specific custom action using the following:

MCEPlugin.setRegisteredActionCallback(callback, customActionName);

The following is an example of how to register the callback for the custom action:

MCEPlugin.setRegisteredActionCallback(function (action, payload) { const elem = document.getElementById('title'); const newText = action['value']; elem.innerText = newText; }, 'customUrl');
  1. Implement a subclass of AcousticMobilePush.Forms.PushAction.
    
    
    public class CustomAction : PushAction { }
  2. Override the required Handle Action: method.
    
    
    public override void HandleAction (JObject action, JObject payload, string attribution, string mailingId, int id) {
  3. Register the custom action class with the action registry at Application subclass creation startup.
    
    
    SDK.Instance.RegisterAction(“customAction”, new CustomAction());

To create a custom action, you must pass user input through a register() function and send it to the SDK. The Flutter SDK then registers it as a custom action.

  1. Import the following packages.
import 'package:flutter/material.dart'; import 'package:flutter_acoustic_mobile_push/flutter_acoustic_sdk_push.dart';
  1. Create local variable:
var value = CustomActionValue();
  1. Add the registerCustomAction function to send the data to the SDK.
Future<void> registerCustomAction(String actionType) async { value.registerCustomAction(actionType); value.registeredEvent.subscribe((args) { var data = args!.changedValue; print('registering'); print(data); setState(() { statusValue = data; }); }); }
  1. The register function then passes the user input data to the registerCustomAction function.
register() { _yourFormKeyHere.currentState?.save(); if (_customActionType == null) { return Text(statusValue, style: TextStyle(color: labelColor)); } else { registerCustomAction("CoolAction"); } }

In the example above, we are creating and registering a custom action called "CoolAction".

  1. To unregister a custom action, add the unregister function. The unregister function then passes the user input data to the unregisterCustomAction function.
Future<void> unregisterCustomAction(String actionType) async { value.unregisterCustomAction(actionType); value.unregisiteredEvent.subscribe((args) { var data = args!.changedValue; setState(() { statusValue = data; }); }); }

📘

Note:

The register function must be tied to a register button or inkwell widget that is used to save the user input when the clicked or the tap action is performed.

For more information about registerCustomAction functionality, see
flutter_acoustic_sdk_push.dart

Override Actions

You can override actions and replace an old action with a new one. If you assigned a key to the actionType and did not use the default key to map the action to the SDK, you must first unregister the key and then assign a new one.

  1. Add the unregisterCustomAction function from the SDK.
Future<void> unregisterCustomAction(String actionType) async { value.unregisterCustomAction(actionType); value.unregisteredEvent.subscribe((args) { var data = args!.changedValue; setState(() { statusValue = data; }); }); }
  1. Add the unregister function.
unregister() { _yourFormKeyHere.currentState?.save(); unregisterCustomAction(_customActionType); }
  1. After unregistering the action type, you should now be able to register a new action type and override/update the key for the map (value) of the previous action.
    For more information, see