Using a color picker with WPAlchemy

color_picker

jQuery(function($){
	var picker_config = {
		onSubmit: function(hsb, hex, rgb, el) {
			$(el).val(hex);
			$(el).ColorPickerHide();
		},
		onBeforeShow: function () {
			$(this).ColorPickerSetColor(this.value);
		},
		onChange: function (hsb, hex, rgb) {
			var el = $(this).data('colorpicker').el;
			$(el).val(hex);
		}
	};
	
	var keyup_handler = function(e) {
		$(this).ColorPickerSetColor($(this).val());
	};

	// initialize all current inputs
	$('.color-picker').ColorPicker(picker_config).on('keyup', keyup_handler);

	// event fired when an element is cloned
	$.wpalchemy.on('wpa_copy', function(el){
		// initialize the new colorpicker
		$(el).ColorPicker(picker_config).on('keyup', keyup_handler);
	});
});