Configurable evoBucketIndex implementation (#571)

* Histogram Simulator link added to the landing/Home Page Page under Other DashBoards Section

Appropriate Description Added For Histogram Simulator Link in Home Page

* evoBucketIndex property added to param object to be passed into evoTime in wrapper js for generation of evolution

* Update generator.js

* Update generator.js

* evoBucketIndex parameter usage description added

* Update README.md

* Necessary formatting implemented

* configurable bucket index identifier name modified

* evoBucketIndex usage description modified

* bucketIndex validation added and description value modified for boolean type bucket values

dashboard-generator/generator.js

@@ -82,6 +82,7 @@ window.addEventListener('load', function () {
       sensibleCompare: $('#sensible-compare').checked,
       evoVersions: $('#evo-radio').checked ? $('#evo-versions').value : 0,
       filters: undefined,
+      evoBucketIndex: $('#evo-radio').checked ? 0 : -1
     };
 
     // now to add the filters
@@ -265,6 +266,7 @@ window.addEventListener('load', function () {
           sensibleCompare: params['sensibleCompare'][i],
           evoVersions: params['evoVersions'][i],
           filters: params['filters'][i] ? JSON.parse(params['filters'][i]) : '',
+          evoBucketIndex: params['evoBucketIndexes'][i]
         };
         _dash.push(plot);
         addPlotToTable(plot);
@@ -283,7 +285,8 @@ window.addEventListener('load', function () {
     var sensibleCompares = [];
     var evoVersionses = [];
     var filterses = [];
-    _dash.forEach(plot => {
+    var evoBucketIndexes = [];
+    _dash.forEach((plot) => {
       channels.push(plot.channel);
       versions.push(plot.version || '');
       metrics.push(plot.metric);
@@ -294,6 +297,7 @@ window.addEventListener('load', function () {
       sensibleCompares.push(plot.sensibleCompare || false);
       evoVersionses.push(plot.evoVersions || 0);
       filterses.push(plot.filters ? JSON.stringify(plot.filters) : '');
+      evoBucketIndexes.push(plot.evoBucketIndex);
     });
 
     var queryString = '?' +
@@ -301,7 +305,8 @@ window.addEventListener('load', function () {
       `&metric=${metrics.join(';')}&useSubmissionDate=${useSubmissionDates.join(';')}` +
       `&sanitize=${sanitizes.join(';')}&trim=${trims.join(';')}` +
       `&compare=${compares.join(';')}&sensibleCompare=${sensibleCompares.join(';')}` +
-      `&evoVersions=${evoVersionses.join(';')}&filters=${filterses.join(';')}`;
+      `&evoVersions=${evoVersionses.join(';')}&filters=${filterses.join(';')}` +
+      `&evoBucketIndexes=${evoBucketIndexes.join(';')}`;
 
     if (!window.location.search) {
       return window.location.href + queryString;

wrapper/README.md

@@ -22,6 +22,7 @@ Where `params` is:
 * `keyLimit` - a positive integer limiting the number of a keyed measure's measures to be plotted, ordered by number of submissions (default: `4`)
 * `evoVersions` - A number telling us how many versions back to look. If > 0, we will ignore trim, compare, and sensibleCompare and show an evolution instead of a histogram (default: `0`)
 * `percentile` - A number telling us the value below which a given percentage of measurements may be found. This is only valid when evoVersions > 0 (default: `50`)
+* `evoBucketIndex` - The index denoting which bucket index to used to view an evolution for enumerated histograms. (default:0)
 
 Where `parentEl` is:
 * The parent element you want the wrapper to render its plots into.

wrapper/telemetry-wrapper.js

@@ -20,7 +20,6 @@ window.TelemetryWrapper = window.TelemetryWrapper || {};
  *  - evoVersions:int - show evolutions of values over the past `evoVersions` versions in `channel` starting at `version` instead of histograms
 */
 window.TelemetryWrapper.go = function (params, element) {
-
   Telemetry.init(function () {
     setDefaultParams(params);
 
@@ -353,14 +352,14 @@ window.TelemetryWrapper.go = function (params, element) {
     var percentileLabel = ' - medians'; // i18n?
     var valuesArePercent = false;
     if (kind == 'enumerated' || kind == 'boolean' || kind == 'flag') {
-      const BUCKET_INDEX_FOR_ENUMERATED = 0;
+      const bucketIndex = params.evoBucketIndex > 0 ? params.evoBucketIndex : 0;
-      if (kind == 'boolean') {
+      if (kind == 'boolean' && bucketIndex == 0) {
         yLabel = desc + ' % FALSE'; // TODO: i18n
       } else {
-        yLabel = desc + ' - bucket ' + BUCKET_INDEX_FOR_ENUMERATED; // i18n?
+        yLabel = desc + ' - bucket ' + bucketIndex; // i18n?
       }
       valueses = evolutions.map(evo =>
-        evo.map(hist => 100 * hist.values[BUCKET_INDEX_FOR_ENUMERATED] / hist.count
+        evo.map(hist => 100 * hist.values[(bucketIndex >= hist.values.length ? 0 : bucketIndex)] / hist.count
       ));
       valuesArePercent = true;
     } else {