Media Platform Runtime API (rtAPI) Documentation

rtAPI is a simple set of Javascript APIs that offers access to manipulate and track a gallery on client side.

Use the following set of rtAPI to preform :

• Register to receive events
• Register to receive hooks
• Enable Debug Mode
• Example : How to control the player with Cincopa PlayerAPI
• Example : How to add lead generation form to a video
• Example : How to add company logo to video control panel
• Example : How to get video duration
• Example : How to add watermark to video
• Example : How to get progress while video is playing and video heatmap
• Example : How to add a pre roll and post roll to a video
• Example : How to add sharing option to a video
• Reference : All events

Register to receive events

Register events :

Scenario 1 : when Cincopa's main lib - libasync.js already loaded

cincopa.registerEvent("cp_evt_mediaplay", "runtime.*");

function cp_evt_mediaplay(name, data, gallery) {
	if (name == "runtime.on-load-html") // make sure this event is runtime.on-load-html
		gallery.args.allow_search = "yes";
}

Scenarion 2 : If libasync.js is not loaded yet

var cincopa = cincopa || {};

cincopa.registeredFunctions = cincopa.registeredFunctions || [];
cincopa.registeredFunctions.push({
	func: function (name, data, gallery) {
		gallery.args.allow_search = "yes";
	}, filter: "runtime.on-load-html"
});

Debug mode

Enable debug mode from the console to see every event and debug data during libasync lifetime.
Note that this mode is saved to a domain cookie so no need to do it every time.

When debug mode is set to true every event will appear in the console.

cincopa.set_debug(true)

Here is an example of a video play from start till end in debug on :

How to control the player with Cincopa PlayerAPI

See the Pen Cincopa PlayerAPI by oren (@cincopa) on CodePen.

How to add lead generation form to a video

See the Pen How to add lead generation form to a video by oren (@cincopa) on CodePen.

How to add company logo to video control panel

See the Pen How to add company logo to video control panel by oren (@cincopa) on CodePen.

How to get video duration

See the Pen How to get video duration by oren (@cincopa) on CodePen.

How to add watermark to video

See the Pen How to add watermark to video by oren (@cincopa) on CodePen.

How to get progress while video is playing and video heatmap

See the Pen How to get progress while video is playing and video heatmap by oren (@cincopa) on CodePen.

How to add a pre roll and post roll to a video

See the Pen How to add a pre roll and post roll to a video by oren (@cincopa) on CodePen.

How to add sharing option to a video

See the Pen How to add sharing option to a video by oren (@cincopa) on CodePen.

Following is a list of all events available :

• runtime.on-args - Fires after all args were received and before loading the media, use this even change change/override args at runtime.
• runtime.on-media-json - Fires after media JSON was received and before loading the player, use this event to manipulate the media JSON for example add, remove or change media items.
• runtime.on-load-html - Fires before player loads the HTML, use this event to make final changes in the DIV or generic settings like allow_search.
• runtime.on-html-loaded - Fires after player is fully visible, use this event mostly for analytics.

Following is a list of video events - video.*
All events in this namespace will send in the data parameter (2nd arg of the event) the following structure {item: {...this is the item from the medai JSON...}, version: {...rendition info...}}

• video.load - Fires when video is loaded, this event will fire for every video in your playlist.
• video.play - Fires when video start to play.
• video.pause - Fires when video is paused.
• video.timeupdate - Fires during video plays for every second of play.
• video.change - Fires when player changes the rendition version, like when user goes full screen.
• video.error - Fires when video can't be loaded or when there is an error during the play.
• video.ended - Fires when video has ended.
• video.unload - Fires before video is unloaded.

• audio.load
• audio.play
• audio.pause
• audio.timeupdate
• audio.ended
• audio.unload

• lead.created - uid, email, lead_email, lead_first, lead_last, lead_company, lead_mediarid, lead_mediatitle, lead_hmid

• chromecast.detected
• chromecast.start
• chromecast.stop

• emailgate.show
• emailgate.submit
• emailgate.skip
• emailgate.hide

• context_menu.init

• photo.open
• photo.prev
• photo.next
• photo.close

• slider.prev
• slider.next

Register to receive hooks

Hooks can be used to manipulate gallery at any given stage. List of hooks :

before-building-upper-panel on-media-json

For example

	_cp_go_hooks["before-building-upper-panel"] = function(go) {
			go.args.allow_search = "yes";
			return "[this is a link]";
		};