Cleanup and Linting WIP

Author: larsenwork

helpers.js

@@ -1,13 +1,13 @@
 /**
  * Require constants
  */
-const Color         = require('color');
-const round10       = require('round10').round10;
-const easeInSine    = require('eases/sine-in');
-const easeOutSine   = require('eases/sine-out');
+const Color = require('color');
+const round10 = require('round10').round10;
+const easeInSine = require('eases/sine-in');
+const easeOutSine = require('eases/sine-out');
 const easeInOutSine = require('eases/sine-in-out');
-const easeInQuad    = require('eases/quad-in');
-const easeOutQuad   = require('eases/quad-out');
+const easeInQuad = require('eases/quad-in');
+const easeOutQuad = require('eases/quad-out');
 const easeInOutQuad = require('eases/quad-in-out');
 
 /**
@@ -27,23 +27,16 @@ const scrimCoordinates = {
   0.94: '80.36%',
   0.97: '87.18%',
   0.99: '93.73%'
-}
-
-/**
- * Calculate the color stops based on start+stopColor in an array and easingType
- */
-exports.getColorStops = function(colors, easingType, delta, alphaDecimals) {
-  colors = transparentFix(colors);
-  let gradientCoordinates = getCoordinates(easingType, delta);
-  let colorStops = '';
-  for (let ammount in gradientCoordinates) {
-    let color = Color(colors[1]).mix(Color(colors[0]), ammount);
-    color = roundHslAlpha(color.hsl().string(), alphaDecimals);
-    colorStops += `, ${color} ${gradientCoordinates[ammount]}`;
-  }
-  colorStops += `, ${colors[1]} 100%`;
-  return colorStops;
 };
+const supportedGradients = [
+  'ease-in-sine-gradient',
+  'ease-out-sine-gradient',
+  'ease-in-out-sine-gradient',
+  'ease-in-quad-gradient',
+  'ease-out-quad-gradient',
+  'ease-in-out-quad-gradient',
+  'scrim-gradient'
+];
 
 /**
  * If a color is transparent then convert it to a transparent of the sibling
@@ -53,13 +46,50 @@ function transparentFix(colors) {
     ? Color(colors[Math.abs(i - 1)]).alpha(0).hsl().string()
     : color
   );
-};
+}
+
+/**
+ * Test if new coordinate is far enough away from old coordinate
+ */
+function isFarEnough(x, y, xOld, yOld, delta) {
+  return Math.sqrt(((x - xOld) ** 2) + ((y - yOld) ** 2)) > delta;
+}
+
+/**
+ * Convert decimal number to percentage string
+ */
+function getPercentage(number) {
+  return `${round10(number * 100, -1)}%`;
+}
+
+/**
+ * Easing functions switcheroo
+ */
+function ease(x, type) {
+  switch (type) {
+    case 'ease-in-sine-gradient':
+      return easeInSine(x);
+    case 'ease-out-sine-gradient':
+      return easeOutSine(x);
+    case 'ease-in-out-sine-gradient':
+      return easeInOutSine(x);
+    case 'ease-in-quad-gradient':
+      return easeInQuad(x);
+    case 'ease-out-quad-gradient':
+      return easeOutQuad(x);
+    case 'ease-in-out-quad-gradient':
+      return easeInOutQuad(x);
+    default:
+      console.log(`Sorry, easing gradient does not support ${type}.`);
+      return null;
+  }
+}
 
 /**
  * Get coordinates based on easing function.
  * Delta checks ensures there's roughly the same distance between coordinates.
  */
