adding functionality to detect user download speed

ui/analytics.js

@@ -10,6 +10,13 @@ import ElectronCookies from '@exponent/electron-cookies';
 import { generateInitialUrl } from 'util/url';
 // @endif
 import { MATOMO_ID, MATOMO_URL } from 'config';
+import getConnectionSpeed from 'util/detect-user-bandwidth';
+
+let downloadSpeed;
+getConnectionSpeed(function(speedInMbps){
+  downloadSpeed = speedInMbps;
+  console.log(downloadSpeed);
+});
 
 const isProduction = process.env.NODE_ENV === 'production';
 const devInternalApis = process.env.LBRY_API_URL && process.env.LBRY_API_URL.includes('dev');
@@ -202,8 +209,10 @@ async function sendWatchmanData(body) {
 }
 
 const analytics: Analytics = {
-  // receive buffer events from tracking plugin and jklj
+  // receive buffer events from tracking plugin and save buffer amounts and times for backend call
   videoBufferEvent: async (claim, data) => {
+    console.log('running here!');
+    console.log(data);
     amountOfBufferEvents = amountOfBufferEvents + 1;
     amountOfBufferTimeInMS = amountOfBufferTimeInMS + data.bufferDuration;
   },

ui/redux/actions/app.js

@@ -505,6 +505,7 @@ export function doAnalyticsBuffer(uri, bufferData) {
     const fileSizeInBits = fileSize * 8;
     const bitRate = parseInt(fileSizeInBits / fileDurationInSeconds);
     const userId = user && user.id.toString();
+    // if there's a logged in user, send buffer event data to watchman
     if (userId) {
       analytics.videoBufferEvent(claim, {
         timeAtBuffer,

ui/util/detect-user-bandwidth.js

@@ -0,0 +1,38 @@
+var startTime;
+var endTime;
+
+var testConnectionSpeed = {
+  imageAddr: 'https://upload.wikimedia.org/wikipedia/commons/a/a6/Brandenburger_Tor_abends.jpg', // this is just an example, you rather want an image hosted on your server
+  downloadSize: 2707459, // this must match with the image above
+
+  getConnectionSpeed: function(callback) {
+    testConnectionSpeed.InitiateSpeedDetection();
+    testConnectionSpeed.callback = callback;
+  },
+  InitiateSpeedDetection: function() {
+    window.setTimeout(testConnectionSpeed.MeasureConnectionSpeed, 1);
+  },
+  result: function() {
+    var duration = (endTime - startTime) / 1000;
+    var bitsLoaded = testConnectionSpeed.downloadSize * 8;
+    var speedBps = (bitsLoaded / duration).toFixed(2);
+    var speedKbps = (speedBps / 1024).toFixed(2);
+    var speedMbps = (speedKbps / 1024).toFixed(2);
+    testConnectionSpeed.callback(speedMbps);
+  },
+  MeasureConnectionSpeed: function() {
+    var download = new Image();
+    download.onload = function() {
+      endTime = (new Date()).getTime();
+      testConnectionSpeed.result();
+    };
+    startTime = (new Date()).getTime();
+    var cacheBuster = '?nnn=' + startTime;
+    download.src = testConnectionSpeed.imageAddr + cacheBuster;
+  },
+};
+
+// start test immediatly, you could also call this on any event or whenever you want
+// testConnectionSpeed.getConnectionSpeed(function(time) { console.log(time) });
+
+module.exports = testConnectionSpeed.getConnectionSpeed;