DevTools: render product badges behind the setting.

third_party/WebKit/Source/devtools/front_end/common/Color.js

 /*
  * Copyright (C) 2009 Apple Inc.  All rights reserved.
  * Copyright (C) 2009 Joseph Pecoraro
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * are met:
  *
  * 1.  Redistributions of source code must retain the above copyright
  *     notice, this list of conditions and the following disclaimer.
@@ skipping 799 matching lines @@
   Padding: Common.Color.fromRGBA([147, 196, 125, .55]),
   PaddingLight: Common.Color.fromRGBA([147, 196, 125, .4]),
   Border: Common.Color.fromRGBA([255, 229, 153, .66]),
   BorderLight: Common.Color.fromRGBA([255, 229, 153, .5]),
   Margin: Common.Color.fromRGBA([246, 178, 107, .66]),
   MarginLight: Common.Color.fromRGBA([246, 178, 107, .5]),
   EventTarget: Common.Color.fromRGBA([255, 196, 196, .66]),
   Shape: Common.Color.fromRGBA([96, 82, 177, 0.8]),
   ShapeMargin: Common.Color.fromRGBA([96, 82, 127, .6])
 };
+
+Common.Color.Generator = class {
+  /**
+   * @param {!{min: number, max: number}|number=} hueSpace
+   * @param {!{min: number, max: number, count: (number|undefined)}|number=} satSpace
+   * @param {!{min: number, max: number, count: (number|undefined)}|number=} lightnessSpace
+   * @param {!{min: number, max: number, count: (number|undefined)}|number=} alphaSpace
+   */
+  constructor(hueSpace, satSpace, lightnessSpace, alphaSpace) {
+    this._hueSpace = hueSpace || {min: 0, max: 360};
+    this._satSpace = satSpace || 67;
+    this._lightnessSpace = lightnessSpace || 80;
+    this._alphaSpace = alphaSpace || 1;
+    /** @type {!Map<string, string>} */
+    this._colors = new Map();
+  }
+
+  /**
+   * @param {string} id
+   * @param {string} color
+   */
+  setColorForID(id, color) {
+    this._colors.set(id, color);
+  }
+
+  /**
+   * @param {string} id
+   * @return {string}
+   */
+  colorForID(id) {
+    var color = this._colors.get(id);
+    if (!color) {
+      color = this._generateColorForID(id);
+      this._colors.set(id, color);
+    }
+    return color;
+  }
+
+  /**
+   * @param {string} id
+   * @return {string}
+   */
+  _generateColorForID(id) {
+    var hash = String.hashCode(id);
+    var h = this._indexToValueInSpace(hash, this._hueSpace);
+    var s = this._indexToValueInSpace(hash >> 8, this._satSpace);
+    var l = this._indexToValueInSpace(hash >> 16, this._lightnessSpace);
+    var a = this._indexToValueInSpace(hash >> 24, this._alphaSpace);
+    return `hsla(${h}, ${s}%, ${l}%, ${a})`;
+  }
+
+  /**
+   * @param {number} index
+   * @param {!{min: number, max: number, count: (number|undefined)}|number} space
+   * @return {number}
+   */
+  _indexToValueInSpace(index, space) {
+    if (typeof space === 'number')
+      return space;
+    var count = space.count || space.max - space.min;
+    index %= count;
+    return space.min + Math.floor(index / (count - 1) * (space.max - space.min));
+  }
+};