channel_talk_flutter

Description:

channel talk flutter

channel_talk_flutter #
Flutter wrapper for Channel Talk Android and iOS projects.(Unofficial)
*******************************************************************************************************
[ANDROID]
Please should change the bottom part when change version from v2.x.x to above of v3.0.0.
In AndroidManifest.xml file,
AS-IS
<service
android:name="ai.deepnatural.channel_talk.PushInterceptService"
...
copied to clipboard
TO-BE
<service
android:name="com.kuku.channel_talk_flutter.PushInterceptService"
...
copied to clipboard
*******************************************************************************************************
Usage #
import 'package:channel_talk_flutter/channel_talk_flutter.dart';

void main() async {
await ChannelTalk.boot(
pluginKey: 'pluginKey', // Required
memberId: 'memberId',
memberHash: 'memberHash',
email: 'email',
name: 'name',
mobileNumber: 'mobileNumber',
avatarUrl: 'avatarUrl',
unsubscribeEmail: false,
unsubscribeTexting: false,
trackDefaultEvent: false,
hidePopup: false,
language: Language.korean,
appearance: Appearance.dark,
);

ChannelTalk.setListener((event, arguments) {
switch(event){
case ChannelTalkEvent.onShowMessenger:
print('ON_SHOW_MESSENGER');
break;
case ChannelTalkEvent.onHideMessenger:
print('ON_HIDE_MESSENGER');
break;
case ChannelTalkEvent.onChatCreated:
print('ON_CHAT_CREATED:\nchatId: $arguments');
break;
case ChannelTalkEvent.onBadgeChanged:
print('ON_BADGE_CHANGED:\n$arguments');
break;
case ChannelTalkEvent.onFollowUpChanged:
print('ON_FOLLOW_UP_CHANGED\ndata: $arguments');
break;
case ChannelTalkEvent.onUrlClicked:
print('ON_URL_CLICKED\nurl: $arguments');
break;
case ChannelTalkEvent.onPopupDataReceived:
print('ON_POPUP_DATA_RECEIVED\nevent: $arguments}');
break;
case ChannelTalkEvent.onPushNotificationClicked:
print('ON_PUSH_NOTIFICATION_CLICKED\nevent: $arguments}');
default:
break;
}
});

runApp(App());
}

class App extends StatelessWidget {
@override
Widget build(BuildContext context) {
return FlatButton(
child: Text('Open Channel Talk'),
onPressed: () async {
await ChannelTalk.showMessenger();
},
);
}
}

copied to clipboard
See Channel Talk Android and iOS package documentation for more information.
iOS #
Update info.plist.
<key>NSCameraUsageDescription</key>
<string>Accessing to camera in order to provide better user experience</string>

<key>NSMicrophoneUsageDescription</key>
<string>Accessing to microphone to record voice for video</string>

<key>NSPhotoLibraryAddUsageDescription</key>
<string>Accessing to photo library in order to save photos</string>

<key>NSPhotoLibraryUsageDescription</key>
<string>Accessing to photo library in order to provide better user experience</string>
copied to clipboard
Add pod installation to ios/Podfile.
(Because there is no latest ChannelIOSDK pod in Cocopod, can not add dependecy to plugin podspec properly.)
target 'Runner' do
use_frameworks!
use_modular_headers!
# Add below line
pod 'ChannelIOSDK', podspec: 'https://mobile-static.channel.io/ios/11.7.3/xcframework.podspec'

flutter_install_all_ios_pods File.dirname(File.realpath(__FILE__))
end
copied to clipboard
Add ChannelTalk initializing code to [project]/ios/Runner/AppDelegate.swift
import ChannelIOFront
...

override func application(
_ application: UIApplication,
didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?
) -> Bool {
...
ChannelIO.initialize(application)
...
}
...

copied to clipboard
Android #
Push notifications in combination with FCM
This plugin works in combination with the firebase_messaging plugin to receive Push Notifications. To set this up:

First, implement firebase_messaging and check if it works: https://pub.dev/packages/firebase_messaging#android-integration
Then, add the Firebase server key to Channel Talk, as described here: https://developers.channel.io/docs/android-push-notification
Add the following to your AndroidManifest.xml file, so incoming messages are handled by Channel Talk:

