JAVASCRIPT   13

colorpicker.js

Guest on 25th July 2021 04:09:08 PM

  1.  
  2. // create KColorPicker class
  3. function KColorPicker(options) {
  4.         this.init(options);
  5. }
  6. _extend(KColorPicker, KWidget, {
  7.         init : function(options) {
  8.                 var self = this;
  9.                 options.z = options.z || 811213;
  10.                 KColorPicker.parent.init.call(self, options);
  11.                 var colors = options.colors || [
  12.                         ['#E53333', '#E56600', '#FF9900', '#64451D', '#DFC5A4', '#FFE500'],
  13.                         ['#009900', '#006600', '#99BB00', '#B8D100', '#60D978', '#00D5FF'],
  14.                         ['#337FE5', '#003399', '#4C33E5', '#9933E5', '#CC33E5', '#EE33EE'],
  15.                         ['#FFFFFF', '#CCCCCC', '#999999', '#666666', '#333333', '#000000']
  16.                 ];
  17.                 self.selectedColor = (options.selectedColor || '').toLowerCase();
  18.                 self._cells = [];
  19.                 self.div.addClass('ke-colorpicker').bind('click,mousedown', function(e){
  20.                         e.stopPropagation();
  21.                 }).attr('unselectable', 'on');
  22.                 var table = self.doc.createElement('table');
  23.                 self.div.append(table);
  24.                 table.className = 'ke-colorpicker-table';
  25.                 table.cellPadding = 0;
  26.                 table.cellSpacing = 0;
  27.                 table.border = 0;
  28.                 var row = table.insertRow(0), cell = row.insertCell(0);
  29.                 cell.colSpan = colors[0].length;
  30.                 self._addAttr(cell, '', 'ke-colorpicker-cell-top');
  31.                 for (var i = 0; i < colors.length; i++) {
  32.                         row = table.insertRow(i + 1);
  33.                         for (var j = 0; j < colors[i].length; j++) {
  34.                                 cell = row.insertCell(j);
  35.                                 self._addAttr(cell, colors[i][j], 'ke-colorpicker-cell');
  36.                         }
  37.                 }
  38.         },
  39.         _addAttr : function(cell, color, cls) {
  40.                 var self = this;
  41.                 cell = K(cell).addClass(cls);
  42.                 if (self.selectedColor === color.toLowerCase()) {
  43.                         cell.addClass('ke-colorpicker-cell-selected');
  44.                 }
  45.                 cell.attr('title', color || self.options.noColor);
  46.                 cell.mouseover(function(e) {
  47.                         K(this).addClass('ke-colorpicker-cell-on');
  48.                 });
  49.                 cell.mouseout(function(e) {
  50.                         K(this).removeClass('ke-colorpicker-cell-on');
  51.                 });
  52.                 cell.click(function(e) {
  53.                         e.stop();
  54.                         self.options.click.call(K(this), color);
  55.                 });
  56.                 if (color) {
  57.                         cell.append(K('<div class="ke-colorpicker-cell-color" unselectable="on"></div>').css('background-color', color));
  58.                 } else {
  59.                         cell.html(self.options.noColor);
  60.                 }
  61.                 K(cell).attr('unselectable', 'on');
  62.                 self._cells.push(cell);
  63.         },
  64.         remove : function() {
  65.                 var self = this;
  66.                 _each(self._cells, function() {
  67.                         this.unbind();
  68.                 });
  69.                 KColorPicker.parent.remove.call(self);
  70.                 return self;
  71.         }
  72. });
  73.  
  74. function _colorpicker(options) {
  75.         return new KColorPicker(options);
  76. }
  77.  
  78. K.ColorPickerClass = KColorPicker;
  79. K.colorpicker = _colorpicker;

Raw Paste


Login or Register to edit or fork this paste. It's free.