nSmed
nSmed

Reputation: 59

Vimeo API Tracking

I'm trying to implement some video tracking to our Vimeo videos on our website. I've got it too work for Play/Finished however i also need to do it for 25%, 50%, 75%.

This is my current code

$(document).ready(function() {
   	var iframe = document.querySelector('#vimeo_id_0');
   	var player = new Vimeo.Player(iframe);
	
	//Track videos on Play
	player.on('play', function(data){
		player.getVideoTitle().then(function(title) {
			$('body').append('<div>Play:' + title + '</div>');
		});
		//ga('send', 'event', { eventCategory: 'Video', eventAction: 'Play', eventLabel: 'Video Play'});
	});
	
	//Track videos at percent played
	player.on('timeupdate', function(data){
		player.getVideoTitle().then(function(title) {
			console.log(data.percent);
			if(data.percent = 0.25) {
				//25% percent
				$('body').append('<div>25%' + title + '</div>');
			} else if (data.percent = 0.50) {
				//50% percent
				$('body').append('<div>50%' + title + '</div>');
			} else if (data.percent = 0.75) {
				//75% percent
				$('body').append('<div>75%' + title + '</div>');
			}
		});
	});
	
	//Track videos on End
	player.on('ended', function(data){
		player.getVideoTitle().then(function(title) {
		  $('body').append('<div>Ended:' + title + '</div>');
		  //ga('send', 'event', { eventCategory: 'Video', eventAction: 'Finished', eventLabel: 'Video Finished'});
		});
	});
});
<script src="https://player.vimeo.com/api/player.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style><div class='embed-container'><iframe src='https://player.vimeo.com/video/260024854' id="vimeo_id_0" frameborder='0' webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe></div>

I'm trying to get it so when it timeupdate percent hits 0.25 it will fire the event and thats it, However it starts firing straight away and fires every single time the timeupdate call updates which would mean we will track loads of events in Google Analytics

Any help would be appreciated. Thanks

Upvotes: 0

Views: 2405

Answers (1)

Jerico Aragon
Jerico Aragon

Reputation: 21

In your if statement you are missing another equal sign. It should be:

if (data.percent == 0.25)

Upvotes: 2

Related Questions