
TreeView = new Class({
	Implements: Options,

	options: {
		expandDuration:		4.5,
		expandTransition:	Fx.Transitions.Cubic.easeOut,
		contractDuration:	3.0,
		contractTransition:	Fx.Transitions.Cubic.easeOut
	},

	initialize: function(div, options) {
		this.div = $(div);
		if(!this.div) return;

		this.setOptions(options);

		var self = this;

		var lst = this.div.getElements('div.treeview-node');
		for(var i=0; i<lst.length; ++i) {
			if(lst[i].getAttribute('branch')) {
				var lbl = lst[i].getElement('label');
				lbl.store('branch', lst[i].getAttribute('branch'));

				lbl.addEvent('click', function(e) {
					self.folderClick(this.retrieve('branch'));
				});
				
			}

		}
	},

	folderClick: function(branch) {
		var bDiv = $('treeview-branch-'+branch);
		if(!bDiv) return;

		if(bDiv.getStyle('display') == 'none') this.expandBranch(branch);
		else this.collapseBranch(branch);
	},

	expandBranch: function(branch) {
		var branchDiv = $('treeview-branch-'+branch);
		if(!branchDiv) return;



		branchDiv.setStyle('height', 1);
		branchDiv.setStyle('overflow', 'hidden');
		branchDiv.setStyle('display', 'block');
		var h = branchDiv.scrollHeight;


		new Fx.Tween(branchDiv, {
			duration: h * this.options.expandDuration,
			transition: this.options.expandTransition,
			onComplete: function() {
				this.element.setStyle('height', '');
				this.element.setStyle('overflow', 'visible');
			}
		}).start('height', h);

		$('treeview-folder-'+branch).className = 'treeview-node-folderopen';

	},

	collapseBranch: function(branch) {
		var branchDiv = $('treeview-branch-'+branch);
		if(!branchDiv) return;

		branchDiv.setStyle('overflow', 'hidden');

		new Fx.Tween(branchDiv, {
			duration: parseInt(branchDiv.getStyle('height')) * this.options.contractDuration,
			transition: this.options.contractTransition,
			onComplete: function() {
				this.element.setStyle('display', 'none');
			}
		}).start('height', 1);


		$('treeview-folder-'+branch).className = 'treeview-node-folder';
	}









});
























