src/third_party/trace-viewer/src/tracing/color_scheme.js

   1 // Copyright (c) 2012 The Chromium Authors. All rights reserved.
   2 // Use of this source code is governed by a BSD-style license that can be
   3 // found in the LICENSE file.
   4
   5 'use strict';
   6
   7 tvcm.require('tracing.trace_model.event');
   8
   9 /**
  10  * @fileoverview Provides color scheme related functions.
  11  */
  12 tvcm.exportTo('tracing', function() {
  13
  14   var SelectionState = tracing.trace_model.SelectionState;
  15
  16   // The color palette is split in half, with the upper
  17   // half of the palette being the "highlighted" verison
  18   // of the base color. So, color 7's highlighted form is
  19   // 7 + (palette.length / 2).
  20   //
  21   // These bright versions of colors are automatically generated
  22   // from the base colors.
  23   //
  24   // Within the color palette, there are "regular" colors,
  25   // which can be used for random color selection, and
  26   // reserved colors, which are used when specific colors
  27   // need to be used, e.g. where red is desired.
  28   var paletteBase = [
  29     {r: 138, g: 113, b: 152},
  30     {r: 175, g: 112, b: 133},
  31     {r: 127, g: 135, b: 225},
  32     {r: 93, g: 81, b: 137},
  33     {r: 116, g: 143, b: 119},
  34     {r: 178, g: 214, b: 122},
  35     {r: 87, g: 109, b: 147},
  36     {r: 119, g: 155, b: 95},
  37     {r: 114, g: 180, b: 160},
  38     {r: 132, g: 85, b: 103},
  39     {r: 157, g: 210, b: 150},
  40     {r: 148, g: 94, b: 86},
  41     {r: 164, g: 108, b: 138},
  42     {r: 139, g: 191, b: 150},
  43     {r: 110, g: 99, b: 145},
  44     {r: 80, g: 129, b: 109},
  45     {r: 125, g: 140, b: 149},
  46     {r: 93, g: 124, b: 132},
  47     {r: 140, g: 85, b: 140},
  48     {r: 104, g: 163, b: 162},
  49     {r: 132, g: 141, b: 178},
  50     {r: 131, g: 105, b: 147},
  51     {r: 135, g: 183, b: 98},
  52     {r: 152, g: 134, b: 177},
  53     {r: 141, g: 188, b: 141},
  54     {r: 133, g: 160, b: 210},
  55     {r: 126, g: 186, b: 148},
  56     {r: 112, g: 198, b: 205},
  57     {r: 180, g: 122, b: 195},
  58     {r: 203, g: 144, b: 152},
  59     // Reserved Entires
  60     {r: 182, g: 125, b: 143},
  61     {r: 126, g: 200, b: 148},
  62     {r: 133, g: 160, b: 210},
  63     {r: 240, g: 240, b: 240},
  64     {r: 199, g: 155, b: 125}];
  65
  66   // Make sure this number tracks the number of reserved entries in the
  67   // palette.
  68   var numReservedColorIds = 5;
  69
  70   function brighten(c) {
  71     var k;
  72     if (c.r >= 240 && c.g >= 240 && c.b >= 240)
  73       k = -0.20;
  74     else
  75       k = 0.45;
  76
  77     return {r: Math.min(255, c.r + Math.floor(c.r * k)),
  78       g: Math.min(255, c.g + Math.floor(c.g * k)),
  79       b: Math.min(255, c.b + Math.floor(c.b * k))};
  80   }
  81   function colorToRGBString(c) {
  82     return 'rgb(' + c.r + ',' + c.g + ',' + c.b + ')';
  83   }
  84   function colorToRGBAString(c, a) {
  85     return 'rgba(' + c.r + ',' + c.g + ',' + c.b + ',' + a + ')';
  86   }
  87
  88   /**
  89    * The number of color IDs that getStringColorId can choose from.
  90    */
  91   var numRegularColorIds = paletteBase.length - numReservedColorIds;
  92   var highlightIdBoost = paletteBase.length;
  93
  94   var paletteRaw = paletteBase.concat(paletteBase.map(brighten));
  95   var palette = paletteRaw.map(colorToRGBString);
  96   /**
  97    * Computes a simplistic hashcode of the provide name. Used to chose colors
  98    * for slices.
  99    * @param {string} name The string to hash.
 100    */
 101   function getStringHash(name) {
 102     var hash = 0;
 103     for (var i = 0; i < name.length; ++i)
 104       hash = (hash + 37 * hash + 11 * name.charCodeAt(i)) % 0xFFFFFFFF;
 105     return hash;
 106   }
 107
 108   /**
 109    * Gets the color palette.
 110    */
 111   function getColorPalette() {
 112     return palette;
 113   }
 114
 115   /**
 116    * @return {Number} The value to add to a color ID to get its highlighted
 117    * colro ID. E.g. 7 + getPaletteHighlightIdBoost() yields a brightened from
 118    * of 7's base color.
 119    */
 120   function getColorPaletteHighlightIdBoost() {
 121     return highlightIdBoost;
 122   }
 123
 124   /**
 125    * @param {String} name The color name.
 126    * @return {Number} The color ID for the given color name.
 127    */
 128   function getColorIdByName(name) {
 129     if (name == 'iowait')
 130       return numRegularColorIds;
 131     if (name == 'running')
 132       return numRegularColorIds + 1;
 133     if (name == 'runnable')
 134       return numRegularColorIds + 2;
 135     if (name == 'sleeping')
 136       return numRegularColorIds + 3;
 137     if (name == 'UNKNOWN')
 138       return numRegularColorIds + 4;
 139     throw new Error('Unrecognized color ') + name;
 140   }
 141
 142   // Previously computed string color IDs. They are based on a stable hash, so
 143   // it is safe to save them throughout the program time.
 144   var stringColorIdCache = {};
 145
 146   /**
 147    * @return {Number} A color ID that is stably associated to the provided via
 148    * the getStringHash method. The color ID will be chosen from the regular
 149    * ID space only, e.g. no reserved ID will be used.
 150    */
 151   function getStringColorId(string) {
 152     if (stringColorIdCache[string] === undefined) {
 153       var hash = getStringHash(string);
 154       stringColorIdCache[string] = hash % numRegularColorIds;
 155     }
 156     return stringColorIdCache[string];
 157   }
 158
 159   /**
 160    * Provides methods to get view values for events.
 161    */
 162   var EventPresenter = {
 163     getAlpha_: function(event) {
 164       if (event.selectionState === SelectionState.DIMMED)
 165         return 0.3;
 166       return 1.0;
 167     },
 168
 169     getColorIdOffset_: function(event) {
 170       if (event.selectionState === SelectionState.SELECTED)
 171         return highlightIdBoost;
 172       return 0;
 173     },
 174
 175     getTextColor: function(event) {
 176       if (event.selectionState === SelectionState.DIMMED)
 177         return 'rgb(60,60,60)';
 178       return 'rgb(0,0,0)';
 179     },
 180
 181     getSliceColorId: function(slice) {
 182       return slice.colorId + this.getColorIdOffset_(slice);
 183     },
 184
 185     getSliceAlpha: function(slice, async) {
 186       var alpha = this.getAlpha_(slice);
 187       if (async)
 188         alpha *= 0.3;
 189       return alpha;
 190     },
 191
 192     getInstantSliceColor: function(instant) {
 193       var colorId = instant.colorId + this.getColorIdOffset_(instant);
 194       return colorToRGBAString(paletteRaw[colorId], this.getAlpha_(instant));
 195     },
 196
 197     getObjectInstanceColor: function(instance) {
 198       var colorId = instance.colorId + this.getColorIdOffset_(instance);
 199       return colorToRGBAString(paletteRaw[colorId], 0.25);
 200     },
 201
 202     getObjectSnapshotColor: function(snapshot) {
 203       var colorId =
 204           snapshot.objectInstance.colorId + this.getColorIdOffset_(snapshot);
 205       return palette[colorId];
 206     },
 207
 208     getCounterSeriesColor: function(colorId, selectionState) {
 209       return colorToRGBAString(
 210           paletteRaw[colorId],
 211           this.getAlpha_({selectionState: selectionState}));
 212     },
 213
 214     getBarSnapshotColor: function(snapshot, offset) {
 215       var colorId =
 216           (snapshot.objectInstance.colorId + offset) % numRegularColorIds;
 217       colorId += this.getColorIdOffset_(snapshot);
 218       return colorToRGBAString(paletteRaw[colorId], this.getAlpha_(snapshot));
 219     }
 220   };
 221
 222   return {
 223     getColorPalette: getColorPalette,
 224     getColorPaletteHighlightIdBoost: getColorPaletteHighlightIdBoost,
 225     getColorIdByName: getColorIdByName,
 226     getStringHash: getStringHash,
 227     getStringColorId: getStringColorId,
 228     EventPresenter: EventPresenter
 229   };
 230 });