Moderator Notifier Plugin

Version 1.0.1 - Released 12/07/2017

Moderator Plugin

We use HTML5 desktop notifications to trigger on-screen popups as well as audible alerts to notify the user that a chat event requires their attention. We send these notifications only when the user has the M&E control panel open on a tab in their browser. For browsers that do not support the HTML5 notification API, we create an audible alert only.

In order to notify an event moderator about an inbound chat comment or queued conversation while outside the M&E platform, our Notifications Plugin is provided. When implemented into an external website or web application, the Notifications Plugin will connect to the M&E platform as the current logged on user and proxy notifications through to the user. This is especially useful when integrated into key applications such as ATS or CRM systems, as the user does not have to maintain an open tab or window to the Meet & Engage control panel to receive chat notifications. When a notification is recieved, clicking on it will open the M&E control panel straight to the chat event and conversation that triggered the notification.

Plugin Implementation

Plugin implementation is simple. The following snippet should be included on each page the user may navigate to:

<script type="text/javascript" src="https://meetandengage.com/api/1.0/maemoderator.js"></script>
<script type="text/javascript">
    var maenotify = new meetandengageModerator();
    maenotify.initialise({});
</script>

On load, the plugin will assess the current logged on user's account access and begin to watch any in-flight events across the M&E accounts to which they have access.

If the user does currently not have a valid cookie on the meetandengage.com domain we show a small inline HTML popup which reads 'Sign in to Meet & Engage here to turn on chat notifications'. When the user clicks this they are taken to the Meet & Engage platform to sign in as normal. If they have not yet granted HTML5 desktop notification access and are using a browser that supports this, we also request permission at this point too.

Advanced Implementation Options

Logon Request

It is possible to tailor the copy displayed on the logon request box, for localisation for instance, by passing the preferred text as part of the initialise() call as follows:

<script type="text/javascript" src="https://meetandengage.com/api/1.0/maemoderator.js"></script>
<script type="text/javascript">
    var maenotify = new meetandengageModerator();
    maenotify.initialise({
        accountLogonRequestText: "Please sign in to M&E here"
    });
</script>

If you wish to implement your own method to alert the user, define accountLogonNeeded() in the initialise call and our method will be disabled, e.g.:

maenotify.initialise({
    accountLogonNeeded: function(){
        // this will be called if the user isn't logged on to
        // the M&E platform. Be sure to let them know somehow,
        // ideally more nicely than this:

        alert("Hey, you need to logon to M&E or you won't get notifications!"); 
    }
});

Notification Fallback

Where possible, the Notifications Plugin will send HTML5 desktop notifications. In cases where the user has denied permission or is using a browser that does not support it, we fallback to using inline HTML notifications that are designed to appear similar to the desktop notification and function the same way. These are added as fixed position containers within the HTML DOM of the page on which the plugin has been installed.

Rather than use this fallback, you may wish to display your own notification. If you define onNotification() in the initialise call, this will be called whenever a fallback notification is needed, e.g.:

maenotify.initialise({
    onNotification: function(data){
        // normally, we will send HTML5 desktop notifications. 
        // If we can't and you've defined this function, we'll
        // call this instead...

        // alert("Notification..."); 
    }
});

The object passed to onNotification has the following structure:

{
    type: string,  // either 'unseen-notification' or 'chat-message'
    title: string, // Title of the notification
    body: string,  // Body text, or the body of the message
    icon: string,  // The user's avatar, or M&E logo if a 
                   // general notification is sent
    url: string    // URL to send the user to when clicked
}

Disable Desktop Notifications

Desktop notifications can be disabled by passing enableDesktopNotifications: false to the initialise() function. All notifications will then be sent to the fallback (and your handler if implemented), and the audible notification is silenced. e.g.:

maenotify.initialise({
    enableDesktopNotifications: false,
    onNotification: function(data){
        // now all notifications call this function

        // alert("I am a silent notification!"); 
    }
});