Rashed Talukder

Project LiveStream: Custom View Tile & Simple Stream Integration w/App

Blog Post created by Rashed Talukder on Sep 27, 2016



To start a new initiative and provide examples for developers, we're going to start putting out some Jive integrations that we believe provide some benefit to our customers and you—the developers. These are open source projects under the apache 2.0 license and free to be used as they stand or as a baseline for your integrations. We'll be keeping these projects in the jiveapps/addons at master · jivesoftware/jiveapps · GitHub repo.


So what is LiveStream? It's a event video platform that's used by companies both big and small to provide event coverage. So a natural use case for it is a company event (like JiveWorld17!) to provide coverage to anyone who can't be at the event in person; or even for company-wide meetings.



GitHub Repos:


Data Flow:

This project integrates Livestream API's to bring a LiveStream live feed feed into Jive. It has the following core functionalities and data flow:



Custom View Tile (Middlewared)

Screen Shot 2016-09-26 at 6.18.25 PM2.png

Screen Shot 2016-09-26 at 5.17.53 PM.png

  • Middleware Fetches LiveStream Upcoming Events API and pushes the array of events to Tile Config
    • Can be set for other endpoints—was developed and tested on the Private Events endpoint
  • Tile Configuration window displays event to be selected to be displayed on the view window
  • Tile Configuration window has optional field to place the Simple Stream Integration's (SSI) listener URL
  • Middleware reads the saved configuration and if any event has their "isLive" parameter set to true AND a SSI listener URL was entered in the tile's configuration, it generates an activity with the SSI
  • Comments are pulled in from the activity that is related to the event being displayed in the tile and displayed
    • Comment text has link back to the comment itself in the external object
      • The user can see the all comments and continue collaboration and participate in the communication
    • If there is no activity generated, no comments are displayed



Simple Stream Integration w/ App (non-Middleware)

Screen Shot 2016-09-26 at 6.17.39 PM.png

Screen Shot 2016-09-26 at 6.17.17 PM.png


  • The middleware from the Custom View Tile generates activities for each event that goes live
  • The activity has an associated external object
    • The external object has an embedded app
    • External object video is larger and has full collaborative Jive experience (like, comment, share, mark for outcome)
  • App shows the live video that's associated with the video event that generated the activity




  • There is an extra file for getting an authentication token at your service's /tokens endpoint by performing a GET request—should you build something that needs to do more with LiveStream's API's




  • This was written using mostly ES6 JavaScript, so it will only work on newer browsers
  • LiveStream currently doesn't offer webhook's so the custom middleware service is a necessity
  • Jive's Node.js SDK's jive.util.base64Encode() method does not work for API key/string only authentication
  • There are two archive files to install into Jive! This is because one service requires middleware and the other doesn't
  • I would have really liked to split up my services.js into three separate classes—LiveStream API's, Custom View Tile data pusher, SSI Activity Generator—if you have the free time or desire to make a pull request, I'll review and commit.



Initial Setup Requirements

Screen Shot 2016-09-26 at 9.58.50 PM.png

  1. Have a LiveStream account and some videos set to go live in the future
  2. In /jiveclientconfiguration.json, you'll see an object called "livestreamCredentials"—fill in all the fields
    • Look here Livestream Developers | API Dashboard for Client ID & API Key (dashed lines in the picture above)
    • Account ID can be retrieved via API or from your Livestream Video dashboard in the URL of your browser
  3. Update your middleware service URL in /tiles/LiveStreamTile/public/javascripts/configuration.js
  4. In terminal, run npm update
  5. In terminal, run node app.js to start your service and generate a new .zip for your Custom View Tile
  6. Install the zip for both the Tile and the Simple Stream Integration into your Jive Instance
  7. Install and setup the SSI into your page first and copy the URL
  8. Install the tile to your page and paste the URL and select your upcoming public event
  9. Use the LiveStream desktop app and go live in your event and see your video feed in the tile and activity get generated