src/third_party/trace-viewer/third_party/tvcm/src/tvcm/ui/color_scheme.html

   1 <!DOCTYPE html>
   2 <!--
   3 Copyright (c) 2014 The Chromium Authors. All rights reserved.
   4 Use of this source code is governed by a BSD-style license that can be
   5 found in the LICENSE file.
   6 -->
   7 <link rel="import" href="/tvcm.html">
   8 <script>
   9 'use strict';
  10
  11 /**
  12  * @fileoverview Provides color scheme related functions.
  13  */
  14 tvcm.exportTo('tvcm.ui', function() {
  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    * Gets the raw color palette, where entries are still objects.
 117    */
 118   function getRawColorPalette() {
 119     return paletteRaw;
 120   }
 121
 122   /**
 123    * @return {Number} The value to add to a color ID to get its highlighted
 124    * colro ID. E.g. 7 + getPaletteHighlightIdBoost() yields a brightened from
 125    * of 7's base color.
 126    */
 127   function getColorPaletteHighlightIdBoost() {
 128     return highlightIdBoost;
 129   }
 130
 131   /**
 132    * @param {String} name The color name.
 133    * @return {Number} The color ID for the given color name.
 134    */
 135   function getColorIdByName(name) {
 136     if (name == 'iowait')
 137       return numRegularColorIds;
 138     if (name == 'running')
 139       return numRegularColorIds + 1;
 140     if (name == 'runnable')
 141       return numRegularColorIds + 2;
 142     if (name == 'sleeping')
 143       return numRegularColorIds + 3;
 144     if (name == 'UNKNOWN')
 145       return numRegularColorIds + 4;
 146     throw new Error('Unrecognized color ') + name;
 147   }
 148
 149   // Previously computed string color IDs. They are based on a stable hash, so
 150   // it is safe to save them throughout the program time.
 151   var stringColorIdCache = {};
 152
 153   /**
 154    * @return {Number} A color ID that is stably associated to the provided via
 155    * the getStringHash method. The color ID will be chosen from the regular
 156    * ID space only, e.g. no reserved ID will be used.
 157    */
 158   function getStringColorId(string) {
 159     if (stringColorIdCache[string] === undefined) {
 160       var hash = getStringHash(string);
 161       stringColorIdCache[string] = hash % numRegularColorIds;
 162     }
 163     return stringColorIdCache[string];
 164   }
 165
 166   return {
 167     colorToRGBString: colorToRGBString,
 168     colorToRGBAString: colorToRGBAString,
 169     getRawColorPalette: getRawColorPalette,
 170     getColorPalette: getColorPalette,
 171     paletteProperties: {
 172       numRegularColorIds: numRegularColorIds,
 173       highlightIdBoost: highlightIdBoost
 174     },
 175     getColorPaletteHighlightIdBoost: getColorPaletteHighlightIdBoost,
 176     getColorIdByName: getColorIdByName,
 177     getStringHash: getStringHash,
 178     getStringColorId: getStringColorId
 179   };
 180 });
 181 </script>