X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/25ef3491bd9ae007ff1fc2b0d7943e6eaaccf775..c8256059947f3aa8f5b0a9a2acf55e2142bb4742:/docs/source/ColorPalette.html diff --git a/docs/source/ColorPalette.html b/docs/source/ColorPalette.html index 29187d39..cf00b139 100644 --- a/docs/source/ColorPalette.html +++ b/docs/source/ColorPalette.html @@ -1,13 +1,14 @@
+/*! - * Ext JS Library 3.0.3 - * Copyright(c) 2006-2009 Ext JS, LLC + * Ext JS Library 3.2.1 + * Copyright(c) 2006-2010 Ext JS, Inc. * licensing@extjs.com * http://www.extjs.com/license */ @@ -29,23 +30,7 @@ cp.on('select', function(palette, selColor){ * @param {Object} config The config object * @xtype colorpalette */ -Ext.ColorPalette = function(config){ - Ext.ColorPalette.superclass.constructor.call(this, config); - this.addEvents( - /** - * @event select - * Fires when a color is selected - * @param {ColorPalette} this - * @param {String} color The 6-digit color hex code (without the # symbol) - */ - 'select' - ); - - if(this.handler){ - this.on('select', this.handler, this.scope, true); - } -}; -Ext.extend(Ext.ColorPalette, Ext.Component, { +Ext.ColorPalette = Ext.extend(Ext.Component, { /** * @cfg {String} tpl An existing XTemplate instance to be used in place of the default template for rendering the component. */ @@ -60,6 +45,11 @@ Ext.extend(Ext.ColorPalette, Ext.Component, { * the hex codes are case-sensitive. */ value : null, + /** + * @cfg {String} clickEvent + * The DOM event that will cause a color to be selected. This can be any valid event name (dblclick, contextmenu). + * Defaults to 'click'. + */ clickEvent :'click', // private ctype : 'Ext.ColorPalette', @@ -108,18 +98,36 @@ cp.colors = ['000000', '993300', '333300']; * The scope (this reference) in which the+Ext.reg('colorpalette', Ext.ColorPalette); \ No newline at end of file{@link #handler}
* function will be called. Defaults to this ColorPalette instance. */ + + // private + initComponent : function(){ + Ext.ColorPalette.superclass.initComponent.call(this); + this.addEvents( + /** + * @event select + * Fires when a color is selected + * @param {ColorPalette} this + * @param {String} color The 6-digit color hex code (without the # symbol) + */ + 'select' + ); + + if(this.handler){ + this.on('select', this.handler, this.scope, true); + } + }, // private onRender : function(container, position){ + this.autoEl = { + tag: 'div', + cls: this.itemCls + }; + Ext.ColorPalette.superclass.onRender.call(this, container, position); var t = this.tpl || new Ext.XTemplate( '' ); - var el = document.createElement('div'); - el.id = this.getId(); - el.className = this.itemCls; - t.overwrite(el, this.colors); - container.dom.insertBefore(el, position); - this.el = Ext.get(el); + t.overwrite(this.el, this.colors); this.mon(this.el, this.clickEvent, this.handleClick, this, {delegate: 'a'}); if(this.clickEvent != 'click'){ this.mon(this.el, 'click', Ext.emptyFn, this, {delegate: 'a', preventDefault: true}); @@ -132,7 +140,7 @@ cp.colors = ['000000', '993300', '333300']; if(this.value){ var s = this.value; this.value = null; - this.select(s); + this.select(s, true); } }, @@ -148,8 +156,9 @@ cp.colors = ['000000', '993300', '333300']; /** * Selects the specified color in the palette (fires the {@link #select} event) * @param {String} color A valid 6-digit color hex code (# will be stripped if included) + * @param {Boolean} suppressEvent (optional) True to stop the select event from firing. Defaults to false. */ - select : function(color){ + select : function(color, suppressEvent){ color = color.replace('#', ''); if(color != this.value || this.allowReselect){ var el = this.el; @@ -158,7 +167,9 @@ cp.colors = ['000000', '993300', '333300']; } el.child('a.color-'+color).addClass('x-color-palette-sel'); this.value = color; - this.fireEvent('select', this, color); + if(suppressEvent !== true){ + this.fireEvent('select', this, color); + } } } @@ -166,7 +177,6 @@ cp.colors = ['000000', '993300', '333300']; * @cfg {String} autoEl @hide */ }); -Ext.reg('colorpalette', Ext.ColorPalette); -