-function getCoordinates(easingFunction, delta) {
+function getCoordinates(easingFunction, precision) {
   if (easingFunction === 'scrim-gradient') return scrimCoordinates;
 
   const yIncrements = 0.001;
@@ -72,6 +102,7 @@ function getCoordinates(easingFunction, delta) {
   let xOld = 0;
   let yOld = 0;
   let firstTime = true;
+  let delta = precision;
 
   while (firstTime || !isFarEnough(1, 1, xOld, yOld, delta - deltaTolerance)) {
     if (firstTime) {
@@ -81,7 +112,7 @@ function getCoordinates(easingFunction, delta) {
       y = 0;
       xOld = 0;
       yOld = 0;
-      delta = delta - deltaAdjust;
+      delta -= deltaAdjust;
       coordinates = {};
     }
     while (y <= 1) {
@@ -96,61 +127,76 @@ function getCoordinates(easingFunction, delta) {
     }
   }
   return coordinates;
-};
+}
 
 /**
- * Easing functions switcheroo
+ * Round alpha in hsl colors to alphaDecimals
  */
-function ease(x, type) {
-  switch (type) {
-    case 'ease-in-sine-gradient':
-      return easeInSine(x);
-      break;
-    case 'ease-out-sine-gradient':
-      return easeOutSine(x);
-      break;
-    case 'ease-in-out-sine-gradient':
-      return easeInOutSine(x);
-      break;
-    case 'ease-in-quad-gradient':
-      return easeInQuad(x);
-      break;
-    case 'ease-out-quad-gradient':
-      return easeOutQuad(x);
-      break;
-    case 'ease-in-out-quad-gradient':
-      return easeInOutQuad(x);
-      break;
-    default:
-      console.log(`Sorry, easing gradient does not support ${type}.`);
-  }
+function roundHslAlpha(color, alphaDecimals) {
+  const prefix = color.substring(0, color.indexOf('('));
+  const values = color
+    .substring(color.indexOf('(') + 1, color.indexOf(')'))
+    .split(',')
+    .map(string => string.indexOf('%') === -1
+      ? round10(Number(string), -alphaDecimals)
+      : string.trim()
+    );
+  return `${prefix}(${values.join(', ')})`;
+}
+
+/**
+ * Calculate the color stops based on start+stopColor in an array and easingType
+ */
+exports.getColorStops = function getColorStops(
+  colors,
+  easingType,
+  delta,
+  alphaDecimals
+) {
+  const fixedColors = transparentFix(colors);
+  const gradientCoordinates = getCoordinates(easingType, delta);
+  let colorStops = '';
+  Object.keys(gradientCoordinates).forEach((ammount) => {
+    // https://github.com/Qix-/color
+    let color = Color(fixedColors[1]).mix(Color(fixedColors[0]), ammount);
+    color = color.hsl().string();
+    color = roundHslAlpha(color, alphaDecimals);
+    colorStops += `${color} ${gradientCoordinates[ammount]}, `;
+  });
+  colorStops += `${colors[1]} 100%`;
+  return colorStops;
 };
 
+
 /**
- * Convert decimal number to percentage string
+ * Check if a string matches one of the supported gradients
  */
-function getPercentage(number) {
-  return round10(number * 100, -1) + '%';
+exports.isEasingGradient = function isEasingGradient(str) {
+  return new RegExp(supportedGradients.join('|')).test(str);
 };
 
 /**
- * Test if new coordinate is far enough away from old coordinate
+ * Convert a function object to a word object
  */
-function isFarEnough(x, y, xOld, yOld, delta) {
-  return Math.sqrt((x - xOld) ** 2 + (y - yOld) ** 2) > delta;
+exports.functionToWord = function functionToWord(obj) {
+  const object = obj;
+  const array = [];
+  // TODO: Make eslint happy
+  /* eslint-disable no-restricted-syntax */
+  for (const objNode of object.nodes) {
+    if (objNode.type === 'word') {
+      array.push(objNode.value);
+    }
+  }
+  /* eslint-enable no-restricted-syntax */
+  object.value = `${obj.value}(${array.join()})`;
+  object.type = 'word';
+  return object;
 };
 
 /**
- * Round alpha in hsl colors to alphaDecimals
+ * Test if two colors are identical
  */
-function roundHslAlpha(color, alphaDecimals) {
-  let prefix = color.substring(0, color.indexOf('('));
-  let values = color
-    .substring(color.indexOf('(') + 1, color.indexOf(')'))
-    .split(',')
-    .map(string => string.indexOf('%') === -1
-      ? round10(Number(string), -alphaDecimals)
-      : string.trim()
-    );
-  return `${prefix}(${values.join(', ')})`;
+exports.isSameColor = function isSameColor(colorA, colorB) {
+  return Color(colorA).hsl().string() === Color(colorB).hsl().string();
 };