Support showing correlations for FennecAndroid. Fixes #27

correlations.html

@@ -10,6 +10,10 @@
 <script src="correlations.js" type="text/javascript"></script>
 <script src="correlations_page.js" type="text/javascript"></script>
 <span id="date" style="font-size: xx-small;"></span>
+<select name="product" id="product">
+  <option selected>Firefox</option>
+  <option>FennecAndroid</option>
+</select>
 <select name="channel" id="channel">
   <option selected>release</option>
   <option>beta</option>

correlations.js

@@ -1,5 +1,5 @@
 var correlations = (() => {
-  let correlationData;
+  let correlationData = {};
 
   function sha1(str) {
     return crypto.subtle.digest('SHA-1', new TextEncoder('utf-8').encode(str))
@@ -25,20 +25,30 @@ var correlations = (() => {
     return hexCodes.join('');
   }
 
-  function loadChannelsData() {
-    if (correlationData) {
+  function getDataURL(product) {
+    if (product === 'Firefox') {
+      return 'https://analysis-output.telemetry.mozilla.org/top-signatures-correlations/data/';
+    } else if (product === 'FennecAndroid') {
+      return 'https://analysis-output.telemetry.mozilla.org/top-fennec-signatures-correlations/data/';
+    } else {
+      throw new Error('Unknown product: ' + product);
+    }
+  }
+
+  function loadChannelsData(product) {
+    if (correlationData[product]) {
       return Promise.resolve();
     }
 
-    return fetch('https://analysis-output.telemetry.mozilla.org/top-signatures-correlations/data/all.json.gz')
+    return fetch(getDataURL(product) + 'all.json.gz')
     .then(response => response.json())
     .then(totals => {
-        correlationData = {
+        correlationData[product] = {
           'date': totals['date'],
         };
 
         for (let ch of ['release', 'beta', 'aurora', 'nightly']) {
-          correlationData[ch] = {
+          correlationData[product][ch] = {
             'total': totals[ch],
             'signatures': {},
           }
@@ -46,27 +56,28 @@ var correlations = (() => {
     });
   }
 
-  function loadCorrelationData(signature, channel) {
-    return loadChannelsData()
+  function loadCorrelationData(signature, channel, product) {
+    return loadChannelsData(product)
     .then(() => {
-      if (signature in correlationData[channel]['signatures']) {
+      if (signature in correlationData[product][channel]['signatures']) {
         return;
       }
 
       return sha1(signature)
-      .then(sha1signature => fetch('https://analysis-output.telemetry.mozilla.org/top-signatures-correlations/data/' + channel + '/' + sha1signature + '.json.gz'))
+      .then(sha1signature => fetch(getDataURL(product) + channel + '/' + sha1signature + '.json.gz'))
       .then(response => response.json())
       .then(data => {
-        correlationData[channel]['signatures'][signature] = data;
-      })
-      .catch(() => {});
+        correlationData[product][channel]['signatures'][signature] = data;
+      });
     })
+    .catch(() => {})
     .then(() => correlationData);
   }
 
-  function getAnalysisDate() {
-    return loadChannelsData()
-    .then(() => correlationData['date']);
+  function getAnalysisDate(product) {
+    return loadChannelsData(product)
+    .then(() => correlationData[product]['date'])
+    .catch(() => '');
   }
 
   function itemToLabel(item) {
@@ -107,20 +118,25 @@ var correlations = (() => {
     });
   }
 
-  function text(textElem, signature, channel) {
-    loadCorrelationData(signature, channel)
+  function text(textElem, signature, channel, product) {
+    loadCorrelationData(signature, channel, product)
     .then(data => {
       textElem.textContent = '';
 
-      if (!(signature in data[channel]['signatures']) || !data[channel]['signatures'][signature]['results']) {
-        textElem.textContent = 'No correlation data was generated for the signature "' + signature + '" on the ' + channel + ' channel.'
+      if (!(product in data)) {
+        textElem.textContent = 'No correlation data was generated for the \'' + product + '\' product.'
         return;
       }
 
-      let correlationData = data[channel]['signatures'][signature]['results'];
+      if (!(signature in data[product][channel]['signatures']) || !data[product][channel]['signatures'][signature]['results']) {
+        textElem.textContent = 'No correlation data was generated for the signature "' + signature + '" on the ' + channel + ' channel, for the \'' + product + '\' product.'
+        return;
+      }
 
-      let total_reference = data[channel].total;
-      let total_group = data[channel]['signatures'][signature].total;
+      let correlationData = data[product][channel]['signatures'][signature]['results'];
+
+      let total_reference = data[product][channel].total;
+      let total_group = data[product][channel]['signatures'][signature].total;
 
       textElem.textContent = sortCorrelationData(correlationData, total_reference, total_group)
       .reduce((prev, cur) =>
@@ -129,19 +145,19 @@ var correlations = (() => {
     });
   }
 
-  function graph(svgElem, signature, channel) {
-    loadCorrelationData(signature, channel)
+  function graph(svgElem, signature, channel, product) {
+    loadCorrelationData(signature, channel, product)
     .then(data => {
       d3.select(svgElem).selectAll('*').remove();
 
-      if (!(signature in data[channel]['signatures']) || !data[channel]['signatures'][signature]['results']) {
+      if (!(product in data) || !(signature in data[product][channel]['signatures']) || !data[product][channel]['signatures'][signature]['results']) {
         return;
       }
 
-      let total_reference = data[channel].total;
-      let total_group = data[channel]['signatures'][signature].total;
+      let total_reference = data[product][channel].total;
+      let total_group = data[product][channel]['signatures'][signature].total;
 
-      let correlationData = data[channel]['signatures'][signature]['results']
+      let correlationData = data[product][channel]['signatures'][signature]['results']
       .filter(elem => Object.keys(elem.item).length <= 1);
       correlationData = sortCorrelationData(correlationData, total_reference, total_group);
       correlationData.reverse();

correlations_page.js

@@ -1,4 +1,8 @@
 let options = {
+  'product': {
+    value: null,
+    type: 'option',
+  },
   'channel': {
     value: null,
     type: 'option',
@@ -31,24 +35,26 @@ function getCorrelations() {
   }
 
   let url = new URL(location.href);
-  url.search = '?channel=' + getOption('channel') + '&signature=' + getOption('signature');
+  url.search = '?product=' + getOption('product') + '&channel=' + getOption('channel') + '&signature=' + getOption('signature');
   history.replaceState({}, document.title, url.href);
 
   let signature = decodeURIComponent(getOption('signature'));
   let channel = getOption('channel');
+  let product = getOption('product');
 
   let preElem = document.getElementById('correlations_text');
-  correlations.text(preElem, signature, channel);
+  correlations.text(preElem, signature, channel, product);
 
   let svgElem = document.getElementById('correlations_image');
-  correlations.graph(svgElem, signature, channel);
+  correlations.graph(svgElem, signature, channel, product);
+}
+
+function updateAnalysisDate() {
+  correlations.getAnalysisDate(getOption('product'))
+  .then(date => document.getElementById('date').textContent = date)
 }
 
 onLoad
-.then(function() {
-  correlations.getAnalysisDate()
-  .then(date => document.getElementById('date').textContent = date)
-})
 .then(function() {
   let queryVars = new URL(location.href).search.substring(1).split('&');
 
@@ -89,6 +95,7 @@ onLoad
 
       elem.onchange = function() {
         setOption(optionName, elem.options[elem.selectedIndex].value);
+        updateAnalysisDate();
         getCorrelations();
       };
     } else if (optionType === 'button') {
@@ -108,6 +115,7 @@ onLoad
   });
 })
 .then(function() {
+  updateAnalysisDate();
   getCorrelations();
 })
 .catch(function(err) {

dashboard.js

@@ -230,7 +230,7 @@ function addRow(signature, obj) {
     signatureImage.setAttribute('height', 900);
     signatureTooltip.appendChild(signatureImage);
     signatureDiv.appendChild(signatureTooltip);
-    correlations.graph(signatureImage, signature, getOption('version'));
+    correlations.graph(signatureImage, signature, getOption('version'), 'Firefox');
   };
 
   key.appendChild(signatureDiv);