color_field_widget_box.js 2.1 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374
  1. /**
  2. * Color Field jQuery
  3. */
  4. (function ($) {
  5. jQuery.fn.addColorPicker = function (props) {
  6. if (!props) { props = []; }
  7. props = jQuery.extend({
  8. currentColor:'',
  9. blotchElemType: 'span',
  10. blotchClass:'colorBox',
  11. blotchTransparentClass:'transparentBox',
  12. clickCallback: function(ignoredColor) {},
  13. iterationCallback: null,
  14. fillString: ' ',
  15. fillStringX: '?',
  16. colors: [
  17. '#AC725E','#D06B64','#F83A22', '#FA573C', '#FF7537', '#FFAD46',
  18. '#42D692','#16A765', '#7BD148','#B3DC6C','#FBE983',
  19. '#92E1C0', '#9FE1E7', '#9FC6E7', '#4986E7','#9A9CFF',
  20. '#B99AFF','#C2C2C2','#CABDBF','#CCA6AC','#F691B2',
  21. '#CD74E6','#A47AE2',
  22. ]
  23. }, props);
  24. var count = props.colors.length;
  25. for (var i = 0; i < count; ++i) {
  26. var color = props.colors[i];
  27. var elem = jQuery('<' + props.blotchElemType + '/>')
  28. .addClass(props.blotchClass)
  29. .attr('color',color)
  30. .css('background-color',color);
  31. // jq bug: chaining here fails if color is null b/c .css() returns (new String('transparent'))!
  32. if (props.currentColor == color) {
  33. elem.addClass('active');
  34. }
  35. if (props.clickCallback) {
  36. elem.click(function() {
  37. jQuery(this).parent().children('.' + props.blotchClass).removeClass('active');
  38. jQuery(this).addClass('active');
  39. props.clickCallback(jQuery(this).attr('color'));
  40. });
  41. }
  42. this.append(elem);
  43. if (props.iterationCallback) {
  44. props.iterationCallback(this, elem, color, i);
  45. }
  46. }
  47. var elem = jQuery('<' + props.blotchElemType + '/>')
  48. .addClass(props.blotchTransparentClass)
  49. .attr('color', '')
  50. .css('background-color', '');
  51. if (props.currentColor == '') {
  52. elem.addClass('active');
  53. }
  54. if (props.clickCallback) {
  55. elem.click(function() {
  56. jQuery(this).parent().children('.' + props.blotchClass).removeClass('active');
  57. jQuery(this).addClass('active');
  58. props.clickCallback(jQuery(this).attr('color'));
  59. });
  60. }
  61. this.append(elem);
  62. if (props.iterationCallback) {
  63. props.iterationCallback(this, elem, color, i);
  64. }
  65. return this;
  66. };
  67. })(jQuery);