Smaller dialog option, clickable input element, not keyboard friendly

[GoogleCodeExporter]

There doesn't appear to be a way to set an option to turn off the right-half of 
the dialog.  I don't need the color palette or OK/Cancel buttons.  Live 
updating is sufficient for my needs - that is, a quick color picker that looks 
good and I'm a big fan of the Photoshop color picker.

An option to remove those features would reduce the dialog width by 
approximately 120 pixels.

Also should have an option to specify a "fixed" mode.  So if I only want to 
allow users to see the "H" mode (Hue), I'd specify "fixed : 'H'" and then the 
radio buttons could be removed.  The dialog could then shrink another 12 to 16 
pixels.

A smaller dialog might also help to reduce the lag I'm seeing in all browsers.  
Compare the speed of jpicker to:

http://acko.net/dev/farbtastic

Would be nice to see the performance of that jQuery-based color picker merged 
with the design of jpicker with options to not have a gigantic dialog.  But it 
simply may not be possible.

Other issues:

The icon with the active color next to the examples on the homepage is also 
rather large and kind of ugly.  The fancy icon isn't really needed - just a 
clickable element ('span' or 'a') that contains the active color.  I also don't 
necessarily want the background and text colors of the element to change from 
the system default.

Clicking a bound 'input' element should open the dialog as well by default.  
Most color pickers seem to do this.

Clicking elsewhere on the page should hide the dialog.

Also jpicker is not keyboard friendly (i.e. not accessible).  Up/down arrows in 
the various fields of the dialog should affect the value of the field and 
update the display - currently nothing happens.  Opening the dialog should gain 
keyboard focus.  Pressing ESC should close the dialog and return keyboard focus 
to the input field, undoing any changes caused by user input.  Pressing Enter 
should select the active color and finalize the changes.

Hopefully this doesn't come across as complaining.  This is a pretty great 
piece of software.  I'm merely pointing out areas worth improving.

Original issue reported on code.google.com by bob.patt...@gmail.com on 27 Oct 2010 at 7:18

[GoogleCodeExporter]

"I also don't necessarily want the background and text colors of the element to 
change from the system default."

Whoops.  I missed the 'updateInputColor' option.

Original comment by bob.patt...@gmail.com on 27 Oct 2010 at 7:23

[GoogleCodeExporter]

The reason I'm looking at jQuery color pickers is because I was using 
mooRainbow and was looking for something equivalent for jQuery:

http://moorainbow.woolly-sheep.net/#demos

mooRainbow performs very well (seems even faster than farbtastic) and is just 
about perfect but is unfortunately based on MooTools, which doesn't usually 
play nice with jQuery.  I would much rather a 100% jQuery solution.

I looked into the icon issue a bit more with Firebug.  The icons appear out of 
line with the 'input' elements on the example page - icons are about 5px too 
low and need about 1px of space to the left of the icon.  It has something to 
do with using 'position: relative' with 'display: inline-block'.  CSS really 
doesn't make it easy to position elements precisely relative to other elements.

Original comment by bob.patt...@gmail.com on 28 Oct 2010 at 12:08

[GoogleCodeExporter]

Found another issue.  The CSS should have:

.jPicker td {
  margin: 0px;
  padding: 0px;
}

Original comment by bob.patt...@gmail.com on 29 Oct 2010 at 9:58

[GoogleCodeExporter]

I just uploaded V1.1.6 which fixes a couple bugs and implements PART of the 
requests in this issue report, most notably arrow key adjustment of the 
currently focused input element. Some of the other suggestions in this issue 
will find their way into a future release at some point.

Original comment by christop...@gmail.com on 17 Dec 2010 at 9:33

• Changed state: Started
• Added labels: Type-Enhancement
• Removed labels: Type-Defect