/**
 * Ext.ux.plugins.FadeArrows plugin for Ext.tree.TreePanel
 *
 * @author  Timothy Grant Vogelsang
 * @date    January 1, 2010
 *
 * @class Ext.ux.plugins.FadeArrows
 * @extends Ext.util.Observable
 */
Ext.ns('Ext.ux.plugins');

Ext.ux.plugins.FadeArrows = function(config) {
	Ext.apply(this, config);
};

// plugin code
Ext.extend(Ext.ux.plugins.FadeArrows, Ext.util.Observable, {
	// initialization
	init: function(tree) {
		this.visible = true;
		
		this.tree = tree;
		
		tree.on( 'afterrender', this.initPlugin.createDelegate(this) );
	},
	
	// initialize plugin
	initPlugin: function() {
		this.el = this.tree.getTreeEl();
		
		this.el.on( 'mouseenter', this.showArrows.createDelegate(this) );
		this.el.on( 'mouseleave', this.hideArrows.createDelegate(this) );
	},
	
	// hide arrows
	hideArrows: function() {
		if (this.visible) {
			var els = this.el.select('.x-tree-arrows img.x-tree-ec-icon');
			
			els.stopFx();
			
			els.fadeOut( {
				duration: 2,
				endOpacity: 0.1
			} );
			
			this.visible = false;
		}
	},
	
	// show arrows
	showArrows: function() {
		if (!this.visible) {
			var els = this.el.select('.x-tree-arrows img.x-tree-ec-icon');
			
			els.stopFx();
			
			els.fadeIn( {
				duration: 0
			} );
			
			this.visible = true;
		}
	}
} ); // end of extend