Automattic / Iris

A(n awesome) Color Picker

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

HSL

trinzia opened this issue · comments

Hi,
Devinsays added this colorpicker to Theme Options Framework & I'd like to use it because it's now included in Wordpress. Plus then I wouldn't have to use a fork off of Devin's code.

Can you tell me if I can retrieve HSL values, as I did with Farbtastic?
I was doing it like this: var hslcolor = $.farbtastic('#picker').hsl;

The reason why, is because I can choose a base color for my theme, and based on this, I can calculate a half dozen shades of color that are used throughout the site. I can't do that purely with CSS, because RGBA doesn't have some easy way to add lightness or change hue (that I know of).

Thanks.

Thanks.

PS - I'd love an option to also have a grayscale-only color-picker.

What you need to do is leverage the bundled Color.js library. Unfortunately I don't have documentation up for that yet, so I'll show you how.

var hex = $(el).iris('option', 'color');
var color = new Color(hex);

// if you want CSS style hsl like hsl(94, 32, 10)
var hsl = color. toCSS('hsl');
// or, if you want an HSL object like {h: 94, s: 32, l: 10}
var hsl = color.toHsl();

(Note that you can save a step and get a Color.js instance back from Iris directly by calling var hex = $(el).iris('color', true), but only as of Iris 1.0. WP 3.5 shipped with Iris 0.9.14.)

As for a greyscale-only picker, that's unlikely.

I will get it now, and I just found your documentation on Iris too. Maybe I was just brain-dead when I was looking for it. I'm looking for something like: https://github.com/harthur/color
But his script has naming conflicts and I'd rather just use yours. I can work with what's provided, thanks so much!