view release on metacpan or  search on metacpan

share/examples/image-organizer/imgorg/MultiCombo.js  view on Meta::CPAN

	/**
	 * @cfg {String} overClass [x-grid3-row-over]
	 */
	overClass : 'x-grid3-row-over',
	/**
	 * @cfg {Boolean} enableKeyEvents for typeAhead
	 */
	enableKeyEvents: true,
	/**
	 * @cfg {String} selectedClass [x-grid3-row-selected]
	 */
	selectedClass: 'x-grid3-row-selected',
	/**
	 * @cfg {String} highlightClass The css class applied to rows which are hovered with mouse
	 * selected via key-nav, or highlighted when a text-query matches a single item.
	 */
	highlightClass: 'x-grid3-row-over',
	/**
	 * @cfg {Number} autoSelectKey [44] COMMA Sets the key used to auto-select an auto-suggest
	 * highlighted query.  When pressed, the highlighted text-item will be selected as if the user
	 * selected the row with a mouse click.
	 */
	autoSelectKey : 44,
	/**
	 * @cfg {String} allSelectedText Text to display when all items are selected
	 */
	allSelectedText : 'All selected',
	/**
	 * @cfg {Number} maxDisplayRows The maximum number of rows to show before applying vscroll
	 */
	maxDisplayRows: null,

	mode: 'local',
	triggerAction: 'all',
	typeAhead: true,

	// private
	highlightIndex : null,
	highlightIndexPrev : null,

	query : null,


	/**
	 * @cfg {Array} value CheckboxCombo expresses its value as an array.
	 */
	value: [],

	/**
	 * @cfg {Integer} minChars [0]
	 */
	minChars: 0,

	initComponent : function() {
		var cls = 'x-combo-list';

		// when blurring out of field, ensure that rawValue contains ONLY items contained in Store.
		this.on('blur', this.validateSelections.createDelegate(this));

		// create an auto-select key handler, like *nix-based console [tab] key behaviour
		this.on('keypress', function(field, ev) {
			if (ev.getKey() == this.autoSelectKey) {	// COMMA
				this.onAutoSelect();
			}
		},this);

		this.addEvents(
			/**
			 * @event initview Fires when Combo#initView is called.
			 * gives plugins a chance to interact with DataView
			 * @author Chris Scott
			 * @param {Combo} this
			 * @param {DataView} dv
			 */
			'initview',
            'clearall'
		);

		// when list expands, constrain the height with @cfg maxDisplayRows
		if (this.maxDisplayRows) {
			this.on('expand', function(){
				var cnt = this.store.getCount();
				if (cnt > this.maxDisplayRows) {
					var children = this.view.getNodes();
					var h = 0;
					for (var n = 0; n < this.maxDisplayRows; n++) {
						h += Ext.fly(children[n]).getHeight();
					}
					this.maxHeight = h;
				}
			}, this, {
				single: true
			});
		}

		this.on('beforequery', this.onQuery, this);

		// Enforce that plugins is an Array.
		if (typeof(this.plugins) == 'undefined'){
			this.plugins = [];
		}
		else if (!Ext.isArray(this.plugins)) {
			this.plugins = [this.plugins];
		}

		var tmp = this.value;	// for case where transform is set.
		Ext.ux.MultiCombo.superclass.initComponent.call(this);
		if (this.transform) {
			if (typeof(tmp) == 'undefined') {
				tmp = [];
			}
			this.setValue(tmp);
		}
	},

	// private
    onViewClick : function(dv, index, node, ev){
		var rec = this.store.getAt(index);
		this.onSelect(rec, index);
		this.el.focus();