1 | /*! |
---|
2 | * Ext JS Library 3.4.0 |
---|
3 | * Copyright(c) 2006-2011 Sencha Inc. |
---|
4 | * licensing@sencha.com |
---|
5 | * http://www.sencha.com/license |
---|
6 | */ |
---|
7 | /** |
---|
8 | * @class Ext.menu.ColorMenu |
---|
9 | * @extends Ext.menu.Menu |
---|
10 | * <p>A menu containing a {@link Ext.ColorPalette} Component.</p> |
---|
11 | * <p>Notes:</p><div class="mdetail-params"><ul> |
---|
12 | * <li>Although not listed here, the <b>constructor</b> for this class |
---|
13 | * accepts all of the configuration options of <b>{@link Ext.ColorPalette}</b>.</li> |
---|
14 | * <li>If subclassing ColorMenu, any configuration options for the ColorPalette must be |
---|
15 | * applied to the <tt><b>initialConfig</b></tt> property of the ColorMenu. |
---|
16 | * Applying {@link Ext.ColorPalette ColorPalette} configuration settings to |
---|
17 | * <b><tt>this</tt></b> will <b>not</b> affect the ColorPalette's configuration.</li> |
---|
18 | * </ul></div> * |
---|
19 | * @xtype colormenu |
---|
20 | */ |
---|
21 | Ext.menu.ColorMenu = Ext.extend(Ext.menu.Menu, { |
---|
22 | /** |
---|
23 | * @cfg {Boolean} enableScrolling |
---|
24 | * @hide |
---|
25 | */ |
---|
26 | enableScrolling : false, |
---|
27 | /** |
---|
28 | * @cfg {Function} handler |
---|
29 | * Optional. A function that will handle the select event of this menu. |
---|
30 | * The handler is passed the following parameters:<div class="mdetail-params"><ul> |
---|
31 | * <li><code>palette</code> : ColorPalette<div class="sub-desc">The {@link #palette Ext.ColorPalette}.</div></li> |
---|
32 | * <li><code>color</code> : String<div class="sub-desc">The 6-digit color hex code (without the # symbol).</div></li> |
---|
33 | * </ul></div> |
---|
34 | */ |
---|
35 | /** |
---|
36 | * @cfg {Object} scope |
---|
37 | * The scope (<tt><b>this</b></tt> reference) in which the <code>{@link #handler}</code> |
---|
38 | * function will be called. Defaults to this ColorMenu instance. |
---|
39 | */ |
---|
40 | |
---|
41 | /** |
---|
42 | * @cfg {Boolean} hideOnClick |
---|
43 | * False to continue showing the menu after a color is selected, defaults to true. |
---|
44 | */ |
---|
45 | hideOnClick : true, |
---|
46 | |
---|
47 | cls : 'x-color-menu', |
---|
48 | |
---|
49 | /** |
---|
50 | * @cfg {String} paletteId |
---|
51 | * An id to assign to the underlying color palette. Defaults to <tt>null</tt>. |
---|
52 | */ |
---|
53 | paletteId : null, |
---|
54 | |
---|
55 | /** |
---|
56 | * @cfg {Number} maxHeight |
---|
57 | * @hide |
---|
58 | */ |
---|
59 | /** |
---|
60 | * @cfg {Number} scrollIncrement |
---|
61 | * @hide |
---|
62 | */ |
---|
63 | /** |
---|
64 | * @property palette |
---|
65 | * @type ColorPalette |
---|
66 | * The {@link Ext.ColorPalette} instance for this ColorMenu |
---|
67 | */ |
---|
68 | |
---|
69 | |
---|
70 | /** |
---|
71 | * @event click |
---|
72 | * @hide |
---|
73 | */ |
---|
74 | |
---|
75 | /** |
---|
76 | * @event itemclick |
---|
77 | * @hide |
---|
78 | */ |
---|
79 | |
---|
80 | initComponent : function(){ |
---|
81 | Ext.apply(this, { |
---|
82 | plain: true, |
---|
83 | showSeparator: false, |
---|
84 | items: this.palette = new Ext.ColorPalette(Ext.applyIf({ |
---|
85 | id: this.paletteId |
---|
86 | }, this.initialConfig)) |
---|
87 | }); |
---|
88 | this.palette.purgeListeners(); |
---|
89 | Ext.menu.ColorMenu.superclass.initComponent.call(this); |
---|
90 | /** |
---|
91 | * @event select |
---|
92 | * Fires when a color is selected from the {@link #palette Ext.ColorPalette} |
---|
93 | * @param {Ext.ColorPalette} palette The {@link #palette Ext.ColorPalette} |
---|
94 | * @param {String} color The 6-digit color hex code (without the # symbol) |
---|
95 | */ |
---|
96 | this.relayEvents(this.palette, ['select']); |
---|
97 | this.on('select', this.menuHide, this); |
---|
98 | if(this.handler){ |
---|
99 | this.on('select', this.handler, this.scope || this); |
---|
100 | } |
---|
101 | }, |
---|
102 | |
---|
103 | menuHide : function(){ |
---|
104 | if(this.hideOnClick){ |
---|
105 | this.hide(true); |
---|
106 | } |
---|
107 | } |
---|
108 | }); |
---|
109 | Ext.reg('colormenu', Ext.menu.ColorMenu); |
---|