/**
 *	ArenaFilters
 *	--------------------------
 */

var ArenaFilters = (function($) {

	var CLASS_ACTIVE = 'active',
		CLASS_DISABLED = 'disabled';

	/**
	 *	Tooltip
	 *	--------------------------
	 */

	var Tooltip = {
		init: function() {
			this.element = $('<div id="tooltip"><p class="content">' + 
				'<strong>Tip!</strong>Tooltip</p><span class="bottom"></span></div>');
			$('body').append(this.element);

			this.tip = '<strong>Tip! </strong>';
			this.content = this.element.find('p.content');
			this.element.bind('mouseout', this.close.bind(this));
		},

		add:function(selector) {
			var self = this;
			$(selector).hover(function(e){
				self.open(this);
			}, function(e){
				self.close(this);
			});
		},

		open:function(origin) {
			if(this.isOpen) {
				return;
			}

			var self = this;
			var offset = $(origin).offset();
			var title = origin._title || origin.getAttribute('title');
			
			if(title && !origin._title) {
				origin._title = title;
				origin.setAttribute('title', '');
			}

			if(title) {
				this.element.css({visibility:'hidden', display:'block'});
				this.content.html(this.tip + title);

				var availWidth = window.innerWidth || document.documentElement.clientWidth;

				var w = this.element[0].offsetWidth,
					h = this.element[0].offsetHeight,
					left = offset.left + (origin.offsetWidth/2) - (w/2),
					top = offset.top - h;

				left = Math.min(Math.max(left, 10), availWidth - w - 20);

				this.element.css({visibility:'visible', display:'none'});
				this.element.hide().css({
					left: left, 
					top:  top
				}).fadeIn('fast', function(){
					self.isOpen = true;	
				});
			}
		},

		close:function(origin) {
			if(this.isOpen) {
				var self = this;
				this.element.fadeOut('fast', function(){
					self.isOpen = false;
				});
			}
		}
	}

	/**
	 *	Slider controller
	 *	--------------------------
	 */

	SliderController = {
		init:function() {
			this.progress = $('span#filter-totals span.bar')[0];
			this.button = $('div#filter p.buttons a.button');
			this.range = 900;
			this.minimal = 10;
			this.count = 9;
			this.sliders = [];
			this.onchange();
		},

		addSlider:function(slider) {
			this.sliders.push(slider);
		},

		onchange:function(slider) {
			var current = this.getTotal();
			var range = this.getRange(current);
			for (var i=0; i<this.sliders.length; i++) {
				this.sliders[i].setRange(range, this.maxReached);
			}

			if(range == 0 || current >= this.minimal) {
				if(!this.canPost) this.button.removeClass(CLASS_DISABLED);
				this.canPost = true;
			} else {
				if(this.canPost) this.button.addClass(CLASS_DISABLED);
				this.canPost = false;
			}
		},

		getTotal:function() {
			var hasValue = 0,
				total = 0;

			for (var value,i=0; i<this.sliders.length; i++) {
				value = parseInt(this.sliders[i].value, 10);
				total += value;
				if(value != 0) {
					hasValue ++;
				}
			}
			
			this.maxReached = (hasValue >= this.count)? true : false;
			try {				
				var progress = Math.floor((total/this.range) * this.progress.parentNode.offsetWidth);
				this.progress.style.width = progress + 'px';
			} catch (e) {
			}

			return total;
		},

		setRange:function(range) {
			this.range = range;
		},

		getRange:function(current) {
			return this.range - current;
		},

		setCount:function(max) {
			this.count = max;
		}
	}


	/**
	 *	Slider
	 *	--------------------------
	 */

	var CLASS_SLIDER = 'slider',
		CLASS_INDICATOR = 'indicator',
		CLASS_VINDICATOR = 'value',
		CLASS_THUMB = 'thumb';

	function Slider(element, set) {
		this.element = element;
		this.thumb = $('.'+CLASS_THUMB, element);
		this.indicator = $('.'+CLASS_INDICATOR, element);
		this.vindicator = $('.'+CLASS_VINDICATOR, element);
		this.input = $('input', element.parentNode)[0];
		this.minValue = set.min || 0;
		this.maxValue = set.max || 100;
		this.increment = set.increment || 1;
		this.snapValues = set.snapValues || [0,25,50,75,100];
		this.snapSensitivity = 4;
		this.range = this.maxValue;
		this.enabled = true;
		
		$(element).bindScoped('mousedown', this.handleClick, this);
		if(this.input) {
			this.setRelativeValue(parseInt(this.input.value || "0", 10));
		}

		this.thumb.bind("click", function(e){ e.preventDefault(); });
		
		var relatedLabel = this.thumb.parents('li').find('label[title]')[0];
	/*	this.thumb.hover(
			function(e){ Tooltip.open(relatedLabel); },
			function(e){ Tooltip.close(); }
		)
	*/
		if(this.input) {
			SliderController.addSlider(this);
		}
	}

	Slider.prototype = {
		handleClick:function(e){
			var target = $(e.target), doc = $(document);
			doc.unbind('mousemove', this.handleDrag);
			
			if(target.hasClass(CLASS_THUMB)) {
				this.dragging = true;
				doc.bindScoped('mousemove', this.handleDrag, this);
				doc.bindScoped('mouseup', this.handleRelease, this);
				e.stopPropagation();
				e.preventDefault();
			} else if(target.hasClass(CLASS_INDICATOR)) {
				var left = e.clientX - $(this.element).calculateLeft() - 10;
				this.setAbsoluteValue(left);
			}
		},
		
		handleDrag:function(e) {
			var offset = this.thumb.offset().left + this.thumb[0].offsetWidth/2;
			var dx = e.clientX - offset;
			this.setAbsoluteValue(this.thumb[0].offsetLeft + dx);
			
			e.preventDefault();
		},

		setAbsoluteValue:function(pxValue, cx) {
			var el = this.thumb[0],
				range = this.maxValue - this.minValue,
				w = this.element.offsetWidth - el.offsetWidth, 
				left = Math.min(Math.max(pxValue, 0), w), 
				value = this.minValue + Math.round((left / w) * range);
			
			if(isNaN(value)) {
				value = 0;
			}

			if(value > this.range) {
				value = this.range;
				this.setRelativeValue(value);
				return;
			}
			
			this.value = this.snapToValue(value);
			left = Math.round((this.value / range) * w);
		
			this.input.value = this.value;
			this.thumb[this.dragging? 'css' : 'animate']({
				left: left + 'px'
			});

			this.vindicator[this.dragging? 'css' : 'animate']({
				width: (left + 10) + 'px'
			});

			SliderController.onchange(this);
		},

		setRelativeValue:function(value) {
			var rel = Math.min(Math.max(value, this.minValue), this.maxValue);
			var w = this.element.offsetWidth - this.thumb[0].offsetWidth;
			var pxValue = Math.ceil(w/(this.maxValue - this.minValue) * rel);
			this.setAbsoluteValue(pxValue);
		},

		snapToValue:function(value) {
			var l = this.snapValues.length,
				sens = this.snapSensitivity;

			for(var i=0; i<l; i++) {
				var snap = this.snapValues[i],
					d = Math.abs(snap - value);

				if(d <= sens && snap <= this.range) {
					return snap;
				}
			}
			return value;
		},

		setRange:function(range, full) {
			this.range = range + this.value;
			var excess = full && (this.value == 0);
			var w = this.element.offsetWidth-20, r = this.maxValue - this.minValue;
			var x = parseInt(this.range/r * w, 10) - w;
			x = Math.max(Math.min(x, 0), -w) -10;
			this.element.style.backgroundPosition = x+'px -25px';
			
			if(this.enabled && (this.range == 0 || excess)) {
				this.setEnabled(false);
			} else if(!this.enabled && this.range > 0 && !excess){
				this.setEnabled(true);
			}
		},

		setEnabled:function(enabled) {
			this.enabled = enabled;
			this.thumb[enabled? 'show':'hide']();
			this.indicator.css({ backgroundPosition: enabled? '0 0' : '0 -50px'});
			$(this.element.parentNode)[enabled? 'removeClass' : 'addClass']('disabled');
		},

		handleRelease:function(e){
			var doc = $(document);
			doc.unbind('mousemove', this.handleDrag);
			doc.unbind('mouseup', this.handleRelease);
			this.origin = null;
			this.dragging = false;
			e.preventDefault();
		}
	}

	$.registerPlugin('slider', Slider);

	/**
	 *	Return
	 *	--------------------------
	 */
	
	return {
		Tooltip: Tooltip,
		SliderController: SliderController,
		Slider: Slider
	}

})(jQuery);