Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Validate your input ranges and throw errors #3

Open
caillou opened this issue Sep 23, 2021 · 2 comments
Open

Validate your input ranges and throw errors #3

caillou opened this issue Sep 23, 2021 · 2 comments

Comments

@caillou
Copy link

caillou commented Sep 23, 2021

For example:

type HSX = [number, number, number];

/**
 * function hsv2hsl
 * @param h {Number} hue value 0...360
 * @param s {Number} saturation 0...1
 * @param v {Number} value 0...1
 * @returns {Array} h:0...360 s:0...1 l:0...1
 */
export const hsv2hsl = (
  h: number,
  s: number,
  v: number,
  l: number = v - (v * s) / 2,
  m = Math.min(l, 1 - l)
): HSX => {
  if (h < 0 || h > 360) {
    throw new Error(
      `hsv2hsl() hue parameter is expected to be a number between 0 and 360, \`${h}\` given.`
    );
  }
  // ...
  return [h, m ? (v - l) / m : 0, l];
};
@meodai
Copy link
Owner

meodai commented Sep 25, 2021

i might do that for the HSV2HSL function but the main one does not really have max and min's. But it might be practical to do something like that: https://github.com/bit101/quicksettings

export const optionsAndRanges = {
  curveMethod: [
    'lamé', 'arc', 'pow', 'powY', 'powX'
  ],
  curveAccent: {
    min: -0.095, max: 1, step: 0.001
  },
  colors: {
    min: 3, max: 35, step: 1
  },
  centerHue: {
    min: 0, max: 360, step: 0.1
  },
  hueCycle: {
    min: 0, max: 1.5, step: 0.001
  },
  offsetTint: {
    min: 0, max: 0.4, step: 0.001
  },
  offsetShade: {
    min: 0, max: 0.4, step: 0.001
  },
  offsetCurveModTint: {
    min: 0, max: 0.4, step: 0.0001
  },
  offsetCurveModShade: {
    min: 0, max: 0.4, step: 0.0001
  },
  tintShadeHueShift: {
    min: 0, max: 1, step: 0.001
  },
  minSaturation: {
    min: 0, max: 1, step: 0.001
  },
  minLight: {
    min: 0, max: 1, step: 0.001
  },
  maxSaturation: {
    min: 0, max: 1, step: 0.001
  },
  maxLight: {
    min: 0, max: 1, step: 0.001
  },
};

It would be easy to import to use with a settings panel like in the demo or something like

meodai added a commit that referenced this issue Sep 26, 2021
@meodai
Copy link
Owner

meodai commented Sep 26, 2021

@caillou https://github.com/meodai/fettepalette#saint-options

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants