Usage
This function runs automatically, so it is not called manually. Is this incorrect?
Additional Notes
This function checks for the video to play, pause, or end.
When played, nebula_playing_video is triggered.
When paused, nebula_paused_video is triggered.
When ended, nebula_finished_video is triggered.
This function also triggers nebula_engaged_video when the user has watched enough of the video to be considered engaged.
Source File
Located in /assets/js/nebula.js on line 4768.
Note: This function contains 1 to-do comment.
function nebulaYoutubeStateChange(e){ var thisVideo = nebula.videos[nebula.getYoutubeID(e.target)]; thisVideo.title = nebula.getYoutubeTitle(e.target); //Use Nullish coalescing here (after ie11?) //Playing if ( e.data === YT.PlayerState.PLAYING ){ var thisEvent = { category: 'Videos', action: ( nebula.isInView(jQuery(thisVideo.element)) )? 'Play' : 'Play (Not In View)', title: thisVideo.title, autoplay: thisVideo.autoplay }; ga('set', nebula.analytics.metrics.videoStarts, 1); ga('set', nebula.analytics.dimensions.videoWatcher, 'Started'); if ( thisVideo.autoplay ){ thisEvent.action += ' (Autoplay)'; } else { jQuery(thisVideo.element).addClass('playing'); } nebula.dom.document.trigger('nebula_event', thisEvent); ga('send', 'event', thisEvent.category, thisEvent.action, thisEvent.title); nebula.crm('event', 'Video Play Began: ' + thisEvent.title); nebula.dom.document.trigger('nebula_playing_video', thisVideo); var pauseFlag = true; var updateInterval = 500; try { thisVideo.current = e.target.getCurrentTime(); thisVideo.percent = thisVideo.current/thisVideo.duration; var youtubePlayProgress = setInterval(function(){ thisVideo.current = e.target.getCurrentTime(); thisVideo.percent = thisVideo.current/thisVideo.duration; thisVideo.watched = thisVideo.watched+(updateInterval/1000); thisVideo.watchedPercent = (thisVideo.watched)/thisVideo.duration; if ( thisVideo.watchedPercent > 0.25 && !thisVideo.engaged ){ if ( nebula.isInView(jQuery(thisVideo.element)) ){ var thisEvent = { category: 'Videos', action: ( thisVideo.autoplay )? 'Engaged' : 'Engaged (Autoplay)', title: thisVideo.title, autoplay: thisVideo.autoplay }; ga('set', nebula.analytics.dimensions.videoWatcher, thisEvent.action); nebula.dom.document.trigger('nebula_event', thisEvent); //@todo "Nebula" 0: This needs the new nebula_event trigger with thisEvent object ga('send', 'event', thisEvent.category, thisEvent.action, thisEvent.title, {'nonInteraction': true}); nebula.crm('event', 'Video Engaged: ' + thisEvent.title); thisVideo.engaged = true; nebula.dom.document.trigger('nebula_engaged_video', thisVideo); } } }, updateInterval); } catch(e){ //Video progress tracking was unsuccessful. Failing gracefully. } } //Ended if ( e.data === YT.PlayerState.ENDED ){ jQuery(thisVideo.element).removeClass('playing'); clearInterval(youtubePlayProgress); var thisEvent = { category: 'Videos', action: ( nebula.isInView(jQuery(thisVideo.element)) )? 'Ended' : 'Ended (Not In View)', title: thisVideo.title, playTime: Math.round(thisVideo.watched/1000), progress: thisVideo.current*1000, autoplay: thisVideo.autoplay }; if ( thisVideo.autoplay ){ thisEvent.action += ' (Autoplay)'; } ga('set', nebula.analytics.metrics.videoCompletions, 1); ga('set', nebula.analytics.metrics.videoPlaytime, thisEvent.playTime); ga('set', nebula.analytics.dimensions.videoWatcher, thisEvent.action); nebula.dom.document.trigger('nebula_event', thisEvent); ga('send', 'event', thisEvent.category, thisEvent.action, thisEvent.title, {'nonInteraction': true}); ga('send', 'timing', thisEvent.category, thisEvent.action, thisEvent.progress, thisEvent.title); nebula.crm('event', 'Video Ended: ' + thisEvent.title); nebula.dom.document.trigger('nebula_ended_video', thisVideo); //Paused } else { setTimeout(function(){ //Wait 1 second because seeking will always pause and automatically resume, so check if it is still playing a second from now try { if ( e.target.getPlayerState() == 2 && pauseFlag ){ //This must use getPlayerState() since e.data is not actually "current" inside of this setTimeout(). Paused = 2 jQuery(thisVideo.element).removeClass('playing'); clearInterval(youtubePlayProgress); var thisEvent = { category: 'Videos', action: 'Paused', playTime: Math.round(thisVideo.watched), percent: Math.round(thisVideo.percent*100), progress: thisVideo.current*1000, title: thisVideo.title, autoplay: thisVideo.autoplay }; ga('set', nebula.analytics.metrics.videoPlaytime, Math.round(thisVideo.watched)); ga('set', nebula.analytics.dimensions.videoPercentage, Math.round(thisVideo.percent*100)); ga('set', nebula.analytics.dimensions.videoWatcher, thisEvent.action); if ( !thisVideo.pausedYet ){ ga('send', 'event', thisEvent.category, 'First Pause', thisEvent.title); thisVideo.pausedYet = true; } nebula.dom.document.trigger('nebula_event', thisEvent); ga('send', 'event', thisEvent.category, thisEvent.action, thisEvent.title); ga('send', 'timing', thisEvent.category, thisEvent.action, thisEvent.progress, thisEvent.title); nebula.crm('event', 'Video Paused: ' + thisEvent.title); nebula.dom.document.trigger('nebula_paused_video', thisVideo); pauseFlag = false; } } catch(e){ //getPlayerState() is probably undefined... Failing gracefully } }, 1000); } }
Override
To override or disable this JavaScript function, simply redeclare it with the exact same function name.
function nebulaYoutubeStateChange(){ //Write your own code here, leave it blank, or return false. }