1. Technical
  2. Adding Live Center

Convenience functions

What are NcPosts, tenant key, and bulletinProvider?

Live Center JavaScript client library (NcPosts)

It is made modular, allowing you to use only the features you need, and take full control of the rendering. If you need a more flexible solution to allow you to customize your live feed to your specific needs, you can easily do so by choosing a more “bare metal” and scaled implementation. Correspondingly, if you instead want a plug-and-play solution, Live Center can be implemented with a more standardized format.

The convenience function is a wrapper for the JavaScript code needed to create and populate a Live Feed. The method made for convenience is called “start” on the “NcPost” namespace. It takes an options object and returns a control object.


Options object:

Property name Required? Description
channelId Yes The ID of the channel to connect to.
Container Yes The HTML element to render the channel in.
tenantKey No The key to accessing your resources. Provided by Norkon.
baseUrl No The base URL of the backend service to connect to.
httpService No The HTTP service is used to make HTTP requests. Usually Axios, angulars $http or equivalent. Needs to support get and post functions that will return promises.
backendService No The backend service will be used to get live center posts. Defaults to NcCore.StandardBackendService using the httpService with the baseUrl, unwrapping "success" objects from the live center backend.
bulletinProvider No The bulletin provider to get bulletins from. Defaults to NcPosts.BulletinProvider using the backend service.
enableWebSockets No Whether web sockets should be enabled. Defaults to false.
webSocketProvider No The WebSocket provider streams web sockets. Defaults to NcPosts.BulletinWebSocketProvider using the baseUrl.
pollingInterval No The polling interval in milliseconds is used for HTTP polling. Defaults to 5000ms.
pinning No Whether pinning is enabled. Defaults to true.
updating No Whether it should be checked for updates to the stream or not. Default to true.
updatingUntil No If specified, the stream will not start updating if the current client time is higher than the specified date. Needs to be a standard JavaScript date.
showMoreElement No An HTML element that has a function for loading more posts will be attached in onclick. The element will be hidden or shown with "display: inline-block" and hidden with "display: none"
showLessElement No An HTML element that a function for showing fewer posts will be attached to onclick, if there are more than 10 visible posts. Same visibility management as showMoreElement.
tagCallback No A function that if set will be called when a tag is clicked. The tags will be formatted with the class "post-tag-clickable" to indicate that it is clickable.
dateFormatter No A function that takes a JavaScript date and returns a string. Defaults to d.toLocaleDateString() + ", " + d.toLocaleTimeString()
twttr No The Twitter widget object. Needs to be passed explicitly.
postRenderers No

An array of NcPosts.PostRenderer is to be used for rendering post content. Defaults to:

  • NcPosts.HeaderRenderer
  • NcPosts.TitleRenderer
  •  NcPosts.ExtendedContentRenderer (with NcPosts.YouTubeInlineRenderer, NcPosts.ImageInlineRenderer, NcPosts.CustomInlineRenderer, and NcPosts.TweetInlineRenderer)
  • NcPosts.LinkCardRenderer
  • NcPosts.ImageRenderer
  • NcPosts.SvgArrowRenderer
  • NcPosts.TagsAndQuantsRenderer
  • NcPosts.CommentsRenderer (if present)
In addition to postRenderers and inlineRenderers from extensions, defined in extensionContainer.
channelRenderers No

An array of NcPosts.ChannelRenderer is to be used for rendering channel content on top of the feed. Defaults to:

NcPosts.QuestionRenderer (if present)

In addition to channelRenderers from extensions, defined in extensionContainer.

extraPostRenderers No Additional post renderers to append to the postRenderers.
extraInlineRenderers No Additional inline renderers to append to the inlineRenderers.
extensionContainer No The JavaScript object describing the extensions is usually provided by the live center backend.
preRenderData No A function is called every time there is a change in rendering.
renderChange No A function is called every time there is a change in rendering.
postAdded No A function is called every time a post is added. Passes the post object.
initialDataLoaded No A function is called once the initial data is loaded. Passes the initial server data.
channelStatusChanged No A function is called every time the channel status changes. Passes an object with two properties: "hasMore" (boolean) and "postCount" (number).
channelContentChanged No A function is called every time the channel content is changed. Passes the channel content as the first parameter.

 

Control object:

Property name Description
channelId The active live center channel ID.
bulletinProvider The bulletin provider used to get bulletins over HTTP.
listManager The list manager is used to manage the list of posts.
loadMore A function that will load the next posts in the channel. Returns a promise.
showLatest A function that will truncate the list to display the latest 10 posts.
dispose Stops streaming from the backend (WebSockets or HTTP polling).

 


 

Resources:

1. CSS Bundle 🌸

This is a bundle needed to render and support elements in the Live Center feed. The link below is the latest version: https://livecentercdn.norkon.net/scripts/ncposts/ncposts-6.1.1.min.css

2. JS Bundle 👨‍💻

This is a bundle that has the set of functions needed to retrieve and renders the post from our servers. Without this script, you cannot use most functions from the script samples. Below is the latest version of the bundle: https://livecentercdn.norkon.net/scripts/ncposts/ncposts-6.1.1.min.js

Not the implementation you're looking for 🤔 ? View other implementations here!