Set max opacity for default null color when opening Pickr popup

[mloureiro]

Question

Is it possible to change the initial color on the picker window (only) when the default color is null?

Basically the initial color is none (null) till user chooses to pick a color, and with options.default = null when user opens the pop up opacity is 0, since the most common use case if full opaque colors, it means the user will always have to set the opacity to max first.

What I would like to do is to keep null as the current color, but when open the window width a different color.

---

I've dove into the code but there are some concepts I can't get my head around. Like, why isn't _color always the current color 🤔. For instance, on show event, the color from instance._color is black, even though the options.default is null, and instance._lastColor is indeed null.

I did try to instance.setColor() on show event but it hides the popup, plus this wouldn't keep the null state in case user doesn't pick a new color.

The only solution I can think of, is to create my own button (by using useAsButton), although this would mean that I would have to deal with the colors and the opacity (the same way Pickr does) on my own 🙃

Environment:

Version (see Pickr.version): 1.7.4
Used bundle (es5 or normal one): normal (`pickr.min.js`)
Used theme (default is classic): nano
Browser-version:  Firefox 84.0b3, Chrome 86.0.4240.198 (this shouldn't affect in this case)
Operating-system:  OSX 10.15.7

[simonwep]

I've dove into the code but there are some concepts I can't get my head around. Like, why isn't _color always the current color 🤔. For instance, on show event, the color from instance._color is black, even though the options.default is null, and instance._lastColor is indeed null.

See #178, explained here. Basically it is impossible to not have a default-color. Maybe this also helps with your initial question, this whole null-as-default is complicated, but you can use pickr.getSelectedColor() the get the last color which is null if the user hasn't changed the color yet.

This was also heavily discussed in #118.

I did try to instance.setColor() on show event but it hides the popup, plus this wouldn't keep the null state in case user doesn't pick a new color.

See answer above, it should be possible to set the color on show: https://jsfiddle.net/o9x1L68n/

[mloureiro]

Thanks @Simonwep for the quick reply.

it should be possible to set the color on show: https://jsfiddle.net/o9x1L68n/

For some reason that didn't work for me, but it clearly works 🙃 , I'll debug to understand my issue.

Since, I can get around with a mix of magic with show/hide events, I'll close this. Thanks again!