var CustomRadioCheckbox = function(){
	
	var RadioClass = 'x-radio';
	var RadioFocusClass = RadioClass+'-focus';
	var CheckboxClass = 'x-checkbox';
	var CheckboxFocusClass = RadioClass+'-focus';
	var SelectedClass = 'selected';
	var TemplateRadio = '<a href="#" class="'+RadioClass+'"><img src="/images/blank.gif" /></a>';
	var TemplateCheckbox = '<a href="#" class="'+CheckboxClass+'"><img src="/images/blank.gif" /></a>';
	
	var arrRadioName=[];
	var arrCheckboxName=[];
	var acceptedKeydownCode = [37,38,39,40];
	
	var self = {
		init: function(baseElm){
			$(baseElm + ' input:radio').each(function(){
				$(this).hide();
				$(TemplateRadio).insertAfter(this);
				
				var newRadio = $(this).next();
				var newRadioName = $(this).attr('name');
				if($.inArray(newRadioName,arrRadioName) < 0){
					arrRadioName.push(newRadioName);
				}
				newRadio
					.attr('rel', newRadioName)
					.click(function(){
					  $('a.'+RadioClass+'[rel="'+$(this).attr('rel')+'"] img').removeClass(SelectedClass);
					  $(this).focus();
					  $(':first-child',$(this)).addClass(SelectedClass);
                                          $(this).parent().find("input:radio").click();
					  $(this).parent().find("input:radio").checked = true;
					  return false;
					})
					.focus(function(){
							$(this).addClass(RadioFocusClass);
						})
					.blur(function(){
							$(this).removeClass(RadioFocusClass);
						})
					.keydown(self.handleRadioKeydown);
				
				if(this.checked) $(':first-child', newRadio).addClass(SelectedClass);
				// label interaction
				var radioId = $(this).attr('id');
				$('label[for='+radioId+']').click(function(){
					$('#'+radioId).next().trigger('click');
					return false;
				});
			});
			self.setupIndexRadio();
			$(baseElm + ' input:checkbox').each(function(){
				$(this).hide();
				$(TemplateCheckbox).insertAfter(this);
				
				var newCheckbox = $(this).next();
				var newCheckboxName = $(this).attr('name');
				if($.inArray(newCheckboxName,arrCheckboxName) < 0){
					arrCheckboxName.push(newCheckboxName);
				}
				newCheckbox
					.attr('rel', newCheckboxName)
					.click(function(){
							$(this).focus();
							if($(this).prev()[0].checked){
								$(':first-child',$(this)).removeClass(SelectedClass);
                                                                $(this).prev()[0].click();
								$(this).prev()[0].checked = false;
							}else{
								$(':first-child',$(this)).addClass(SelectedClass);
                                                                $(this).prev()[0].click();
								$(this).prev()[0].checked = true;
							}
							return false;
						})
					.focus(function(){
							$(this).addClass(CheckboxFocusClass);
						})
					.blur(function(){
							$(this).removeClass(CheckboxFocusClass);
						})
					.keydown(self.handleCheckboxKeydown);
				
				if(this.checked) $(':first-child', newCheckbox).addClass(SelectedClass);
				// label interaction
				var checkboxId = $(this).attr('id');
				$('label[for='+checkboxId+']').click(function(){
					$('#'+checkboxId).next().trigger('click');
					return false;
				});
			});
		},
		handleCheckboxKeydown:function(e){
			if(e.keyCode==32){
				$(this).trigger('click');
				return false;
			}
		},
		setupIndexRadio: function(){
			$.each(arrRadioName,function(){
				var radioName=this;
				$.each($('a.'+RadioClass+'[rel="'+radioName+'"]'),function(i,elm){
					$(elm)
						.addClass(radioName+"_"+i)
						.data('index',i);
				});
			});
		},
		handleRadioKeydown: function(e){
			if($.inArray(e.keyCode, acceptedKeydownCode) >= 0){
				var currentIndex = $(this).data('index');
				var rel = $(this).attr('rel');
				var nextIndex;
				switch(e.keyCode){
					case 39:
					case 40:
						nextIndex=currentIndex+1;
						if($("."+rel+"_"+nextIndex).length === 0) nextIndex=0;
						break;
					case 37:
					case 38:
						nextIndex=currentIndex-1;
						if($("."+rel+"_"+nextIndex).length === 0) nextIndex=$('a.'+RadioClass+'[rel="'+rel+'"]').length - 1;
						break;
				}
				$("."+rel+"_"+nextIndex).trigger('click');
				$(this).trigger('blur');
				return false;
			}
		}
	};
	return self;

}();

$(document).ready(function(){
  CustomRadioCheckbox.init('.custom-radiochk');
});