add percentsPlayedMoments option; refactor timeupdate handler; use no…

…t rounded values for accurate calculation of percent values
mickey · Apr 24, 2017 · d7bb61a · d7bb61a
1 parent 69281ed
commit d7bb61a
Show file tree

Hide file tree

Showing 4 changed files with 83 additions and 49 deletions.
diff --git a/README.md b/README.md
@@ -70,8 +70,14 @@ Most of the events are selft explanatory, here's the ones that may need more det
 ####percentsPlayedInterval
 
 This option goes with the ```percentsPlayed``` event. Every ```percentsPlayedInterval``` percents an event will be sent to GA.
+Set this options to `false` if you want to use `percentsPlayedMoments` option and don't want to track every 10 percent of playback.
 **default:** 10
 
+####percentsPlayedMoments
+
+This option goes with the ```percentsPlayed``` event. After each value of ```percentsPlayedMoments``` percents of the actual playback an event will be sent.
+**default:** ```[]```
+
 ####secondsPlayedInterval
 
 This option goes with the ```secondsPlayed``` event. Every ```secondsPlayedInterval``` seconds of the actual playback an event will be sent to GA.

diff --git a/dist/videojs.ga.js b/dist/videojs.ga.js
@@ -1,13 +1,13 @@
 /*
-* videojs-ga - v0.5.1 - 2017-04-21
+* videojs-ga - v0.5.1 - 2017-04-24
 * Copyright (c) 2017 Michael Bensoussan
 * Licensed MIT
 */
 (function() {
   var __indexOf = [].indexOf || function(item) { for (var i = 0, l = this.length; i < l; i++) { if (i in this && this[i] === item) return i; } return -1; };
 
   videojs.plugin('ga', function(options) {
-    var adend, adpause, adserror, adskip, adstart, adtimeout, autoLabel, dataSetupOptions, defaultsEventsToTrack, end, ended, error, eventCategory, eventLabel, eventsToTrack, firstplay, fullscreen, getCurrentTime, getCurrentValue, init, interval, isFinite, loaded, parsedOptions, pause, percentsAlreadyTracked, percentsPlayedInterval, play, playing, resize, secondsPlayed, secondsPlayedInterval, secondsPlayedMoments, seekEnd, seekStart, seeking, sendbeacon, startTimeTracking, stopTimeTracking, timeupdate, trackReplaySeconds, trackSeconds, trackingTime, volumeChange,
+    var adend, adpause, adserror, adskip, adstart, adtimeout, autoLabel, dataSetupOptions, defaultsEventsToTrack, end, ended, error, eventCategory, eventLabel, eventsToTrack, firstplay, fullscreen, getCurrentTime, getCurrentValue, init, interval, isFinite, loaded, parsedOptions, pause, percentsPlayedInterval, percentsPlayedMoments, percentsTracked, play, playing, resize, secondsPlayed, secondsPlayedInterval, secondsPlayedMoments, seekEnd, seekStart, seeking, sendbeacon, startTimeTracking, stopTimeTracking, timeupdate, trackPercent, trackReplaySeconds, trackSeconds, trackSeek, trackingTime, volumeChange,
       _this = this;
     if (options == null) {
       options = {};
@@ -25,10 +25,11 @@
     autoLabel = options.autoLabel != null ? options.autoLabel : true;
     eventLabel = options.eventLabel || dataSetupOptions.eventLabel;
     percentsPlayedInterval = options.percentsPlayedInterval || dataSetupOptions.percentsPlayedInterval || 10;
+    percentsPlayedMoments = options.percentsPlayedMoments || dataSetupOptions.percentsPlayedMoments || [];
     secondsPlayedInterval = options.secondsPlayedInterval || dataSetupOptions.secondsPlayedInterval || 60;
-    secondsPlayedMoments = options.secondsPlayedMoments || dataSetupOptions.secondsPlayedMoments;
+    secondsPlayedMoments = options.secondsPlayedMoments || dataSetupOptions.secondsPlayedMoments || [];
     trackReplaySeconds = options.trackReplaySeconds;
-    percentsAlreadyTracked = [];
+    percentsTracked = [];
     seekStart = seekEnd = 0;
     seeking = false;
     ended = false;
@@ -56,34 +57,47 @@
       }
     };
     timeupdate = function() {
-      var currentTime, duration, percent, percentPlayed, _i;
       if (!isFinite) {
         return;
       }
-      currentTime = getCurrentValue();
-      duration = Math.round(this.duration());
-      percentPlayed = Math.round(currentTime / duration * 100);
-      if (percentsPlayedInterval) {
-        for (percent = _i = 0; _i <= 99; percent = _i += percentsPlayedInterval) {
-          if (percent > 0 && percentPlayed >= percent && __indexOf.call(percentsAlreadyTracked, percent) < 0) {
-            if (__indexOf.call(eventsToTrack, 'percentsPlayed') >= 0 && percentPlayed !== 0) {
-              sendbeacon('percent played', true, percent);
-            }
-            if (percentPlayed > 0) {
-              percentsAlreadyTracked.push(percent);
-            }
-          }
-        }
+      if (__indexOf.call(eventsToTrack, 'percentsPlayed') >= 0) {
+        trackPercent();
       }
       if (__indexOf.call(eventsToTrack, 'seek') >= 0) {
-        seekStart = seekEnd;
-        seekEnd = currentTime;
-        if (Math.abs(seekStart - seekEnd) > 1) {
-          seeking = true;
-          sendbeacon('seek start', false, seekStart);
-          sendbeacon('seek end', false, seekEnd);
+        trackSeek();
+      }
+    };
+    trackPercent = function() {
+      var currentTime, duration, percent, percentToTrack, percentsPlayed, _i, _len;
+      currentTime = _this.currentTime();
+      duration = _this.duration();
+      percentsPlayed = Math.round(currentTime / duration * 100);
+      percentToTrack = void 0;
+      if (!percentsPlayed || __indexOf.call(percentsTracked, percentsPlayed) >= 0) {
+        return;
+      }
+      for (_i = 0, _len = percentsPlayedMoments.length; _i < _len; _i++) {
+        percent = percentsPlayedMoments[_i];
+        if (percent === percentsPlayed) {
+          percentToTrack = percentsPlayed;
         }
       }
+      if (percentsPlayedInterval && !(percentsPlayed % percentsPlayedInterval)) {
+        percentToTrack = percent = percentsPlayed;
+      }
+      if (percentToTrack) {
+        sendbeacon('percent played', true, percentsPlayed);
+        return percentsTracked.push(percentsPlayed);
+      }
+    };
+    trackSeek = function() {
+      seekStart = seekEnd;
+      seekEnd = getCurrentValue();
+      if (Math.abs(seekStart - seekEnd) > 1) {
+        seeking = true;
+        sendbeacon('seek start', false, seekStart);
+        return sendbeacon('seek end', false, seekEnd);
+      }
     };
     startTimeTracking = function() {
       var currentTime;

diff --git a/dist/videojs.ga.min.js b/dist/videojs.ga.min.js
diff --git a/src/videojs.ga.coffee b/src/videojs.ga.coffee
@@ -25,12 +25,13 @@ videojs.plugin 'ga', (options = {}) ->
   autoLabel = if options.autoLabel? then options.autoLabel else true
   eventLabel = options.eventLabel || dataSetupOptions.eventLabel
   percentsPlayedInterval = options.percentsPlayedInterval || dataSetupOptions.percentsPlayedInterval || 10
+  percentsPlayedMoments = options.percentsPlayedMoments || dataSetupOptions.percentsPlayedMoments || []
   secondsPlayedInterval = options.secondsPlayedInterval || dataSetupOptions.secondsPlayedInterval || 60
-  secondsPlayedMoments = options.secondsPlayedMoments || dataSetupOptions.secondsPlayedMoments
+  secondsPlayedMoments = options.secondsPlayedMoments || dataSetupOptions.secondsPlayedMoments || []
   trackReplaySeconds = options.trackReplaySeconds
 
   # init a few variables
-  percentsAlreadyTracked = []
+  percentsTracked = []
   seekStart = seekEnd = 0
   seeking = false
   ended = false
@@ -67,31 +68,44 @@ videojs.plugin 'ga', (options = {}) ->
   timeupdate = ->
     return unless isFinite
 
-    currentTime = getCurrentValue()
-    duration = Math.round(@duration())
-    percentPlayed = Math.round(currentTime/duration*100)
-
-    if percentsPlayedInterval
-      for percent in [0..99] by percentsPlayedInterval
-        if percent > 0 && percentPlayed >= percent && percent not in percentsAlreadyTracked
-
-          if 'percentsPlayed' in eventsToTrack && percentPlayed != 0
-            sendbeacon( 'percent played', true, percent )
-
-          if percentPlayed > 0
-            percentsAlreadyTracked.push(percent)
+    if 'percentsPlayed' in eventsToTrack
+      trackPercent()
 
     if 'seek' in eventsToTrack
-      seekStart = seekEnd
-      seekEnd = currentTime
-      # if the difference between the start and the end are greater than 1 it's a seek.
-      if Math.abs(seekStart - seekEnd) > 1
-        seeking = true
-        sendbeacon( 'seek start', false, seekStart )
-        sendbeacon( 'seek end', false, seekEnd )
+      trackSeek()
 
     return
 
+  trackPercent = =>
+    currentTime = @currentTime()
+    duration = @duration()
+    percentsPlayed = Math.round(currentTime / duration * 100)
+    percentToTrack = undefined
+
+    return if !percentsPlayed || percentsPlayed in percentsTracked
+
+    # handle `percentsPlayedMoments`
+    for percent in percentsPlayedMoments
+      if percent is percentsPlayed
+        percentToTrack = percentsPlayed
+
+    # handle `percentsPlayedInterval`
+    if percentsPlayedInterval && !(percentsPlayed % percentsPlayedInterval)
+      percentToTrack = percent = percentsPlayed
+
+    if percentToTrack
+      sendbeacon( 'percent played', true, percentsPlayed )
+      percentsTracked.push(percentsPlayed)
+
+  trackSeek = ->
+    seekStart = seekEnd
+    seekEnd = getCurrentValue()
+    # if the difference between the start and the end are greater than 1 it's a seek.
+    if Math.abs(seekStart - seekEnd) > 1
+      seeking = true
+      sendbeacon( 'seek start', false, seekStart )
+      sendbeacon( 'seek end', false, seekEnd )
+
   startTimeTracking = =>
     return if !trackSeconds || trackingTime