var _forms = $('form');
var inputs = new Array();
var selects = new Array();
var labels = new Array();
var radios = new Array();
var radioLabels = new Array();
var checkboxes = new Array();
var checkboxLabels = new Array();
var selectText = "Select";
var _selectHeight = 22;
var __sAll = false;
var openedSelect = null;

function customForms() {
	getFormElements();
	getFormRelations();
	replaceSelects();
}

// find all form elements will be replaced
function getFormElements() {
	$('form').each(function(){
		$(this).find('input').each(function(){
			if(!$(this).hasClass('customizedElement')) inputs.push($(this));
		});
		$(this).find('label').each(function(){
			try{
				if($('#' + $(this).attr('for'))){
					if(!$('#' + $(this).attr('for')).hasClass('customizedElement')) labels.push($(this));
				}
			} catch(__err) {}
		});
		$(this).find('select').each(function(){
			if(!$(this).hasClass('customizedElement')) selects.push($(this));
		});
	});
}

// find all relations by for attributes
function getFormRelations() {
	var __r = 0;
	var __c = 0;
	var __rl = 0;
	var __cl = 0;
	radios = [];
	radioLabels = [];
	checkboxes = [];
	checkboxLabels = [];
	for(var __i=0;__i<inputs.length;__i++) {
		if(inputs[__i].attr('type')=='radio') {
			radios[__r]=inputs[__i];
			++__r;
			for(var __l=0;__l<labels.length;__l++) {
				if((inputs[__i].attr('id')) && labels[__l].attr('for') == inputs[__i].attr('id')) {
					radioLabels[__rl] = labels[__l];++__rl;
				}
			}
		}
		if(inputs[__i].attr('type')=='checkbox') {
			checkboxes[__c]=inputs[__i];
			++__c;
			for(var __l=0;__l<labels.length;__l++) {
				if((inputs[__i].attr('id')) && labels[__l].attr('for') == inputs[__i].attr('id')) {
					checkboxLabels[__cl] = labels[__l];++__cl;
				}
			}
		}
	}
}
// SELECTS
// customize selects
function replaceSelects() {
	for(var __s=0;__s<selects.length;__s++) {
        if (!selects[__s].hasClass('customizedElement') && selects[__s].width()){
            selects[__s]._ind = __s;
            var replacedSelect = $('\
                <div class="customSelect">\
                    <span class="bg-select-left"></span>\
                    <span style="display: none;" class="disabled"></span>\
                    <span class="bg-select-center" id="customSelectText' + __s + '">' + selectText + '</span>\
                    <a href="javascript:displayOptions(\'' + __s + '\')" class="selectButton"></a>\
                </div>');
            //selects[__s]._disabled = selects[__s].find('span.bg-select-disabled');
            var _selectWidth = selects[__s].width();
            replacedSelect.css('width',_selectWidth);
            replacedSelect.addClass(selects[__s].attr('class'));
            replacedSelect.attr('id','customSelect'+__s);
            selects[__s].addClass('customizedElement');
            selects[__s].parent().prepend(replacedSelect);
            
            var replacedOptions = $('<div id="customOptions' + __s + '"></div>');
            var replacedOptionsUl = $('<ul></ul>');
            replacedOptions.append(replacedOptionsUl);
            replacedOptions.css('width',parseInt(_selectWidth)-2);
            selects[__s]._options = replacedOptionsUl;
            replacedOptions._parent = replacedSelect;
            replaceOptions(selects[__s]);
            $('body').append(replacedOptions);
            //replacedOptions.html('<div class="select-holder"><div class="select-t"><div>&nbsp;</div></div><div class="scroll-pane">'+replacedOptions.html()+'</div><div class="select-bt"><div>&nbsp;</div></div></div>')
			replacedOptions.addClass('customOptionsHidden');
        }
        __sAll = true;
	}
}

// customize select options
function replaceOptions(__select) {
	__select._options.html('');
	var _opts = '';
	__select.find('option').each(function(__s){
		if($(this).parent().attr('id')){
			_opts += '<li><a href="javascript:displayOptions(\'' +__select._ind+ '\'); customSelectEvent(\'' + $(this).parent().attr("id") + '\',' + __s + ',' + __select._ind + ');">' + $(this).text() + '</a></li>';
			if($(this).attr('selected')) customSelectEvent($(this).parent().attr('id'),__s,__select._ind);
		}else{
			_opts += '<li><a href="javascript:displayOptions(\'' +__select._ind+ '\'); customSelectEvent(\'\',' + __s + ',' + __select._ind + ');">' + $(this).text() + '</a></li>';
			if($(this).attr('selected')) customSelectEvent('',__s,__select._ind);
		}
	});
	__select._options.html(_opts);

    /*
	if (__select.disabled) __select._disabled.show();
	else __select._disabled.hide();
	*/
}

