fix(analytics): refactor existing timeouts

jwplayer · Apr 11, 2023 · 9138a81 · 9138a81
1 parent 22cfa26
commit 9138a81
Show file tree

Hide file tree

Showing 3 changed files with 36 additions and 21 deletions.
diff --git a/docs/features/video-analytics.md b/docs/features/video-analytics.md
@@ -30,13 +30,14 @@ The data is available to customers in three ways:
 
 The app sends the following events (param `e`) to JW platform:
 
-| Name       | Value | Endpoint  | Rqd | Description                                                          |
-| ---------- | ----- | --------- | --- | -------------------------------------------------------------------- |
-| Setup      | e     | jwplayer6 | Yes | Fired after the landing screen embedding this video has been loaded. |
-| Impression | i     | clienta   | Yes | Fired after the first frame of an ad creative has been rendered.     |
-| Play       | s     | jwplayer6 | Yes | Fired after the first frame of a video has been rendered.            |
-| Quantile   | t     | jwplayer6 | Yes | Fired after the video plays past the threshold of a quantile.        |
-| Seeked     | vs    | jwplayer6 | Yes | Fired after the video is seeked                                      |
+| Name           | Value | Endpoint  | Rqd | Description                                                          |
+| -------------- | ----- | --------- | --- | -------------------------------------------------------------------- |
+| Setup          | e     | jwplayer6 | Yes | Fired after the landing screen embedding this video has been loaded. |
+| Impression     | i     | clienta   | Yes | Fired after the first frame of an ad creative has been rendered.     |
+| Play           | s     | jwplayer6 | Yes | Fired after the first frame of a video has been rendered.            |
+| Quantile       | t     | jwplayer6 | Yes | Fired after the video plays past the threshold of a quantile.        |
+| Seeked         | vs    | jwplayer6 | Yes | Fired after the video is seeked                                      |
+| Generic Aband. | gab   | jwplayer6 | Yes | Fired to try and track a user before they exit the page              |
 
 ## Event JS Script
 

diff --git a/public/jwpltx.js b/public/jwpltx.js
@@ -38,7 +38,7 @@ window.jwpltx = window.jwpltx || {};
     return (Math.ceil((progress / duration) * uri.q) * MAX_DURATION_IN_QUANTILES) / uri.q;
   }
 
-  // Here we convert seconds watched to quantiles, the units accepted by the analytics service (res is 0 - 128)
+  // Sends the last ping when closing the player or window
   function sendRemainingData() {
     if (uri.pw === -1) {
       clearLiveInterval();
@@ -47,11 +47,13 @@ window.jwpltx = window.jwpltx || {};
       uri.pw = pw;
     }
 
+    clearSeekingTimeout();
+
     if (timeWatched) {
       uri.ti = Math.floor(timeWatched);
       timeWatched = 0;
 
-      sendData('t');
+      sendData('gab');
     }
   }
 
@@ -68,6 +70,24 @@ window.jwpltx = window.jwpltx || {};
     liveInterval = null;
   }
 
+  // There is currently a 1 sec debounce surrounding seeking event in order to logically group multiple `seeked` events
+  function setSeekingTimeout() {
+    seekingTimeout = setTimeout(() => {
+      isSeeking = false;
+      // Set new timeout when seeked event reached for live events
+      if (uri.pw === -1 && !liveInterval) {
+        setLiveInterval();
+      }
+      sendData('vs');
+    }, 1000);
+  }
+
+  // We clear timeout after complete event or when new seeking events are received
+  function clearSeekingTimeout() {
+    clearTimeout(seekingTimeout);
+    seekingTimeout = null;
+  }
+
   // Process a player ready event
   o.ready = function (aid, bun, fed, id, t) {
     uri = JSON.parse(JSON.stringify(URI));
@@ -90,7 +110,7 @@ window.jwpltx = window.jwpltx || {};
   // Process seek event
   o.seek = function (offset, duration) {
     isSeeking = true;
-    clearTimeout(seekingTimeout);
+    clearSeekingTimeout();
     // Clear interval in case of a live stream not to update time watched while seeking
     if (uri.pw === -1) {
       clearLiveInterval();
@@ -103,15 +123,7 @@ window.jwpltx = window.jwpltx || {};
 
   // Process seeked event
   o.seeked = function () {
-    // There is currently a 1 sec debounce surrounding this event in order to logically group multiple `seeked` events
-    seekingTimeout = setTimeout(() => {
-      isSeeking = false;
-      // Set new timeout when seeked event reached for live events
-      if (uri.pw === -1 && !liveInterval) {
-        setLiveInterval();
-      }
-      sendData('vs');
-    }, 1000);
+    setSeekingTimeout();
   };
 
   // When player is disconnected from the page -> send the rest of the data and cancel possible intervals
@@ -206,10 +218,12 @@ window.jwpltx = window.jwpltx || {};
       uri.pw = MAX_DURATION_IN_QUANTILES;
     }
 
+    clearSeekingTimeout();
+
     uri.ti = Math.floor(timeWatched);
     timeWatched = 0;
 
-    sendData('t');
+    sendData('gab');
   };
 
   // Helper function to generate IDs

diff --git a/src/hooks/useOttAnalytics.ts b/src/hooks/useOttAnalytics.ts
@@ -59,7 +59,7 @@ const useOttAnalytics = (item?: PlaylistItem, feedId: string = '') => {
       player.off('seeked', seekedHandler);
       player.off('adImpression', adImpressionHandler);
     };
-  }, [player]);
+  }, [player, item]);
 
   return setPlayer;
 };