Status Button
If your organization has a website directory of individual employee pages, you can quickly and easily add a real-time status widget to each employee profile with Engage. When the employee is "online" the widget will display. When they are "offline" the widget will hide. When a visitor to the employee page clicks on the button, it will take them into a live engagement session.
Here are examples of live status buttons (if you don't see green buttons, those people are "offline"):
HERE IS GENERIC CODE FOR THE STATUS BUTTON:
<script src="https://sdk.engage.co/sdk.js"></script>
<script type="text/javascript">
var engage = new EngageSDK();
engage.presence.watchUser("lieflarson", function(status) {
// Place code to show/hide button here; something like the following line that works with jQuery
jQuery(“.your-chat-button").toggle(status == "online");
});
engage.presence.start();
</script>
<div class=“your-chat-button” style=“display:none;”></div>
NOTE: THE "LIEFLARSON" IN THE CODE IS WHERE YOU INSERT YOUR USER NAME. BY DEFAULT, MOST ENGAGE USERS ARE IN A FIRSTNAMELASTNAME FORMAT. FOR EXAMPLE: https://profile.engage.co/lieflarson
IF YOU WANT TO CHECK THE BINARY STATUS OF ANY USER, YOU CAN DO SO BY USING THE FOLLOWING STATUS CHECK (SIMPLY CHANGE OUT LIEFLARSON WITH THE USERS NAME): https://wapi.engage.co/api/v2/userStatus?userDomain=lieflarson
HERE IS LIVE STATUS BUTTON CODE EXAMPLE:
<!doctype html>
<html>
<head>
<title>Engage SDK Example - Status Button</title>
<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
</head>
<body>
<a href="https://profile.engage.co/lieflarson" class="engage-chat-button" style="display:none;">Chat Now!</a>
<script src="https://sdk.engage.co/sdk.js"></script>
<script type="text/javascript">
var engage = new EngageSDK();
engage.presence.watchUser("lieflarson", function(status) {
// Place code to show/hide button here; something like the following line
jQuery(".engage-chat-button").toggle(status == "online");
});
engage.presence.start();
</script>
</body>
</html>
HERE IS LIVE STATUS BUTTON CODE EXAMPLE FOR MULTIPLE USERS ON A PAGE:
<script type="text/javascript">
jQuery(function() {
var engage = new EngageSDK();
engage.presence.watchUser("wadewendorf", function(status) {
jQuery(".wade-chat-button").toggle(status == "online");
});
engage.presence.watchUser("lieflarson", function(status) {
jQuery(".lief-chat-button").toggle(status == "online");
});
engage.presence.watchUser("patterson", function(status) {
jQuery(".danny-chat-button").toggle(status == "online");
});
engage.presence.start();
});
</script>