// option check function
function customSelectEvent(_selectId,_optionId,_selectIndex) {
	customAppr = selects[_selectIndex];
	customAppr.find('option').each(function(optionId){
		if(optionId==_optionId) {$(this).attr('selected',true);}
		else $(this).attr('selected',false);
	});
	_customSelectText = $('#customSelectText' + _selectIndex);
	var _customSelectTextNew;
	_customSelectTextNew = customAppr.find('option').eq(_optionId).text();
	_customSelectText.html(_customSelectTextNew);
	if (customAppr.change && __sAll){
		eval(customAppr.change());
	}
	hideOptions();
}

//show options
function displayOptions(___selectId) {
		var _customOptions = $('#customOptions' + ___selectId);
		var _customSelect = $('#customSelect'+___selectId);
		if (openedSelect && openedSelect != _customOptions) {
			openedSelect.removeClass('customOptionsHidden');
			openedSelect.addClass('customOptions');
			openedSelect.css('height','auto');
		}
		if(_customOptions.hasClass('customOptionsHidden')) {
			_customOptions.css({
				'left':'-9999px',
				'top':getTopPosition(_customSelect) + _selectHeight + 'px'
			});
			hideOptions();
			_customOptions.removeClass('customOptionsHidden');
			_customOptions.addClass('customOptions')
			.addClass('customOptionsActive');
			_customSelect.addClass('customSelectActive');
			_customOptions.css('left',getLeftPosition(_customSelect) + 'px')
			openedSelect = _customOptions;
			
			//if(document.documentElement) document.documentElement.onclick = hideOptions
			//else window.onclick = hideOptions;
			$(document).click(function(e){
				if($(e.target).parents('div.customSelect').length == 0 && $(e.target).parents('div.customOptions').length == 0){
					hideOptions();
				}
			});

		} else if(_customOptions.hasClass('customOptions')) {
			_customOptions.css('height','auto');
			_customOptions.removeClass('customOptions');
			_customOptions.addClass('customOptionsHidden');
			hideOptions(); //hide
		}
}

// hide options
function hideOptions(){
	if(openedSelect){
		$('.customOptions').each(function(){
			$(this).removeClass('customOptions');
			$(this).addClass('customOptionsHidden');
		});
		$('.customSelectActive').each(function(){
			$(this).removeClass('customSelectActive');
		});
		openedSelect = false;
		$(document).unbind('click');
	}
}

// options Y position
function getTopPosition(_obj) {
	var _topPosition = 0;
	var __offset = _obj.offset();
	_topPosition = __offset.top;
	return _topPosition;
}

// options X position
function getLeftPosition(_obj) {
	var _leftPosition = 0;
	var __offset = _obj.offset();
	_leftPosition = __offset.left;
	return _leftPosition;
}

$(window).load(function(){
    customForms();
});

function initRadios(){
	$('.pay-film').each(function(){
		var _hold = $(this);
		var _parent = _hold.find('.bord');
		var _rad = _hold.find('input[type=radio]');
		var _item = _hold.find('.item');
		var _sel = _hold.find('select');
		var _img = _hold.find('img');

		_sel.change(function(){
			_item.removeClass('bordered');
			_parent.removeClass('bordered');
			_rad.attr('checked',false);
			$(this).parents('.bord').addClass('bordered').find('input[type=radio]').attr('checked',true);
		});
		
		_rad.click(function(){
			_item.removeClass('bordered');
			_parent.removeClass('bordered');
			$(this).parents('.bord').addClass('bordered');
			if($(this).parents('.bord').find('select').length) {
				var _selId = $(this).parents('.bord').find('.customSelect').attr('id').replace('customSelect','');
				if(typeof displayOptions=='function') {
					setTimeout(function(){
						displayOptions(_selId);
					},100);
				}
			}
		});
		
		_img.click(function(){
			_item.removeClass('bordered');
			_parent.removeClass('bordered');
			$(this).parents('.bord').addClass('bordered');
			_rad.attr('checked',false);
			$(this).parents('.bord').find('input[type=radio]').attr('checked',true);
			if($(this).parents('.bord').find('select').length) {
				var _selId = $(this).parents('.bord').find('.customSelect').attr('id').replace('customSelect','');
				if(typeof displayOptions=='function') {
					setTimeout(function(){
						displayOptions(_selId);
					},100);
				}
			}
		});
	});
	$('#helpicon').unbind('click');
	
	$('.paysys-pay').each(function(){
		var _hold = $(this);
		var _parent = _hold.find('.item');
		var _rad = _hold.find('input[type=radio]');
		_rad.click(function(){
			_parent.removeClass('bordered');
			$(this).parents('.item').addClass('bordered');
		});
		_parent.click(function(){
			_parent.removeClass('bordered').find('input').attr('checked',false);
			$(this).addClass('bordered');
			$(this).find('input').attr('checked',true);
		});
	});
}
$(function(){
	initRadios();
});