This is step-by-step tutorial on how to use the Simple Stream Integration Builder to create a simple activity stream integration with StatusPage.io. This will enable you to get a one-way webhook-style activity stream from StatusPage.io, to a Jive group, without middleware in around 10 minutes! This tool is a first in a series of episodes we’ll be releasing that will enable you to save time developing for your Jive instance.

 

Screen Shot 2015-07-17 at 7.58.29 PM.png

 

Background

StatusPage.io provides "a web page specifically dedicated to communicating which parts of your site are/aren't working and the reasons behind it." Which according to StatusPage, helps "keep your customers informed when you're having an unplanned outage." But what about your own organization and letting groups that are affected know right away? Or creating a collaborative action request and getting the right people involved? With this Simple Stream Integration, we can take the power of StatusPage.io and bring it into Jive and add even more value for you, your team, and your organization.

Note: The Simple Stream Integration Builder can only be used with Jive Cloud (Jive 7 and 8 is not supported).

 

Quick Walk-Through Video

Watch the instructional video to help create your own StatusPage.io Simple Stream Integration using the Simple Stream Integration Builder:

 

StatusPage.io Jive Activity Stream Integration Steps:

  1. First, you will need to have a StatusPage account set up and webhooks enabled on their service.
  2. Head over to the Simple Stream Integration Builder page.
  3. Examine the StatusPage JSON payload schema and the Jive Stream JSON schema for how you want the activity stream constructed.
  4. Create the JavaScript transform function within “Step 1” of the Simple Stream Integration Builder.
    Sample transform function:
//Renaming each of the component ID's with relevant names
//and adding an image for each of the relevant objects created
var component = {};
switch(body.component_update.component_id){
  case "xyk3yzfdk9kl":
  component = {
      'name': "Marketing Services",
      'img': "https://raw.githubusercontent.com/jivesoftware/jive-statuspage-addon/master/resources/images/marketing_services.png"
  }
  break;
  case "f0smn2s09lv4":
  component = {
      'name': "Cloud Data Server",
      'img': "https://raw.githubusercontent.com/jivesoftware/jive-statuspage-addon/master/resources/images/cloud_data_server.png"
  }
  break;
  default:
  component = {
      'name': "Component with ID: " + body.component_update.component_id,
      'img': "http://bit.ly/1wYwajm"
  }
}

//Just formatting the output to look better in the description
var desc = {
  'operational':  "Operational",
  'degraded_performance': "Degraded Performance",
  'partial_outage': "Partial Outage",
  'major_outage': "Major Outage!"
}

// Build activity object.
var activityInfo = { actor: {}, object:{} };

// Optional URL for this activity. Remove if n/a.
activityInfo.object.url = "https://jivesoftware3.statuspage.io";

// Required URL to the image for this activity.
activityInfo.object.image = component.img;

// Required title of the activity.
activityInfo.object.title = component.name;

// Optional HTML description of activity. Remove if n/a.
activityInfo.object.description = "New Status: " + desc[body.component_update.new_status];

callback({ "activity" : activityInfo });

 

  1. Copy and paste a sample JSON payload from StatusPage into “Step 2” of the Simple Stream Integration Builder:
{
  "meta":{
      "unsubscribe":"http://statustest.flyingkleinbrothers.com:5000/?unsubscribe=j0vqr9kl3513",
      "documentation":"http://doers.statuspage.io/customer-notifications/webhooks/"
  },
  "organization":{
      "id": "j2mfxwj97wnj",
      "status_indicator": "major",
      "status_description": "Partial System Outage"
  },
  "component_update":{
      "created_at":"2013-05-29T21:32:28Z",
      "new_status":"operational",
      "old_status":"major_outage",
      "id":"k7730b5v92bv",
      "component_id":"rb5wq1dczvbm"
  }
}

 

  1. Click the “Run Transform” button and be sure that the “Transform Function” and “Output Validation” tests are both error free under “Step 3.” If the checks fail, it will give you an explanation for the error.
  2. Fill out the rest of the activity stream information such as title, description and add an icon for your activity stream in “Step 4.”
  3. Next, go to your Jive instance’s Add-on manager (Profile Picture > Add-Ons) and upload the add-on.
  4. After uploading the add-on, we need to go to the Jive group settings and add the activity stream integration to it.
  5. Copy the webhook endpoint URL that’s given to you in the integration configuration screen.
  6. Go to the StatusPage notification page and subscribe the endpoint URL that was copied, to StatusPage webhook.
  7. Fin. That’s it! Give it a whirl and watch the status updates stream in.

 

Repo on GitHub:

https://github.com/jivesoftware/jive-statuspage-addon

 

Hot Tips

  • You can add extra JS code to make the stream more powerful. For this example, we take the component ID’s from StatusPage and are giving them their appropriate known names.
  • Filter out/in content based on relevance to the group.
  • Use the external objects to make the activity actionable and invite others to collaborate.
  • If you update the extract and update the files, be sure you zip from within the root folder.

 

What's Next?

Ready to take your activity stream integration to the next level? Add an App by checking out the second episode of this trilogy.