[wp-trac] [WordPress Trac] #21206: Replace Farbtastic color picker with ???...
WordPress Trac
wp-trac at lists.automattic.com
Fri Aug 17 15:11:00 UTC 2012
#21206: Replace Farbtastic color picker with ???...
-----------------------------------+------------------------------
Reporter: lessbloat | Owner:
Type: defect (bug) | Status: new
Priority: normal | Milestone: Awaiting Review
Component: General | Version:
Severity: normal | Resolution:
Keywords: has-patch ux-feedback |
-----------------------------------+------------------------------
Comment (by mattwiebe):
Just uploaded a patch for adding [http://automattic.github.com/Iris/ Iris]
in a nice and unified style. Patch only addresses the Custom Background
screen for now, but should be pretty easy to port to anywhere else that
uses a color picker, as it now is a single JS widget. This also addresses
#19616 while we're at it.
Notes:
* Introduces a `wpColorPicker` jQuery method that will contruct a standard
widget on top of any `input` field
* This will allow us to seamlessly swap out Iris for another color picker
in the future should that be desirable
* Takes a progressive enhancement approach - unsupported browsers (IE < 8)
will still have a perfectly usable text input
* Does not remove Farbtastic to maintain back compat for other
plugins/themes that use it.
`wpColorPicker` supports two callbacks, which are used like this on the
Custom Backgrounds page:
{{{
$('#background-color').wpColorPicker({
change: function( event, ui ) {
$("#custom-background-image").css('background-color',
ui.color.toString());
},
clear: function() {
$("#custom-background-image").css('background-color', '');
}
});
}}}
Closed state (default):
[[Image(http://cl.ly/image/2r3x0H1g0K30/content)]]
Open state:
[[Image(http://cl.ly/image/0B00283G0d3o/content)]]
UI notes:
* This is follows pretty closely on the Customizer's color picker UI
* the "Clear" button will change to a "Default" button when there's a
default color
* A default color can be passed directly on the `wpColorPicker` method, or
picked up directly from a `data-default-color` attribute on the `input`
element
--
Ticket URL: <http://core.trac.wordpress.org/ticket/21206#comment:12>
WordPress Trac <http://core.trac.wordpress.org/>
WordPress blogging software
More information about the wp-trac
mailing list