<service
android:name="com.kuku.channel_talk_flutter.PushInterceptService"
android:enabled="true"
android:exported="true">
<intent-filter>
<action android:name="com.google.firebase.MESSAGING_EVENT" />
</intent-filter>
</service>
copied to clipboard
just above the closing </application> tag.
Web #
Insert the following script within the tag of your HTML file(web/index.html):
<script>
(function(){var w=window;if(w.ChannelIO){return w.console.error("ChannelIO script included twice.");}var ch=function(){ch.c(arguments);};ch.q=[];ch.c=function(args){ch.q.push(args);};w.ChannelIO=ch;function l(){if(w.ChannelIOInitialized){return;}w.ChannelIOInitialized=true;var s=document.createElement("script");s.type="text/javascript";s.async=true;s.src="https://cdn.channel.io/plugin/ch-plugin-web.js";var x=document.getElementsByTagName("script")[0];if(x.parentNode){x.parentNode.insertBefore(s,x);}}if(document.readyState==="complete"){l();}else{w.addEventListener("DOMContentLoaded",l);w.addEventListener("load",l);}})();
</script>
copied to clipboard
In case of Web platform, would better use bootForWeb API but we can also use boot API.
import 'package:channel_talk_flutter/channel_talk_flutter.dart';

void main() async {
await ChannelTalk.bootForWeb(
pluginKey: 'pluginKey', // Required
memberId: 'memberId',
memberHash: 'memberHash',
email: 'email',
name: 'name',
mobileNumber: '0101231234',
avatarUrl: 'avatarUrl',
customLauncherSelector: 'customLauncherSelector',
hideChannelButtonOnBoot: false,
zIndex: 10000000,
trackDefaultEvent: false,
trackUtmSource: false,
unsubscribeEmail: false,
unsubscribeTexting: false,
hidePopup: false,
appearance: Appearance.light,
language: Language.japanese,
);
...
}
copied to clipboard
Supported API #



API
API Description
Parameter
Type
Parameter Description
Support platforms





setListener
Set the delegate allows the reception of event callbacks from the SDK.

delegate*
ChannelTalkDelegate
Support onShowMessenger/onHideMessenger/onChatCreated/onBadgeChanged/onFollowUpChanged/onUrlClicked/onPopupDataReceived
Mobile



removeListener
Remove the delegate allows the reception of event callbacks from the SDK.q




Mobile



boot
Load the information necessary to use the SDK.
pluginKey*
String
Plugin key of Channel.
Mobile, Web


memberId
String?
An identifier to distinguish each member user.


memberHash
String?
A HMAC-SHA256 value of memberId.


email
String?
An email of a user.


name
String?
A name of a user.


mobileNumber
String?
A mobile number of a user.


avatarUrl
String?
An avatar URL of a user.


language
Language?
A user’s language.
It is valid when creating a new user. The language of the user that already exists will not change.


unsubscribeEmail
bool?
Sets whether to receive marketing messages via email.


unsubscribeTexting
bool?
Sets whether to receive marketing messages via texting (SMS, LMS)


trackDefaultEvent
bool?
Sets whether to track the default event, such as PageView.


hidePopup
bool?
Sets whether to hide popups such as marketing popup and in-app notifications.


appearance
Appearance?
Sets the appearance of SDK.



bootForWeb
Load the information necessary to use the SDK.
pluginKey*
String
Plugin key of Channel.
Web


memberId
String?
An identifier to distinguish each member user.


memberHash
String?
A HMAC-SHA256 value of memberId.


email
String?
An email of a user.


name
String?
A name of a user.


mobileNumber
String?
A mobile number of a user.


avatarUrl
String?
An avatar URL of a user.


language
Language?
A user’s language.
It is valid when creating a new user. The language of the user that already exists will not change.


unsubscribeEmail
bool?
Sets whether to receive marketing messages via email.


unsubscribeTexting
bool?
Sets whether to receive marketing messages via texting (SMS, LMS)


