$(function(){
	jQuery('ul.accordion').vvAccordion({
		el: '> li',
		head: '.opener',
		content: 'div.slide',
		active: 'selected',
		event: 'click',
		duration: 400
	});
})

jQuery.fn.vvAccordion = function(_options){
	var _options = jQuery.extend({
		el: '> li',
		head: 'span.opener',
		content: 'div.ac-content',
		active: 'selected',
		event: 'click',
		collapsible: true,
		onBeforeAply: null,
		onChangeStart: null,
		onChange: null,
		onMade: null,
		duration: 400
	},_options);

	return this.each(function(){
		var _this = this;
		var _t = null;
		_this.duration = _options.duration;
		_this.list = $(_options.el, _this);
		_this.list.each(function(i){
			this.opener = $(_options.head, this);
			this.slider = $(_options.content, this);
			this.width = this.slider.width();
			this.height = this.slider.height();
			if($(this).hasClass(_options.active)){
				_this.active = this;
				this.opener.parent().addClass('ui-state-active');
			};
			this.index = i;
		});
		if(!_this.active) _this.active = _this.list[0];
		if(jQuery.isFunction(_options.onBeforeAply)){
			_options.onBeforeAply.apply(_this);
		};
		_this.list.not(_this.active).each(function(){
			this.slider.css({height: '0px'});
		});
		_this.list.each(function(){
			var next = this;
			this.opener.bind(_options.event, function(){
				if($(this).parents('li:eq(0)').find('div.slide').length){
					if($(this).parents('li:eq(0)').hasClass(_options.active) && _options.collapsible){
						next.slider.animate({height: 0},{duration: _options.duration,
							complete: function(){
								$(_this.active).removeClass(_options.active);
								_this.active.opener.parent().removeClass('ui-state-active');
								_this.active.slider.css({height: 0});
								_this.active = null;
								if(jQuery.isFunction(_options.onChange)){
									_options.onChange.apply(_this.active);
								};
								_this.curent = false;
							}});
					}else{
						if(jQuery.isFunction(_options.onChangeStart)){
							_options.onChangeStart.apply(_this.active);
						};
						if(_t) clearTimeout(_t);
						_t = setTimeout(function(){
							_this.curent = next;
							next.slider.animate({height: next.height},{duration: _options.duration,
							step:function(i, curObj){
								if(_this.active){
									var _p = curObj.now/curObj.end;
									if(_this.active !== next){
										var _thisValue = 0;
										if (curObj.prop == 'height') {
											_thisValue = _this.active.height - (_this.active.height * _p);
										}else{
											_thisValue = curObj.end - curObj.now;
										}
										eval('_this.active.slider.css({'+curObj.prop+':'+_thisValue+'})');
									}
								}
							},
							complete: function(){
								if(_this.active){
									$(_this.active).removeClass(_options.active);
									_this.active.opener.parent().removeClass('ui-state-active');
									_this.active.slider.css({height: 0});
								}
								_this.active = next;
								$(_this.active).addClass(_options.active);
								_this.active.opener.parent().addClass('ui-state-active');
								_this.active.slider.css({height: _this.active.height});
								if(jQuery.isFunction(_options.onChange)){
									_options.onChange.apply(_this.active);
								};
								_this.curent = false;
							}});
						},150);
					}
					return false;
				}
			});
		});
		if(jQuery.isFunction(_options.onMade)){
			_options.onMade.apply(_this.active);
		};
	});
}