Remote control consent dialog
By default, Cobrowse will show a remote control consent dialog when an agent requests remote control. You may modify and customize the remote control consent prompt as you wish, using the SDK hooks described below.
Admin users may also disable this remote control consent prompt from your account settings if you prefer to remove it entirely: https://cobrowse.io/dashboard/settings
Web
iOS
Android
React Native
1
CobrowseIO.confirmRemoteControl = function() {
2
return new Promise(function(resolve, reject) {
3
// show your own UI here
4
// call resolve(true) to allow
5
// call reject() to reject
6
resovle(true)
7
});
8
};
Copied!
To override the the default remote control consent prompt, you should implement the cobrowseHandleRemoteControlRequest: method of CobrowseIODelegate.
1
-(void) cobrowseHandleSessionRequest:(CBIOSession*) session {
2
// show your own UI here
3
// call [session setRemoteControl:kCBIORemoteControlStateOn callback:nil] to allow
4
// or [session setRemoteControl:kCBIORemoteControlStateRejected callback:nil] to reject
5
[session setRemoteControl:kCBIORemoteControlStateOn callback:nil]
6
}
Copied!
To override the the default remote control consent prompt, you should implement the CobrowseIO.RemoteControlRequestDelegate interface on your CobrowseIO.Delegate.
1
@Override
2
public void handleRemoteControlRequest(@NonNull Activity activity, @NonNull Session session) {
3
// show your own UI here
4
// call session.setRemoteControl(Session.RemoteControlState.On, null) to accept
5
// or session.setRemoteControl(Session.RemoteControlState.Rejected, null) to reject
6
session.setRemoteControl(Session.RemoteControlState.On, null)
7
}
Copied!
1
CobrowseIO.handleRemoteControlRequest = function(session) {
2
// Show your own UI here
3
// call session.setRemoteControl('on') to allow
4
// or session.setRemoteControl('rejected') to reject
5
session.setRemoteControl('on')
6
}
Copied!

Example UIs

