jQuery(function(){
	initCustomForms();
});
function initCustomForms(){
	jQuery('select').customSelect();
	jQuery('.radio').customRadio();
	jQuery('.checkbox').customCheckbox();
	jQuery('ul.accordion li').OpenClose({
		activeClass:'active',
		opener:'>div>a.opener',
		slider:'>div.slide',
		slideSpeed: 400
	});
}
// custom forms plugin
(function(jQuery){
	// custom checkboxes module
	jQuery.fn.customCheckbox = function(_options){
		var _options = jQuery.extend({
			checkboxStructure: '<div></div>',
			checkboxDisabled: 'disabled',
			checkboxDefault: 'checkboxArea',
			checkboxChecked: 'checkboxAreaChecked'
		}, _options);
		return this.each(function(){
			var checkbox = jQuery(this);
			if(!checkbox.hasClass('outtaHere') && checkbox.is(':checkbox')){
				var replaced = jQuery(_options.checkboxStructure);
				this._replaced = replaced;
				if(checkbox.is(':disabled')) replaced.addClass(_options.checkboxDisabled);
				else if(checkbox.is(':checked')) replaced.addClass(_options.checkboxChecked);
				else replaced.addClass(_options.checkboxDefault);

				replaced.click(function(){
					if(checkbox.is(':checked')) checkbox.removeAttr('checked');
					else checkbox.attr('checked', 'checked');
					changeCheckbox(checkbox);
				});
				checkbox.click(function(){
					changeCheckbox(checkbox);
				});
				replaced.insertBefore(checkbox);
				checkbox.addClass('outtaHere');
			}
		});
		function changeCheckbox(_this){
			_this.change();
			if(_this.is(':checked'))
			{
				// Toggle the other paired cross box to off
				var column = _this.get(0)._replaced.parent().parent();
				var crossbox = jQuery(".checkboxAreaChecked", column).addClass(_options.checkboxDefault).removeClass(_options.checkboxChecked);
				crossbox.next().removeAttr("checked");
				
				_this.get(0)._replaced.removeClass().addClass(_options.checkboxChecked);
			} else {
				// Toggle the other paired cross box to on
				var column = _this.get(0)._replaced.parent().parent();
				var crossbox = jQuery(".checkboxArea", column).addClass(_options.checkboxChecked).removeClass(_options.checkboxDefault);
				crossbox.next().attr("checked","checked");
				
				_this.get(0)._replaced.removeClass().addClass(_options.checkboxDefault);
			}
		}
	}

	// custom radios module
	jQuery.fn.customRadio = function(_options){
		var _options = jQuery.extend({
			radioStructure: '<div></div>',
			radioDisabled: 'disabled',
			radioDefault: 'radioArea',
			radioChecked: 'radioAreaChecked'
		}, _options);
		return this.each(function(){
			var radio = jQuery(this);
			if(!radio.hasClass('outtaHere') && radio.is(':radio')){
				var replaced = jQuery(_options.radioStructure);
				this._replaced = replaced;
				if(radio.is(':disabled')) replaced.addClass(_options.radioDisabled);
				else if(radio.is(':checked')) replaced.addClass(_options.radioChecked);
				else replaced.addClass(_options.radioDefault);
				replaced.click(function(){
					if(jQuery(this).hasClass(_options.radioDefault)){
						radio.attr('checked', 'checked');
						changeRadio(radio.get(0));
					}
				});
				radio.click(function(){
					changeRadio(this);
				});
				replaced.insertBefore(radio);
				radio.addClass('outtaHere');
			}
		});
		function changeRadio(_this){
			jQuery(_this).change();
			jQuery('input:radio[name='+jQuery(_this).attr("name")+']').not(_this).each(function(){
				if(this._replaced && !jQuery(this).is(':disabled')) this._replaced.removeClass().addClass(_options.radioDefault);
			});
			_this._replaced.removeClass().addClass(_options.radioChecked);
		}
	}

	// custom selects module
	jQuery.fn.customSelect = function(_options) {
		var _options = jQuery.extend({
			selectStructure: '<div class="selectArea"><span class="left"></span><span class="center"></span><a href="#" class="selectButton"></a><div class="disabled"></div></div>',
			hideOnMouseOut: false,
			copyClass: true,
			selectText: '.center',
			selectBtn: '.selectButton',
			selectDisabled: '.disabled',
			optStructure: '<div class="optionsDivVisible"><div class="select-top"></div><div class="select-center"><ul></ul></div><div class="select-bottom"></div>',
			optList: 'ul'
		}, _options);
		return this.each(function() {
			var select = jQuery(this);
			if(!select.hasClass('outtaHere')) {
				if(select.is(':visible')) {
					var hideOnMouseOut = _options.hideOnMouseOut;
					var copyClass = _options.copyClass;
					var replaced = jQuery(_options.selectStructure);
					var selectText = replaced.find(_options.selectText);
					var selectBtn = replaced.find(_options.selectBtn);
					var selectDisabled = replaced.find(_options.selectDisabled).hide();
					var optHolder = jQuery(_options.optStructure);
					var optList = optHolder.find(_options.optList);
					if(copyClass) optHolder.addClass('drop-'+select.attr('class'));

					if(select.attr('disabled')) selectDisabled.show();
					select.find('option').each(function(){
						var selOpt = jQuery(this);
						var _opt = jQuery('<li><a href="#">' + selOpt.html() + '</a></li>');
						if(selOpt.attr('selected')) {
							selectText.html(selOpt.html());
							_opt.addClass('selected');
						}
						_opt.children('a').click(function() {
							optList.find('li').removeClass('selected');
							select.find('option').removeAttr('selected');
							jQuery(this).parent().addClass('selected');
							selOpt.attr('selected', 'selected');
							selectText.html(selOpt.html());
							select.change();
							optHolder.css({left:-9999,top:-9999});
							return false;
						});
						if(selOpt.attr('title') != 'default'){
							optList.append(_opt);
						}
					});
					replaced.width(select.outerWidth());
					replaced.insertBefore(select);
					optHolder.css({
						width: select.outerWidth(),
						position: 'absolute',
						left:-9999,
						top:-9999
					});
					jQuery(document.body).append(optHolder);

					var optTimer;
					replaced.hover(function() {
						if(optTimer) clearTimeout(optTimer);
					}, function() {
						if(hideOnMouseOut) {
							optTimer = setTimeout(function() {
								optHolder.css({left:-9999,top:-9999});
							}, 200);
						}
					});
					optHolder.hover(
					function(){
						if(optTimer) clearTimeout(optTimer);
					},
					function() {
						if(hideOnMouseOut) {
							optTimer = setTimeout(function() {
								optHolder.css({left:-9999,top:-9999});
								
							}, 200);
							selectBtn.removeClass('hover-btn');
						}
					});
					selectBtn.hover(
						function(){
							jQuery(this).addClass('hover-btn');
						},
						function(){
							jQuery(this).removeClass('hover-btn');
						}
					)
					selectBtn.click(function() {
						if(optHolder.css('left') == '-9999px') {
							if(_activeDrop) _activeDrop.css({left:-9999,top:-9999});
							optHolder.children('ul').css({height:'auto', overflow:'hidden'});
							optHolder.css({
								top: replaced.offset().top + replaced.outerHeight(),
								left: replaced.offset().left,
								display: 'block'
							});
							if(optHolder.children('ul').height() > 200) optHolder.children('ul').css({height:200, overflow:'auto'});
							_activeDrop = optHolder;
						}
						else{
							optHolder.css({left:-9999,top:-9999});
						}
						return false;
					});
					replaced.addClass(select.attr('class'));
					select.addClass('outtaHere');
					//If need scroll auto-height
					//if (optList.height() > 144 ) optList.parent().addClass('scrollable');
				}
			}
		});
	}

	// event handler on DOM ready
	var _activeDrop;
	jQuery(function(){
		jQuery('body').click(hideOptionsClick)
		jQuery(window).resize(hideOptions)
	});
	function hideOptions() {
		if(_activeDrop && _activeDrop.length) {
			_activeDrop.css({left:-9999,top:-9999});
			_activeDrop = null;
		}
	}
	function hideOptionsClick(e) {
		if(_activeDrop && _activeDrop.length) {
			var f = false;
			jQuery(e.target).parents().each(function(){
				if(this == _activeDrop.get(0)) f=true;
			});
			if(!f) {
				_activeDrop.css({left:-9999,top:-9999});
				_activeDrop = null;
			}
		}
	}
	
	
	jQuery("#BackEndSearchForm input").focus(function() {
		var input = jQuery(this);

		if(input.attr("id") == input.val().replace(" ", "")) {
			input.val("");
		}
		
	});
	
	jQuery("#BackEndSearchForm input").blur(function() {
		var input = jQuery(this);

		if(input.val() == "") {
			if(input.attr("id") == "MemberNumber")
				input.val("Member Number");
			else
				input.val("Name");
		}
	});
	
	jQuery("#CustomLoginForm_LoginForm_Email, #MemberLoginForm_LostPasswordForm_Email").focus(function() {
		var input = jQuery(this);
		this.style.color = "#666";
		if(input.val() == "Email") {
			input.val("");
		}
		
	});
	
	jQuery("#CustomLoginForm_LoginForm_Email, #MemberLoginForm_LostPasswordForm_Email").blur(function() {
		var input = jQuery(this);
		
		this.style.color = "#999";
		if(input.val() == "") {
			input.val("Email");
		}
	});
	
	jQuery(".delete a").click(function() {
		return confirm("Are you sure you want to delete this item?");
	});
	
	jQuery("a.cancel").click(function() {
		return confirm("Are you sure you want to cancel? Unsaved data will be lost");
	});
	
	if(jQuery(".FrontendTraineeApplicationPage .slide").has(".message").length > 0)
	{
		alert('There are errors in your application. Please check all required fields are filled in and valid.');	
	}
	
})(jQuery);

