skyquake/plugins/composer/src/src/libraries/ColorGroups.js

   1 /**
   2  * Created by onvelocity on 2/3/16.
   3  */
   4 'use strict';
   5 const pairedColors = ['#fb9a99','#e31a1c','#a6cee3','#1f78b4','#b2df8a','#33a02c','#fdbf6f','#ff7f00','#cab2d6','#6a3d9a','#ffff99','#b15928'];
   6
   7 import colorTheme from '../assets/rift.ware-color-theme.json'
   8
   9 /**
  10  *
  11  * Colors are also defined in _ColorGroups.scss. HINT: Uncomment the console statement at the bottom of this file to
  12  * generate the variables and then copy and paste them into the .scss file.
  13  *
  14  * Externalized colors into a .json file to make it easier to modify them.
  15  */
  16 const ColorGroups = {
  17         // http://colorbrewer2.org/?type=qualitative&scheme=Paired&n=12
  18         getColorPair(index) {
  19                 // make sure index is not larger than our list of colors
  20                 index = (index * 2) % 12;
  21                 return {
  22                         primary: pairedColors[index + 1],
  23                         secondary: pairedColors[index]
  24                 };
  25         },
  26         getColorCSS() {
  27                 return Object.keys(colorTheme).map((key) => {
  28                         if (typeof colorTheme[key] === 'object') {
  29                                 const color = colorTheme[key];
  30                                 return Object.keys(color).map(name => {
  31                                         return `\$${key}-${name}-color: ${color[name]};`
  32                                 }).join('\n');
  33                         }
  34                         if (typeof colorTheme[key] === 'string') {
  35                                 const color = colorTheme[key];
  36                                 return `$descriptor-${key}: ${color};\n\n`
  37                         }
  38                 }).join('\n\n');
  39         },
  40         getColorPairForType(type) {
  41                 const colors = colorTheme[type];
  42                 if (colors) {
  43                         return colors;
  44                 }
  45                 return colorTheme.common;
  46         }
  47 };
  48
  49 //console.log(ColorGroups.getColorCSS());
  50
  51 Object.assign(ColorGroups, colorTheme);
  52
  53 export default ColorGroups;