We've created a set of sample UIs that you may drop directly into your app or website as a starting point to customize the consent prompt.
Web
iOS
Android
React Native
1
// A generic consent dialog class
2
function Consent() {
3
var container = document.createElement('div');
4
function content(title, description){
5
return '\
6
<div style="background: rgba(50, 50, 50, 0.4); position: fixed; z-index: 2147483647; bottom: 0; top: 0; left: 0; right: 0">\
7
<div style="color: #333; font-family:sans-serif; line-height:140%; position:fixed; padding:25px; background:white; border-radius:15px; z-index:2147483647; top:50px; left:50%; width:75%; max-width:350px; transform:translateX(-50%); box-shadow:0px 0px 15px #33333322;">\
8
<div style="text-align:center; margin-top:10px; margin-bottom:20px"><b>'+title+'</b></div>\
9
<div>'+description+'</div>\
10
<div style="float:right; margin-top:40px; color:rgb(0, 122, 255);">\
11
<a class="cobrowse-deny" style="cursor:pointer; padding:10px;">Deny</a>\
12
<a class="cobrowse-allow" style="cursor:pointer; padding:10px; font-weight: bold;">Allow</a>\
13
</div>\
14
</div>\
15
</div>\
16
';
17
}
18
19
this.show = function(title, description) {
20
return new Promise(function(resolve) {
21
container.innerHTML = content(title, description);
22
container.querySelector('.cobrowse-allow').addEventListener('click', function(){ resolve(true); this.hide() }.bind(this));
23
container.querySelector('.cobrowse-deny').addEventListener('click', function(){ resolve(false); this.hide() }.bind(this));
24
if (document.body) document.body.appendChild(container);
25
}.bind(this));
26
}.bind(this);
27
28
this.hide = function() {
29
if (container.parentNode) {
30
container.parentNode.removeChild(container);
31
}
32
}.bind(this);
33
}
34
35
// Integration with Cobrowse
36
CobrowseIO.confirmRemoteControl = function() {
37
return new Consent().show('Remote Control Request', 'Do you want to allow remote control by ' + CobrowseIO.currentSession.agent().name + '?');
38
}
Copied!
1
@interface CBAppDelegate : UIResponder <UIApplicationDelegate, CobrowseIODelegate>
2
3
@end
4
5
6
@implementation CBAppDelegate
7
8
// Custom consent dialog UI
9
UIAlertController *remoteControlPrompt;
10
11
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
12
{
13
CobrowseIO.instance.delegate = self;
14
// insert your license key here
15
CobrowseIO.instance.license = @"trial";
16
[CobrowseIO.instance start];
17
18
...
19
}
20
21
// Implement cobrowseHandleRemoteControlRequest:(CBIOSession*) to show a custom prompt
22
- (void) cobrowseHandleRemoteControlRequest:(CBIOSession *)session {
23
// replace the code below with your own confirmation prompt
24
remoteControlPrompt = [UIAlertController alertControllerWithTitle:@"Allow remote control?"
25
message:@"A support agent would like to control this app. Do you accept?"
26
preferredStyle:UIAlertControllerStyleAlert];
27
[remoteControlPrompt addAction: [UIAlertAction actionWithTitle:@"Accept"
28
style:UIAlertActionStyleDefault
29
handler:^(UIAlertAction * _Nonnull action) {
30
[session setRemoteControl:kCBIORemoteControlStateOn callback:nil];
31
remoteControlPrompt = nil;
32
}]];
33
[remoteControlPrompt addAction: [UIAlertAction actionWithTitle:@"Decline"
34
style:UIAlertActionStyleCancel
35
handler:^(UIAlertAction * _Nonnull action) {
36
[session setRemoteControl:kCBIORemoteControlStateRejected callback:nil];
37
remoteControlPrompt = nil;
38
}]];
39
40
UIViewController* appViewController = [self findPresentedViewController];
41
[appViewController presentViewController:remoteControlPrompt animated:YES completion:nil];
42
}
43
44
- (void)cobrowseSessionDidEnd:(CBIOSession *)session {
45
if (remoteControlPrompt) {
46
[remoteControlPrompt dismissViewControllerAnimated:NO completion:^{
47
remoteControlPrompt = nil;
48
}];
49
}
50
}
51
52
@end
Copied!
1
public class MainApplication extends Application
2
implements CobrowseIO.Delegate, CobrowseIO.RemoteControlRequestDelegate {
3
4
// Custom consent dialog UI
5
private CustomRemoteControlConsentDialogFragment customRemoteControlConsent;
6
7
@Override
8
public void onCreate() {
9
super.onCreate();
10
11
CobrowseIO.instance().setDelegate(this);
12
...
13
}
14
15
/*
16
* Implement handleRemoteControlRequest(Activity, Session) from CobrowseIO.RemoteControlRequestDelegate
17
* to show a custom prompt
18
*/
19
@Override
20
public void handleRemoteControlRequest(@NonNull Activity activity, @NonNull Session session) {
21
// replace the code below with your own confirmation prompt
22
String tag = "RemoteControlConsentDialog";
23
FragmentManager fragments = activity.getFragmentManager();
24
FragmentTransaction transaction = fragments.beginTransaction();
25
Fragment previous = fragments.findFragmentByTag(tag);
26
if (previous != null) transaction.remove(previous);
27
customRemoteControlConsent = new CustomRemoteControlConsentDialogFragment();
28
customRemoteControlConsent.show(transaction, tag);
29
}
30
31
@Override
32
public void sessionDidEnd(@NonNull Session session) {
33
if (customRemoteControlConsent != null && customRemoteControlConsent.isAdded()) {
34
customRemoteControlConsent.dismiss();
35
customRemoteControlConsent = null;
36
}
37
}
38
}
Copied!
And an example Fragment for showing the UI:
1
public class CustomRemoteControlConsentDialogFragment extends DialogFragment {
2
3
public CustomRemoteControlConsentDialogFragment() {
4
super();
5
}
6
7
@Override
8
public void onCreate(@NonNull Bundle savedInstanceState) {
9
super.onCreate(savedInstanceState);
10
setRetainInstance(true);
11
}
12
13
14
@Override
15
public void onDestroyView() {
16
if (getDialog() != null && getRetainInstance()) {
17
getDialog().setDismissMessage(null);
18
}
19
super.onDestroyView();
20
}
21
22
@NonNull
23
@Override
24
public Dialog onCreateDialog(@NonNull Bundle savedInstanceState) {
25
this.setCancelable(false);
26
return new AlertDialog.Builder(getActivity())
27
.setTitle("Allow remote control?")
28
.setMessage("A support agent would like to control this app. Do you accept?")
29
.setPositiveButton("Allow", new DialogInterface.OnClickListener() {
30
public void onClick(DialogInterface dialog, int w) {
31
Session session = CobrowseIO.instance().currentSession();
32
if (session != null) session.setRemoteControl(Session.RemoteControlState.On, null);
33
}})
34
.setNegativeButton("Reject", new DialogInterface.OnClickListener() {
35
public void onClick(DialogInterface dialog, int w) {
36
Session session = CobrowseIO.instance().currentSession();
37
if (session != null) session.setRemoteControl(Session.RemoteControlState.Rejected, null);
38
}
39
})
40
.create();
41
}
42
}
Copied!
1
CobrowseIO.handleRemoteControlRequest = function(session) {
2
// Replace this with your own logic
3
Alert.alert(
4
'Remote Control Request',
5
'A support agent would like to take remote control of this app. Do you accept?',
6
[{
7
text: 'Reject',
8
onPress: () => session.setRemoteControl('rejected'),
9
style: 'cancel'
10
}, {
11
text: 'Accept',
12
onPress: () => session.setRemoteControl('on')
13
}], { cancelable: false })
14
}
15
}
Copied!
Copy link
Contents
Example UIs