The position of the circle in the top rectangular area does not change when you alter the values of the RGB form controls

[alexjlockwood]

When you change the value of one of the 3 RGB text fields, the background color of the color picker changes. However, the draggable circle in that top rectangular area of the color picker does not change its position to match the new color.

[motabass]

This is also true for the base-color picker at the right (and maybe also alpha-picker?). The picker areas never get update by input (R,G,B and Hex) value changes and also not when opening up with a color pre-set.

Enabling this would really increase the usability. It may involve some calculations though to get the X and X Position from the colors RGB values. Having a fixed px size for the selection areas, like it is right now, it should be not too hard to implement.

One could argue that this is more a Feature than a Bug.

[motabass]

Setting the alpha slider from values 0 - 1 shold be the simplest task.

pseudo-code:
y = blockHeigth - blockHeigth - blockHeight * Alpha

To set the hue/base-color-slider one could convert the RGB to HSL and use the H-value going from 0 - 360 to set the position.

pseudo-code:
y = blockHeight / 360 * HValue

The x and y for the selector-block may be derived from the S- and L-values

pseudo-code:
x = blockWidth / 100 * SValue (%) y = blockHeigth - blockHeigth / 100 * LValue

i think that would be it.

[motabass]

I also found a nice resource for how to convert eg. RGB to HSL

https://css-tricks.com/converting-color-spaces-in-javascript/

[motabass]

I already got it to work. I just had to change the gradients on the selection block a little bit to fit S and L values.

I would really consider pulling in https://www.npmjs.com/package/tinycolor2 and using it's color class to keep the current color. It supports parsing all kinds of color strings as well as converting them.

I think many feature implementations could very much profit of the convenience it offers.

@tiaguinho what do you think?

[motabass]

fixed by f40ef3f in #142