Usage
This function runs automatically, so it is not called manually. Is this incorrect?
Additional Notes
This function looks for any iframe with a src that contains “vimeo”.
Source File
Located in /assets/js/modules/video.js on line 536.
No Hooks
This function does not have any filters or actions available. Request one?
JavaScript
nebula.createVimeoPlayers = function(){ jQuery('iframe[src*="vimeo"]').each(function(){ //This is not finding lazy loaded videos if ( !jQuery(this).hasClass('ignore') ){ //Use this class to ignore certain videos from tracking let id = jQuery(this).attr('data-video-id') || jQuery(this).attr('data-vimeo-id') || jQuery(this).attr('id') || false; if ( !id ){ if ( jQuery(this).attr('src').includes('player_id') ){ id = jQuery(this).attr('src').split('player_id=').pop().split('&')[0]; //Use the player_id parameter. Note: This is no longer used by the Vimeo API! } else { id = jQuery(this).attr('src').split('/').pop().split('?')[0]; //Grab the ID off the end of the URL (ignoring query parameters) } if ( id && !parseInt(id) ){ //If the ID is a not number try to find a number in the iframe src id = (/\d{6,}/g).exec(jQuery(this).attr('src'))[0]; } jQuery(this).attr('id', id); } nebula.videos = nebula.videos || {}; //Always make sure this is defined if ( typeof nebula.videos[id] === 'object' ){ //If this video is already being tracked ignore it return; //Continue the loop } //Fill in the data object here nebula.videos[id] = { player: new Vimeo.Player(jQuery(this)), element: jQuery(this), platform: 'vimeo', //The platform the video is hosted using. autoplay: jQuery(this).attr('src').includes('autoplay=1'), //Look for the autoplay parameter in the iframe src. id: id, current: 0, //The current position of the video. Units: Seconds percent: 0, //The percent of the current position. Multiply by 100 for actual percent. engaged: false, //Whether the viewer has watched enough of the video to be considered engaged. seeker: false, //Whether the viewer has seeked through the video at least once. seen: [], //An array of percentages seen by the viewer. This is to roughly estimate how much was watched. watched: 0, //Amount of time watching the video (regardless of seeking). Accurate to 1% of video duration. Units: Seconds watchedPercent: 0, //The decimal percentage of the video watched. Multiply by 100 for actual percent. pausedYet: false, //If this video has been paused yet by the user. }; //Title nebula.videos[id].player.getVideoTitle().then(function(title){ nebula.videos[id].title = title; //The title of the video }); //Duration nebula.videos[id].player.getDuration().then(function(duration){ nebula.videos[id].duration = duration; //The total duration of the video. Units: Seconds }); //Play nebula.videos[id].player.on('play', function(e){ let thisEvent = { category: 'Videos', action: ( nebula.isInView(jQuery(nebula.videos[id].element)) )? 'Play' : 'Play (Not In View)', title: nebula.videos[id].title, autoplay: nebula.videos[id].autoplay }; ga('set', nebula.analytics.metrics.videoStarts, 1); ga('set', nebula.analytics.dimensions.videoWatcher, 'Started'); if ( nebula.videos[id].autoplay ){ thisEvent.action += ' (Autoplay)'; } else { nebula.videos[id].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', nebula.videos[id].title); }); //Time Update nebula.videos[id].player.on('timeupdate', function(e){ nebula.videos[id].duration = e.duration; nebula.videos[id].current = e.seconds; nebula.videos[id].percent = e.percent; //Determine watched percent by adding current percents to an array, then count the array! nowSeen = Math.ceil(nebula.videos[id].percent*100); if ( nebula.videos[id].seen.indexOf(nowSeen) < 0 ){ nebula.videos[id].seen.push(nowSeen); } nebula.videos[id].watchedPercent = nebula.videos[id].seen.length; nebula.videos[id].watched = (nebula.videos[id].seen.length/100)*nebula.videos[id].duration; //Roughly calculate time watched based on percent seen if ( nebula.videos[id].watchedPercent > 25 && !nebula.videos[id].engaged ){ if ( nebula.isInView(jQuery(nebula.videos[id].element)) ){ let thisEvent = { category: 'Videos', action: ( nebula.videos[id].autoplay )? 'Engaged' : 'Engaged (Autoplay)', title: nebula.videos[id].title, autoplay: nebula.videos[id].autoplay }; 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}); nebula.crm('event', 'Video Engaged: ' + thisEvent.title); nebula.videos[id].engaged = true; nebula.dom.document.trigger('nebula_engaged_video', nebula.videos[id].title); } } }); //Pause nebula.videos[id].player.on('pause', function(e){ jQuery(this).removeClass('playing'); let thisEvent = { category: 'Videos', action: 'Paused', playTime: Math.round(nebula.videos[id].watched), percent: Math.round(e.percent*100), title: nebula.videos[id].title, autoplay: nebula.videos[id].autoplay }; ga('set', nebula.analytics.dimensions.videoWatcher, thisEvent.action); ga('set', nebula.analytics.metrics.videoPlaytime, thisEvent.playTime); ga('set', nebula.analytics.dimensions.videoPercentage, thisEvent.percent); if ( !nebula.videos[id].pausedYet && !nebula.videos[id].seeker ){ //Only capture first pause if they didn't seek ga('send', 'event', thisEvent.category, 'First Pause', thisEvent.title); nebula.videos[id].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, Math.round(e.seconds*1000), thisEvent.title); nebula.crm('event', 'Video Paused: ' + thisEvent.title); nebula.dom.document.trigger('nebula_paused_video', nebula.videos[id]); }); //Seeked nebula.videos[id].player.on('seeked', function(e){ let thisEvent = { category: 'Videos', action: 'Seek', position: e.seconds, title: nebula.videos[id].title, autoplay: nebula.videos[id].autoplay }; nebula.dom.document.trigger('nebula_event', thisEvent); ga('set', nebula.analytics.dimensions.videoWatcher, thisEvent.action); ga('send', 'event', thisEvent.category, thisEvent.action, thisEvent.title + ' [to: ' + thisEvent.position + ']'); nebula.crm('event', 'Video Seeked: ' + thisEvent.title); nebula.videos[id].seeker = true; nebula.dom.document.trigger('nebula_seeked_video', nebula.videos[id]); }); //Ended nebula.videos[id].player.on('ended', function(e){ jQuery(this).removeClass('playing'); let thisEvent = { category: 'Videos', action: ( nebula.isInView(jQuery(nebula.videos[id].element)) )? 'Ended' : 'Ended (Not In View)', title: nebula.videos[id].title, playTime: Math.round(nebula.videos[id].watched), progress: Math.round(nebula.videos[id].watched*1000), autoplay: nebula.videos[id].autoplay }; ga('set', nebula.analytics.metrics.videoCompletions, 1); ga('set', nebula.analytics.metrics.videoPlaytime, thisEvent.playTime); ga('set', nebula.analytics.dimensions.videoWatcher, thisEvent.action); if ( nebula.videos[id].autoplay ){ thisEvent.action += ' (Autoplay)'; } 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); //Roughly amount of time watched (Can not be over 100% for Vimeo) nebula.crm('event', 'Video Ended: ' + thisEvent.title); nebula.dom.document.trigger('nebula_ended_video', nebula.videos[id]); }); nebula.dom.document.trigger('nebula_vimeo_player_created', nebula.videos[id]); } }); if ( typeof videoProgress === 'undefined' ){ let videoProgress = {}; } };
Override
To override or disable this JavaScript function, simply redeclare it with the exact same function name.
JavaScript
nebula.createVimeoPlayers = function(){ //Write your own code here, leave it blank, or return false. }