Setting up Orion to work with Connatix
Below you will find the steps in order of how they should be completed with links to the sections below going into more detail.
Steps
Have the module enabled
Please let the Spiny team know before proceeding so we can enable this integration's module for your bundle. Once enabled you can proceed with this integration.
Update Bootstrap Code
In order to ensure Connatix impressions are counted by Spiny please update your bootstrap code in accordance with the following:
- Add the just-in-time minified code for Connatix. This code will setup the preliminary event listeners Orion needs to capture events prior to Orion loading into the page before Orion's internal event listeners can take over.
<!-- Spiny.ai Orion Bootstrap START --->
<script>
// Add the Orion just-in-time bootstrap code for Connatix
(function(c,a,p,t,u,r,e){c[a]=c[a]||{},c[a][p]=c[a][p]||[],c[a][t]=c[a][t]||function(x){var y=[];c[a][p].push(function(){for(var i=0;i<y.length;i++){var n=y[i][0],f=y[i][1];x[r[1]].apply(x,[n,f])}c[a][t](x)});var ev=Object.values(x[e]);for(var i=0;i<ev.length;i++){var v=ev[i],f=function(){var ar=arguments;console.log("bootstrap video event detect",v,ar);c[a][p].push(function(){c[a][u].apply(c[a][u],[x,v].concat(ar))})};x[r[0]](v,f),y.push([v,f])}}})(window, "orion", "queue", "wrapConnatixVideo", "delegateConnatixVideoEvent", ["on", "remove"], "configEvents");
// ...rest of bootstrap code
</script>
<!-- Spiny.ai Orion Bootstrap END --->
Add Player Event Listener
When making the call to setup the Connatix player on page update your player render call to the following:
cnxps({ playerId: "<PLAYER_ID>" }).render("<RENDER_ID>", function(err,api){
if(!err){
orion.wrapConnatixVideo(api);
}
});
Replace the values <PLAYER_ID>
and <RENDER_ID>
with the corresponding IDs you have from Connatix.
Spiny Team Review
Once completed please add these changes to a staging site for our team to confirm and once approved please deploy the changes to your production environments.