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