webtask-color-describe

task.js

var TinyColor = require('tinycolor2');

var NEUTRALS = [
  ['BLACK', 'black', -0.01, .11],
  ['NEARBLACK', 'near black', .11, .2],
  ['GREY', 'grey', 0.2, 0.95],
  ['NEARWHITE', 'near white', 0.95, .99],
  ['WHITE', 'white', .99, 1]
];

var COLORS = [
  ['REDSTART', 'red', 0, 15],
  ['ORANGE', 'orange', 15, 45],
  ['YELLOW', 'yellow', 45, 75],
  ['LIME', 'lime', 75, 105],
  ['GREEN', 'green', 105, 135],
  ['TURQUOISE', 'turquoise', 135, 165],
  ['CYAN', 'cyan', 165, 195],
  ['COBALT', 'cobalt', 195, 225],
  ['BLUE', 'blue', 225, 255],
  ['VIOLET', 'violet', 255, 285],
  ['MAGENTA', 'magenta', 285, 315],
  ['CRIMSON', 'crimson', 315, 345],
  ['REDEND', 'red', 345, 360]
];

var SATURATION = [
  ['NEUTRAL', '', -.01, .1],
  ['DESATURATED', 'desaturated', .1, .2],
  ['MUTED', 'muted', .2, .4],
  ['PALE', 'pale', .4, .5],
  ['SOFT', 'soft', .5, .7],
  ['STRONG', 'strong', .7, .9],
  ['SATURATED', 'saturated', .9, .93],
  ['NEARPURE', 'near pure', .93, .97],
  ['PURE', 'pure', .97, 1]
];

var LUMINOSITY = [
  ['VERYDARK', 'very dark', -0.01, .15],
  ['DARK', 'dark', .15, .25],
  ['MEDIUMDARK', 'medium-dark', .25, .45],
  ['MEDIUM', 'medium', .45, .65],
  ['MEDIUMLIGHT', 'medium-light', .65, .75],
  ['LIGHT', 'light', .75, .85],
  ['VERYLIGHT', 'very light', .85, 1],
];

var OPACITY = [
  ['OPAQUE', 'see-through (or fully opaque)', -.01, .1],
  ['VERY', 'very opaque', .1, .2],
  ['SOMEWHAT', 'somewhat opaque', .2, .8],
  ['LITTLE', 'little opaque', .8, .99],
  ['SOLID', '', .99, 1],
];

function build(ranges, range) {
  ranges[range[0]] = { 
    value: range[1], 
    min: range[2], 
    max: range[3] 
  };
  return ranges;
}

var NEUTRAL_RANGES = NEUTRALS.reduce(build, {});
var COLOR_RANGES = COLORS.reduce(build, {});
var SATURATION_RANGES = SATURATION.reduce(build, {});
var LUMINOSITY_RANGES = LUMINOSITY.reduce(build, {});
var OPACITY_RANGES = OPACITY.reduce(build, {});

function getKey(value, ranges) {
  return Object.keys(ranges).find(function (key) {
    return value > ranges[key].min && value <= ranges[key].max;
  });
}

function Color (input) {
  this.color = input.toHsl(); // input should be a tinycolor instance
  this.isNeutral = this.color.h === 0;
  if (this.isNeutral) {
    this.hue = NEUTRAL_RANGES[getKey(this.color.l, NEUTRAL_RANGES)].value;
  } else {
    this.hue = COLOR_RANGES[getKey(this.color.h, COLOR_RANGES)].value;
  }
  this.saturation = SATURATION_RANGES[getKey(this.color.s, SATURATION_RANGES)].value;
  this.luminosity = LUMINOSITY_RANGES[getKey(this.color.l, LUMINOSITY_RANGES)].value;
  this.opacity = OPACITY_RANGES[getKey(this.color.a, OPACITY_RANGES)].value;
  this.isValid = input instanceof TinyColor && input.isValid() !== undefined ? input.isValid() : false;
}

Color.prototype.getDescription = function () {
  var output = '';
  if (this.isNeutral) output = this.luminosity + ' ' + this.hue;
  else output = this.luminosity + ', ' + this.saturation + ' ' + this.hue;
  if (this.opacity && this.opacity.length) output += '; ' + this.opacity;

  return output;
};

module.exports = function(context, cb) {
  var tinycolor = new TinyColor(context.body.color);
  var color = new Color(tinycolor);
  
  if (!color.isValid) {
    return cb(null, 'Not a valid color!');
  }
  
  function format(input, description) {
    return 'The color, \'' + input + '\', is a ' + description + '.';
  }

  const output = format(tinycolor.getOriginalInput(), color.getDescription());

  cb(null, output);
};