$.widget("ui.pafaccordion", $.extend({}, $.ui.accordion.prototype, {
	_original_init: $.ui.accordion.prototype._create,

 	_create: function(){
    	var self = this, options = $.extend({mode: 'standard'}, this.options);
    	// fire original method
		self._original_init();
	},
	
	// TODO isn't event.target enough? why the seperate target argument?
	_clickHandler: function(event, target) {
		var o = this.options;
		if (o.disabled)
			return;

		// called only when using activate(false) to close all parts programmatically
		if (!event.target) {
			if (!o.collapsible)
				return;
			this.active.removeClass("ui-state-active ui-corner-top").addClass("ui-state-default ui-corner-all")
				.find(".ui-icon").removeClass(o.icons.headerSelected).addClass(o.icons.header);
			this.active.next().addClass('ui-accordion-content-active');
			var toHide = this.active.next(),
				data = {
					options: o,
					newHeader: $([]),
					oldHeader: o.active,
					newContent: $([]),
					oldContent: toHide
				},
				toShow = (this.active = $([]));
			this._toggle(toShow, toHide, data);
			return;
		}

		// get the click target
		var clicked = $(event.currentTarget || target);
		var clickedIsActive = false;
		var vClickedActive = $([]);
		
		
		this.active.each(function(aIndex, aElement){
			if(aElement == clicked[0]){
				clickedIsActive = true;
				vClickedActive = vClickedActive.add(aElement);
			}
		});
		
		//var clickedIsActive = clicked[0] == this.active[0];
		
		
		// TODO the option is changed, is that correct?
		// TODO if it is correct, shouldn't that happen after determining that the click is valid?
		o.active = o.collapsible && clickedIsActive ? false : $('.ui-accordion-header', this.element).index(clicked);

		// if animations are still active, or the active header is the target, ignore click
		if (this.running || (!o.collapsible && clickedIsActive)) {
			return;
		}

		if(o.mode == 'multiple' && clickedIsActive){
			vClickedActive.removeClass("ui-state-active ui-corner-top").addClass("ui-state-default ui-corner-all")
				.find(".ui-icon").removeClass(o.icons.headerSelected).addClass(o.icons.header);
		} else if(o.mode == 'multiple' && !clickedIsActive){
			//DO nothing
		} else {
			// switch classes
			this.active.removeClass("ui-state-active ui-corner-top").addClass("ui-state-default ui-corner-all")
				.find(".ui-icon").removeClass(o.icons.headerSelected).addClass(o.icons.header);
		}
		
		if (!clickedIsActive) {
			clicked.removeClass("ui-state-default ui-corner-all").addClass("ui-state-active ui-corner-top")
				.find(".ui-icon").removeClass(o.icons.header).addClass(o.icons.headerSelected);
			clicked.next().addClass('ui-accordion-content-active');
		}
		
		if (o.mode == 'multiple' && !clickedIsActive){
			var self = this;
			var vNewActive = $([]);

			this.active = this.active.add(clicked[0]);

			// find elements to show and hide
			var toShow = clicked.next(),
				toHide = $([]),
				data = {
					options: o,
					newHeader: clickedIsActive && o.collapsible ? $([]) : clicked,
					oldHeader: this.active,
					newContent: clickedIsActive && o.collapsible ? $([]) : toShow,
					oldContent: toHide
				},
				down = this.headers.index( this.active[0] ) > this.headers.index( clicked[0] );
		} else if (o.mode == 'multiple' && clickedIsActive) {
			
			var toHide = $([]);
			var self = this;
			var vNewActive = $([]);
			
			this.active.each(function(aIndex, aElem){
				if(aElem == clicked[0]){
					toHide = $(self.active[aIndex]).next();
				} else {
					vNewActive = vNewActive.add($(self.active[aIndex]));
				}
						
			});
			this.active = vNewActive;
			var toShow = clicked.next(),
				data = {
					options: o,
					newHeader: clickedIsActive && o.collapsible ? $([]) : clicked,
					oldHeader: this.active,
					newContent: clickedIsActive && o.collapsible ? $([]) : toShow,
					oldContent: toHide
				},
				down = this.headers.index( this.active[0] ) > this.headers.index( clicked[0] );
		} else {
			// find elements to show and hide
			var toShow = clicked.next(),
				toHide = this.active.next(),
				data = {
					options: o,
					newHeader: clickedIsActive && o.collapsible ? $([]) : clicked,
					oldHeader: this.active,
					newContent: clickedIsActive && o.collapsible ? $([]) : toShow,
					oldContent: toHide
				},
				down = this.headers.index( this.active[0] ) > this.headers.index( clicked[0] );
		
		}
		
		if (o.mode == 'multiple'){
			// DO Nothing
			//this.active = clickedIsActive ? $([]) : clicked;
		} else {
			this.active = clickedIsActive ? $([]) : clicked;
		}
		
		this._toggle(toShow, toHide, data, clickedIsActive, down);
		
		return;

	},
	activateAll: function(aBool) {
		var self = this;
	
		if(aBool){
			this.active.removeClass("ui-state-active ui-corner-top").addClass("ui-state-default ui-corner-all").find(".ui-icon").removeClass(this.options.icons.headerSelected).addClass(this.options.icons.header);
		
			this.active = this._findActive(this.headers.filter(':not(.ui-state-active)')).toggleClass("ui-state-default").toggleClass("ui-state-active").toggleClass("ui-corner-all").toggleClass("ui-corner-top");
			this.active.each(function(aIndex,aElement){
				$(aElement).next().addClass('ui-accordion-content-active').show();
				self._trigger('change', null, {newHeader: $(aElement)});
			});
			this._destroyIcons();
			this._createIcons();
			this.resize();

		
			/*this.headers.each(function(aIndex,aElement){
				if(!$(aElement).hasClass('ui-state-active')){
					$(aElement).click();
				}
			});*/
		} else {
			this.active.removeClass("ui-state-active ui-corner-top").addClass("ui-state-default ui-corner-all").find(".ui-icon").removeClass(this.options.icons.headerSelected).addClass(this.options.icons.header);
			this.active.each(function(aIndex,aElement){
				$(aElement).next().removeClass('ui-accordion-content-active').hide();
				self._trigger('change', null, {newHeader: $(aElement)});
			});
			
			this.active = this._findActive($([])).toggleClass("ui-state-default").toggleClass("ui-state-active").toggleClass("ui-corner-all").toggleClass("ui-corner-top");
			
			this._destroyIcons();
			this._createIcons();
			this.resize();
		}
		return this;
	}
}));

