/*

jQuery Custom Check-/Radio- boxes
by Aleksandar Mitic
www.softwaste.com

based on:
CUSTOM FORM ELEMENTS
by Ryan Fait
www.ryanfait.com

Credits for the original script and idea go Ryan.

The only things you may need to change in this file are the following
variables: checkboxHeight, radioHeight and selectWidth (lines 24, 25, 26)

The numbers you set for checkboxHeight and radioHeight should be one quarter
of the total height of the image want to use for checkboxes and radio
buttons. Both images should contain the four stages of both inputs stacked
on top of each other in this order: unchecked, unchecked-clicked, checked,
checked-clicked.

You may need to adjust your images a bit if there is a slight vertical
movement during the different stages of the button activation.

*/

(function($){
	StyledInput = function(target, options) {
		this.isValid = false;
		this.isPushed = false;
		this.wasPushed = false;
		this.input = $(target);
		if (!this.input.is('input') || (this.input.attr('type') != "checkbox" && this.input.attr('type') != "radio")) {
			return;
		}
		this.options = $.extend(StyledInput.prototype.defaults, options);
		this.span = $(document.createElement('span')).addClass(this.options.styleClass);
		if (this.input.attr('type') == 'checkbox') {
			this.isCheckbox = true;
			this.span.addClass(this.options.checkboxClass);
		} else if (this.input.attr('type') == 'radio') {
			this.isRadio = true;
			this.span.addClass(this.options.radioClass);
		}
		this.input.wrap(this.span);
		this.span = this.input.parent();
		this.reset();

		var self = this;
		this.mouseUpHandler = function(e) {
			return self.mouseUp(e);
		}
		this.mouseDownHandler = function(e) {
			return self.mouseDown(e);
		}
		this.mouseOverHandler = function(e) {
			return self.mouseOver(e);
		}
		this.mouseOutHandler = function(e) {
			return self.mouseOut(e);
		}
		this.documentMouseUpHandler = function(e) {
			return self.documentMouseUp(e);
		}
		this.span.mouseup(this.mouseUpHandler);
		this.span.mousedown(this.mouseDownHandler);
		this.span.mouseover(this.mouseOverHandler);
		this.span.mouseout(this.mouseOutHandler);
		var inputId = this.input.attr('id');
		if (inputId) {
			var label = $(document).find('label[for=' + inputId +']');
			label.mouseup(this.mouseUpHandler);
			label.mousedown(this.mouseDownHandler);
			label.mouseover(this.mouseOverHandler);
			label.mouseout(this.mouseOutHandler);
		}
		StyledInput.prototype.collection[StyledInput.prototype.collection.length] = this;
		this.isValid = true;
	}

	StyledInput.prototype.check = function(state) {
		if (state) {
			this.isChecked = true;
			this.input.attr('checked', 'checked');
		} else {
			this.isChecked = false;
			this.input.removeAttr('checked');
		}
		if (this.options.submitOnChange) {
			this.input.closest('form').trigger('submit');
		}
	}

	StyledInput.prototype.reset = function() {
		this.isChecked = this.input.attr('checked');
		this.isDisabled = this.input.attr('disabled');
		this.update();
	}

	StyledInput.prototype.toggle = function() {
		if (this.isRadio && this.isChecked && !this.options.cancelable) return;
		this.check(!this.isChecked);
	}

	StyledInput.prototype.update = function() {
		var offset = 0;
		if (this.isDisabled) {
			offset = 4;
		}
		if (this.isPushed) {
			if(this.isCheckbox && this.isChecked) {
				this.span.css('backgroundPosition', "0 -" + this.options.checkboxHeight*(3+offset) + "px");
			} else if(this.isCheckbox) {
				this.span.css('backgroundPosition', "0 -" + this.options.checkboxHeight*(1+offset) + "px");
			} else if(this.isRadio && this.isChecked) {
				this.span.css('backgroundPosition', "0 -" + this.options.radioHeight*(3+offset) + "px");
			} else if(this.isRadio) {
				this.span.css('backgroundPosition', "0 -" + this.options.radioHeight*(1+offset) + "px");
			}
		} else {
			if(this.isCheckbox && this.isChecked) {
				this.span.css('backgroundPosition', "0 -" + this.options.checkboxHeight*(2+offset) + "px");
			} else if(this.isCheckbox) {
				this.span.css('backgroundPosition', "0 -" + this.options.checkboxHeight*(offset) + "px");
			} else if(this.isRadio && this.isChecked) {
				this.span.css('backgroundPosition', "0 -" + this.options.radioHeight*(2+offset) + "px");
			} else if(this.isRadio) {
				this.span.css('backgroundPosition', "0 -" + this.options.radioHeight*(offset) + "px");
			}
		}
	}

	StyledInput.prototype.mouseUp = function(e) {
		if (this.isDisabled) {
			return true;
		}
		if (this.wasPushed) {
			this.toggle();
			this.resetAll();
		}
		this.isPushed = false;
		this.wasPushed = false;
	}

	StyledInput.prototype.mouseDown = function(e) {
		if (this.isDisabled) {
			return true;
		}
		this.isPushed = true;
		this.wasPushed = true;
		$(document).bind('mouseup', this.documentMouseUpHandler);
		this.update();
		return false;
	}

	StyledInput.prototype.mouseOver = function(e) {
		if (this.isDisabled) {
			return true;
		}
		this.isPushed = this.wasPushed;
		this.update();
	}

	StyledInput.prototype.mouseOut = function(e) {
		if (this.isDisabled) {
			return true;
		}
		this.isPushed = false;
		this.update();
	}

	StyledInput.prototype.documentMouseUp = function(e) {
		this.isPushed = false;
		this.wasPushed = false;
		$(document).unbind('mouseup', this.documentMouseUpHandler);
		this.update();
	}

	StyledInput.prototype.collection = [];

	StyledInput.prototype.resetAll = function() {
		for (var i=0, len=StyledInput.prototype.collection.length; i<len; i++) {
			StyledInput.prototype.collection[i].reset();
		}
	}

	StyledInput.resetAll = function() {
		StyledInput.prototype.resetAll();
	}
		
	StyledInput.prototype.defaults = {
		styleClass: "inlineblock",
		checkboxClass: "checkbox",
		radioClass: "radio",
		submitOnChange: false,
		checkboxHeight: 25,
		radioHeight: 25,
		cancelable: false,
		debug: false
	}
	
	$.fn.styledInput = function(options) {
		return this.each(function() {
			var obj = new StyledInput(this, options);
			if (!obj.isValid) {
				delete obj;
			}
		});
	}
})(jQuery);

function refreshInputs() {
}

function disableInput(id) {
}

function enableInput(id) {
}
