source: admin/js/color-picker.js @ 0:54703be25dd6

$(function() {
     $('.colorpicker').colorPicker();
});

jQuery.fn.colorPicker = function() {
     $(this).each(function() {
          var colbox, f;
          var colbox = $('#jquery-colorpicker')[0];
          
          if (colbox == undefined) {
               colbox = document.createElement('div');
               colbox.id = 'jquery-colorpicker';
               colbox.linkedto = null;
               
               $(colbox).css({border: '1px solid #000', width: '195px', background: '#fff', position: 'absolute'});
               $(colbox).css({display: 'none'});
               $('body').append(colbox);
          }
          f = $.farbtastic(colbox);
          f.linkTo(this);
          
          var handler = $(document.createElement('img'));
          handler.attr('src','images/picker.png');
          handler.attr('alt','');
          
          var span = $(document.createElement('span'));
          
          if ($(this).css('position') == 'absolute') {
               span.css('position','absolute');
               span.css('top',$(this).css('top'));
               span.css('left',$(this).css('left'));
               $(this).css('position','static');
          } else {
               span.css('position','relative');
          }
          span.css('display','block');
          
          span.css('width',($(this).width()+12)+'px');
          span.css('padding','0 5px 0 0');
          $(this).wrap(span);
          $(this).after(handler);
          
          var offset = $(this).offset();
          handler.css({
               position: 'absolute',
               top: 3,
               right: 0
          });
          
          handler.css({cursor: 'default'});
          
          var This = this;
          handler.click(function() {
               if ($(colbox).css('display') == 'none' || this != colbox.linkedto) {
                    f.linkTo(This);
                    This.focus();
                    var offset = $(This).offset();
                    $(colbox).css({
                         zIndex: 1000,
                         top: offset.top + $(this).height() + 5,
                         left: offset.left
                    });
                    if (document.all) { $('select').hide(); }
                    $(colbox).show();
                    colbox.linkedto = this;
                    
               } else {
                    $(colbox).hide();
                    if (document.all) { $('select').show(); }
                    colbox.linkedto = null;
               }
          });
          $(this).blur(function() {
               $(colbox).hide();
               if (document.all) { $('select').show(); }
          });
     });
     return this;
};