// open-close plugin
jQuery.fn.OpenClose = function(_options){
	// default options
	var _options = jQuery.extend({
		activeClass:'active',
		opener:'.opener',
		slider:'.slide',
		slideSpeed: 400,
		animStart:false,
		animEnd:false,
		event:'click'
	},_options);

	return this.each(function(){
		// options
		var _holder = jQuery(this);
		var _slideSpeed = _options.slideSpeed;
		var _activeClass = _options.activeClass;
		var _opener = jQuery(_options.opener, _holder);
		var _slider = jQuery(_options.slider, _holder);
		var _animStart = _options.animStart;
		var _animEnd = _options.animEnd;
		var _event = _options.event;
		if(_slider.length) {
			_opener.bind(_event,function(){
				if(!_slider.is(':animated')) {
					if(typeof _animStart === 'function') _animStart();
					if(_holder.hasClass(_activeClass)) {
						_slider.slideUp(_slideSpeed,function(){
							if(typeof _animEnd === 'function') _animEnd();
						});
						_holder.removeClass(_activeClass);
					} else {
						_holder.addClass(_activeClass);
						_slider.slideDown(_slideSpeed,function(){
							if(typeof _animEnd === 'function') _animEnd();
						});
					}
				}
				return false;
			});
			if(_holder.hasClass(_activeClass)) _slider.show();
			else _slider.hide();
		}
	});
}
