Upgrade to ExtJS 3.3.0 - Released 10/06/2010
[extjs.git] / examples / docs / source / RangeMenu.html
diff --git a/examples/docs/source/RangeMenu.html b/examples/docs/source/RangeMenu.html
new file mode 100644 (file)
index 0000000..3a40615
--- /dev/null
@@ -0,0 +1,139 @@
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />    
+  <title>The source code</title>
+    <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
+    <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
+</head>
+<body  onload="prettyPrint();">
+    <pre class="prettyprint lang-js">/*!
+ * Ext JS Library 3.3.0
+ * Copyright(c) 2006-2010 Ext JS, Inc.
+ * licensing@extjs.com
+ * http://www.extjs.com/license
+ */
+Ext.ns('Ext.ux.menu');
+
+<div id="cls-Ext.ux.menu.RangeMenu"></div>/** 
+ * @class Ext.ux.menu.RangeMenu
+ * @extends Ext.menu.Menu
+ * Custom implementation of Ext.menu.Menu that has preconfigured
+ * items for gt, lt, eq.
+ * <p><b><u>Example Usage:</u></b></p>
+ * <pre><code>    
+
+ * </code></pre> 
+ */
+Ext.ux.menu.RangeMenu = Ext.extend(Ext.menu.Menu, {
+
+    constructor : function (config) {
+
+        Ext.ux.menu.RangeMenu.superclass.constructor.call(this, config);
+
+        this.addEvents(
+            <div id="event-Ext.ux.menu.RangeMenu-update"></div>/**
+             * @event update
+             * Fires when a filter configuration has changed
+             * @param {Ext.ux.grid.filter.Filter} this The filter object.
+             */
+            'update'
+        );
+      
+        this.updateTask = new Ext.util.DelayedTask(this.fireUpdate, this);
+    
+        var i, len, item, cfg, Cls;
+
+        for (i = 0, len = this.menuItems.length; i < len; i++) {
+            item = this.menuItems[i];
+            if (item !== '-') {
+                // defaults
+                cfg = {
+                    itemId: 'range-' + item,
+                    enableKeyEvents: true,
+                    iconCls: this.iconCls[item] || 'no-icon',
+                    listeners: {
+                        scope: this,
+                        keyup: this.onInputKeyUp
+                    }
+                };
+                Ext.apply(
+                    cfg,
+                    // custom configs
+                    Ext.applyIf(this.fields[item] || {}, this.fieldCfg[item]),
+                    // configurable defaults
+                    this.menuItemCfgs
+                );
+                Cls = cfg.fieldCls || this.fieldCls;
+                item = this.fields[item] = new Cls(cfg);
+            }
+            this.add(item);
+        }
+    },
+
+    /**
+     * @private
+     * called by this.updateTask
+     */
+    fireUpdate : function () {
+        this.fireEvent('update', this);
+    },
+    
+    <div id="method-Ext.ux.menu.RangeMenu-getValue"></div>/**
+     * Get and return the value of the filter.
+     * @return {String} The value of this filter
+     */
+    getValue : function () {
+        var result = {}, key, field;
+        for (key in this.fields) {
+            field = this.fields[key];
+            if (field.isValid() && String(field.getValue()).length > 0) {
+                result[key] = field.getValue();
+            }
+        }
+        return result;
+    },
+  
+    <div id="method-Ext.ux.menu.RangeMenu-setValue"></div>/**
+     * Set the value of this menu and fires the 'update' event.
+     * @param {Object} data The data to assign to this menu
+     */        
+    setValue : function (data) {
+        var key;
+        for (key in this.fields) {
+            this.fields[key].setValue(data[key] !== undefined ? data[key] : '');
+        }
+        this.fireEvent('update', this);
+    },
+
+    /**  
+     * @private
+     * Handler method called when there is a keyup event on an input
+     * item of this menu.
+     */
+    onInputKeyUp : function (field, e) {
+        var k = e.getKey();
+        if (k == e.RETURN && field.isValid()) {
+            e.stopEvent();
+            this.hide(true);
+            return;
+        }
+        
+        if (field == this.fields.eq) {
+            if (this.fields.gt) {
+                this.fields.gt.setValue(null);
+            }
+            if (this.fields.lt) {
+                this.fields.lt.setValue(null);
+            }
+        }
+        else {
+            this.fields.eq.setValue(null);
+        }
+        
+        // restart the timer
+        this.updateTask.delay(this.updateBuffer);
+    }
+});
+</pre>    
+</body>
+</html>
\ No newline at end of file