Merge pull request #64 from Financial-Times/fix-ad-video-tracking-on-ios

Prevent advert play/pause/end/progress events from being tracked by t he main video tracking when the ad library reuses the primary <video> element

src/js/ads.js

@@ -16,6 +16,9 @@ class VideoAds {
 		this.adsLoaded = false;
 		this.videoLoaded = false;
 		this.loadingStateDisplayed = false;
+
+		// record when the advert has completed
+		this.adsCompleted = false;
 	}
 
 	loadAdsLibrary() {
@@ -135,8 +138,14 @@ class VideoAds {
 
 		// Add listeners to the required events.
 		this.adsManager.addEventListener(google.ima.AdErrorEvent.Type.AD_ERROR, this.adErrorHandler);
+
+		// "Fired when content should be paused. This usually happens right before an ad is about to cover the content"
 		this.adsManager.addEventListener(google.ima.AdEvent.Type.CONTENT_PAUSE_REQUESTED, this.contentPauseRequestHandler);
+
+		// "Fired when content should be resumed. This usually happens when an ad finishes or collapses"
 		this.adsManager.addEventListener(google.ima.AdEvent.Type.CONTENT_RESUME_REQUESTED, this.contentResumeRequestHandler);
+
+		// "Fired when the ads manager is done playing all the ads"
 		this.adsManager.addEventListener(google.ima.AdEvent.Type.ALL_ADS_COMPLETED, this.adEventHandler);
 
 		// Listen to any additional events, if necessary.
@@ -296,11 +305,13 @@ class VideoAds {
 	}
 
 	contentPauseRequestHandler() {
+		this.adsCompleted = false;
 		this.video.videoEl.pause();
 	}
 
 	contentResumeRequestHandler() {
 		this.video.containerEl.removeChild(this.adContainerEl);
+		this.adsCompleted = true;
 		this.video.videoEl.play();
 	}
 }

src/js/video.js

@@ -7,6 +7,16 @@ import Playlist from './playlist';
 
 function eventListener(video, ev) {
 
+	// On some platforms (eg iOS), the Google advert library will use the main <video> element
+	// used by o-video to also play a pre-roll advert; as the advert plays, this will trigger
+	// the normal <video> event listeners.  Discard events that we can identify as coming
+	// from the pre-roll rather than the main content.
+	// To do this, check whether advertising is still enabled (it'll be disabled on any error),
+	// and for the video ads load and completed flags.
+	if (video.opts.advertising && video.videoAds && video.videoAds.adsLoaded && !video.videoAds.adsCompleted) {
+		return;
+	}
+
 	// Dispatch progress event at around 25%, 50%, 75% and 100%
 	// If allProgress is set to true, then we send spoor events for every native video progress event (every 5 sec)
 	if (!video.opts.allProgress && ev.type === 'progress' && !shouldDispatch(video.getProgress())) {