trackDefaultEvent
bool?
Sets whether to track the default event, such as PageView.


hidePopup
bool?
Sets whether to hide popups such as marketing popup and in-app notifications.


appearance
Appearance?
Sets the appearance of SDK.


customLauncherSelector
String?
The CSS Selector to select a custom launcher.
Use this option to customize the default chat button.


hideChannelButtonOnBoot
bool?
Determines whether to hide the default chat button on boot.
The default value is false.


zIndex
int?
Sets the z-index for SDK elements, such as the chat button, messenger, and marketing pop-ups.
The default value is 10000000.


trackUtmSource
bool?
Determines whether to track the UTM source and referrer.
The default value is true.



sleep
Disables all features except for receiving system push notifications and using the Track.



Mobile



shutdown
Disconnects the SDK from the channel.



Mobile, Web



showChannelButton
Displays the Channel button on the global screen.



Mobile, Web



hideChannelButton
Hides the Channel button on the global screen.



Mobile, Web



showMessenger
Displays the messenger.



Mobile, Web



hideMessenger
Hides the messenger.



Mobile, Web



openChat
Opens User chat.
chatId
String?
This is the chat ID. If the chatId is invalid or nil, a new user chat is opened.
Mobile, Web


message
String?
This is the pre-filled message in the message input field when opening a new chat. It is valid when chatId is nil.



track
Tracks the user's events.
eventName*
String
This is the name of the event to track, with a maximum length of 30 characters.
Mobile, Web


properties
Map?
This is additional information about the event.



updateUser
TraModifies user information.
name
String?
A name of a user.
Mobile, Web


email
String?
An email of a user.


mobileNumber
String?
A mobile number of a user.


avatarUrl
String?
An avatar URL of a user.


language
Language?
A user’s language.
It is valid when creating a new user. The language of the user that already exists will not change.


unsubscribeEmail
bool?
Sets whether to receive marketing messages via email.


unsubscribeTexting
bool?
Sets whether to receive marketing messages via texting (SMS, LMS)


tags
List[String]?
A tag list of the user.


customAttributes
Map < String, dynamic >?
A user's CustomAttributes



initPushToken
Informs ChannelTalk about updates to the device token.
deviceToken*
String
This is additional information about the event.
Mobile



isChannelPushNotification
It checks if the push data should be processed by the SDK.
content*
Map
This is the `userInfo object received through push notifications.
Mobile



receivePushNotification
Notifies Channel Talk that the user has received a push notification.
content*
Map
This is the `userInfo object received through push notifications.
Mobile



storePushNotification
Stores push information on the device.
content*
Map
This is the `userInfo object received through push notifications.
Mobile



hasStoredPushNotification
Check for any saved push notifications from the Channel.



Mobile



openStoredPushNotification
Opens a user chat using the stored push information on the device through storePushNotification.



Mobile



isBooted
Verify that the SDK is in a Boot state.



Mobile



setDebugMode
Sets the debug mode.
flag*
String
debug mode
Mobile



setPage
Sets the name of the screen when the track is called.
page*
String
This is the screen name when track is called.
Mobile, Web



resetPage
Resets the name of the screen when track is called.



Mobile, Web



addTags
Adds tags to the user.
tags*
List[String]
• The maximum number of tags that can be added is 10.
• Tags are stored in lowercase.
• Any tags that have already been added will be ignored.
• nil, empty strings, or lists containing them are not allowed.
Mobile, Web



removeTags
Removes tags from the user, ignoring any tags that do not exist.

tags*
List[String]
These are the tags to be removed. Null, empty strings, or lists containing them are not allowed.
Mobile, Web



openSupportBot
Opens User chat to run a specific Support bot.
supportBotId*
String?
This is the support bot's ID. If supportBotId is invalid or nil, the chat room is closed.
Mobile, Web


message
String?
This message will be displayed in the input field after completing the support bot operation.



setAppearance
Configures the SDK's theme.
appearance*
Appearance
If specified as .light or .dark, it locks the theme to the respective mode. If specified as .system, it follows the device's system theme.
Mobile, Web