iep-ui/lib/toolkits/colorUtils.js

An enterprise-class UI design language and Vue-based implementation

'use strict';

Object.defineProperty(exports, "__esModule", {
  value: true
});

var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');

var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);

var _createClass2 = require('babel-runtime/helpers/createClass');

var _createClass3 = _interopRequireDefault(_createClass2);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }

var ColorUtils = function () {
  function ColorUtils() {
    (0, _classCallCheck3['default'])(this, ColorUtils);
  }

  (0, _createClass3['default'])(ColorUtils, [{
    key: 'formatColor',
    value: function formatColor(e, opti) {
      var color = this.toNum3(e);
      return 'rgba(' + color[0] + ',' + color[1] + ',' + color[2] + ',' + opti + ')';
    }
  }, {
    key: 'isHex',
    value: function isHex(color) {
      return color.length >= 4 && color[0] === '#';
    }
  }, {
    key: 'isRgb',
    value: function isRgb(color) {
      return color.length >= 10 && color.slice(0, 3) === 'rgb';
    }
  }, {
    key: 'isRgba',
    value: function isRgba(color) {
      return color.length >= 13 && color.slice(0, 4) === 'rgba';
    }
  }, {
    key: 'pad2',
    value: function pad2(num) {
      var t = num.toString(16);
      if (t.length === 1) t = '0' + t;
      return t;
    }
  }, {
    key: 'lighten',
    value: function lighten(colorStr, weight) {
      return this.mix('fff', colorStr, weight);
    }
  }, {
    key: 'darken',
    value: function darken(colorStr, weight) {
      return this.mix('000', colorStr, weight);
    }
  }, {
    key: 'mix',
    value: function mix(color1, color2, weight1, alpha1, alpha2) {
      color1 = this.dropPrefix(color1);
      color2 = this.dropPrefix(color2);
      if (weight1 === undefined) weight1 = 0.5;
      if (alpha1 === undefined) alpha1 = 1;
      if (alpha2 === undefined) alpha2 = 1;

      var w = 2 * weight1 - 1;
      var alphaDelta = alpha1 - alpha2;
      var w1 = ((w * alphaDelta === -1 ? w : (w + alphaDelta) / (1 + w * alphaDelta)) + 1) / 2;
      var w2 = 1 - w1;

      var rgb1 = this.toNum3(color1);
      var rgb2 = this.toNum3(color2);
      var r = Math.round(w1 * rgb1[0] + w2 * rgb2[0]);
      var g = Math.round(w1 * rgb1[1] + w2 * rgb2[1]);
      var b = Math.round(w1 * rgb1[2] + w2 * rgb2[2]);
      return '#' + this.pad2(r) + this.pad2(g) + this.pad2(b);
    }
  }, {
    key: 'rgbaToRgb',
    value: function rgbaToRgb(colorStr, alpha, bgColorStr) {
      return this.mix(colorStr, bgColorStr || 'fff', 0.5, alpha, 1 - alpha);
    }
  }, {
    key: 'toNum3',
    value: function toNum3(colorStr) {
      colorStr = this.dropPrefix(colorStr);
      if (colorStr.length === 3) {
        colorStr = colorStr[0] + colorStr[0] + colorStr[1] + colorStr[1] + colorStr[2] + colorStr[2];
      }
      var r = parseInt(colorStr.slice(0, 2), 16);
      var g = parseInt(colorStr.slice(2, 4), 16);
      var b = parseInt(colorStr.slice(4, 6), 16);
      return [r, g, b];
    }
  }, {
    key: 'dropPrefix',
    value: function dropPrefix(colorStr) {
      return colorStr.replace('#', '');
    }
  }, {
    key: 'rrggbbToHsl',
    value: function rrggbbToHsl(rrggbb) {
      var rgb = this.toNum3(rrggbb);
      var hsl = this.rgbToHsl.apply(0, rgb);
      return [hsl[0].toFixed(0), (hsl[1] * 100).toFixed(3) + '%', (hsl[2] * 100).toFixed(3) + '%'].join(',');
    }
  }, {
    key: 'rgbToHsl',
    value: function rgbToHsl(r, g, b) {
      var r_r = r / 255,
          r_g = g / 255,
          r_b = b / 255;

      var max = Math.max(r_r, r_g, r_b),
          min = Math.min(r_r, r_g, r_b);
      var delta = max - min,
          l = (max + min) / 2;
      var h = 0,
          s = 0;
      if (Math.abs(delta) > 0.00001) {
        if (l <= 0.5) s = delta / (max + min);else s = delta / (2 - max - min);
        var r_dist = (max - r_r) / delta,
            g_dist = (max - r_g) / delta,
            b_dist = (max - r_b) / delta;
        if (r_r == max) h = b_dist - g_dist;else if (r_g == max) h = 2 + r_dist - b_dist;else h = 4 + g_dist - r_dist;
        h = h * 60;
        if (h < 0) h += 360;
      }
      return [h, s, l];
    }
  }]);
  return ColorUtils;
}();

exports['default'] = new ColorUtils();