spectrum icon indicating copy to clipboard operation
spectrum copied to clipboard

Allow palette colors to be custom named

Open censys-git opened this issue 12 years ago • 4 comments

First, this is such a great plug-in. I am trying it out in a possible web application that requires a lot of color field setup and this makes it error proof.

One feature request that would be extremely valuable is the ability to custom name each of the colors in a palette list applied to the picker. The use-case is that we allow a developer to set up their own palette and to name each color (such as "logo color", "header color", etc) and then proceed to apply this palette to the pickers. Right now when you mouse over the color palette you get the current preferred format value. Would be great to allow a paletteAlt option that would use the alternate custom names if not empty, otherwise the preferred format value. Some of the colors are slight variations of the same base and hard to distinguish by the value itself. This would help identify what you are picking.

censys-git avatar Apr 20 '14 00:04 censys-git

Back in #195 I considered adding a callback for getting the tooltip text, but we ended up using the preferred format instead because it was a simpler change. A new option may work for your use case - if a callback got fired and you could look up / return the text you want. It could maybe look something like:

paletteTooltipText: function(c) {
  // Look up color and get label from some other object
  return myLabels[c.toHexString()];
}

This way your code would manage this lookup using whatever logic you want. Do you think this would work?

bgrins avatar Apr 20 '14 18:04 bgrins

Hi,

I believe it would work. I could map the actual color, but is it possible to get the index in the array of the specific palette callback? That way I can simply setup a mapped array equal to that of the palette. Something like:

var palette = ['#000000', '#ffffff', 'red', ...];

var map = ['Base Text Color','Body Background', 'Error', ...];

paletteTooltipText: function(c,index) {

// Look up color and get label from some other object

return map[index];

}

Either way works however.

Best.

-Steve

From: Brian Grinstead [mailto:[email protected]] Sent: Sunday, April 20, 2014 2:14 PM To: bgrins/spectrum Cc: sl1331 Subject: Re: [spectrum] Allow palette colors to be custom named (#211)

Back in #195 https://github.com/bgrins/spectrum/issues/195 I considered adding a callback for getting the tooltip text, but we ended up using the preferred format instead because it was a simpler change. A new option may work for your use case - if a callback got fired and you could look up / return the text you want. It could maybe look something like:

paletteTooltipText: function(c) { // Look up color and get label from some other object return myLabels[c.toHexString()]; }

This way your code would manage this lookup using whatever logic you want. Do you think this would work?

— Reply to this email directly or view it on GitHub https://github.com/bgrins/spectrum/issues/211#issuecomment-40901036 . https://github.com/notifications/beacon/5711310__eyJzY29wZSI6Ik5ld3NpZXM6QmVhY29uIiwiZXhwaXJlcyI6MTcxMzYzNjgzNSwiZGF0YSI6eyJpZCI6MzAzODg4OTl9fQ==--5853952c0c7088fa62034fb19867c4fe83019702.gif

censys-git avatar Apr 21 '14 02:04 censys-git

:+1: for the paletteTooltipText function. Needed this in a project today.

mvarrieur avatar Apr 16 '15 19:04 mvarrieur

Any news? the paletteTooltipText function can help to show transparent color in rgba. Thanks

DoonPort0422 avatar Mar 18 '21 06:03 DoonPort0422