// VARIÁVEIS QUE SÃO NECESSÁRIAS SETAR

// Select Fake
var tamanhoBorda = 10; // Setar a largura da borda-left
var paddingLeft = 0; // Setar o padding-left necessário pra completar o início do texto. (levar em consideração o tamanho da borda)

// Combo Fake
var quantidadeItens = 4;
var borda = 10;
var alturaLI = 18;

// File Fake
var caracteresFileFake = 22; // Setar a quantidade limite de caracteres que vão aparecer.

// Exemplo
/*
	<select class="select-padrao w-100" id="sexo" name="sexo">
		<option value="">Selecione</option>
		<option value="1">Masculino</option>
		<option value="2">Feminino</option>
	</select>
*/
function selectFake(){
	$('.select-padrao').each(function(){
		var valorInicial  = $(this).find('option:selected').html();
		var selectContent = $(this).attr('class');
		selectContent = selectContent.substr(2,10);
		selectContent = parseInt(selectContent);
		var largura = selectContent - tamanhoBorda - paddingLeft;
		$(this).addClass('select-hide');
		$(this).before('\
		<div class="select-content" style="width:'+selectContent+'px">\
			<div class="borda-left"></div>\
			<div class="select-fake" style="width:'+largura+'px;padding-left:'+paddingLeft+'">'+valorInicial+'</div>\
			<div class="clear"></div>\
		</div>');
		$(this).appendTo( $(this).prev() );
		$(this).change(function(){
			var string = $(this).children('option:selected').text();
			$(this).parent('.select-content').children('.select-fake').html(string);
		});
		var str = $(this).children('option:selected').text();
		$(this).parent('.select-content').children('.select-fake').html(str);
	});
}

// Exemplo
/*
	<select class="w-100 combo-padrao" id="sexo" name="sexo" lang="required:true">
		<option value="">Selecione</option>
		<option value="1">Masculino</option>
		<option value="2">Feminino</option>
	</select>
*/
function comboFake(){
	$('.combo-padrao').each(function(){
		var contador = 0;
		var valorInicial  = $(this).find('option:selected').val();
		var lang = $(this).attr('lang');
		var id = $(this).attr('id')
		var comboContent = $(this).attr('class');
		comboContent = comboContent.substr(2,10);
		comboContent = parseInt(comboContent);
		var largura = comboContent - tamanhoBorda - paddingLeft;
		var larguraCombo = comboContent - 2*borda;
		$(this).addClass('combo-hide');
		$(this).before('\
		<div class="combo-all" style="width:'+comboContent+'px">\
			<div class="combo-content" style="width:'+comboContent+'px">\
				<input type="text" class="{'+lang+'} combo-input" id="combo'+id+'" name="combo'+id+'" />\
				<div class="combo-fake" style="width:'+larguraCombo+'px;">'+valorInicial+'</div>\
				<span class="combo-seta replace"></span>\
				<span class="borda-left-top"></span>\
				<span class="combo-fake-top" style="width:'+largura+'px;padding-left:'+paddingLeft+'"></span>\
				<div class="combo-itens" style="width:'+comboContent+'px"><ul></ul><div class="clear"></div></div>\
				<div class="clear"></div>\
				<span class="borda-left-bottom"></span>\
				<span class="combo-fake-bottom" style="width:'+largura+'px;padding-left:'+paddingLeft+'"></span>\
				<div class="clear"></div>\
			</div>\
		</div>');
		$(this).appendTo( $(this).prev('.combo-all').children('.combo-content') );
		$(this).children('option').each(function(){
			var li = '<li>'+$(this).html()+'</li>';
			$(li).appendTo( $(this).parent().parent().children('.combo-itens').children('ul') );
			contador++;
		});
		$(this).parent().children('.combo-itens').find('li').click(function(){
			var string = $(this).html();
			var index = $(this).index();
			$(this).parent().parent().parent().parent().parent().children('.combo-fake').html(string).parent().children('select').children('option:eq('+index+')').attr('selected','selected');
			$(this).parent().parent().parent().parent().slideUp(200).parent().removeClass('aberto');
			if( index != 0 )
				$(this).parent().parent().parent().parent().parent().children('input').val(string);
			else
				$(this).parent().parent().parent().parent().parent().children('input').val("");
		});
		$(this).parent().children('.combo-fake').click(function(){
			$(this).parent().addClass('aberto').children('.combo-itens').slideDown(200);
		});
		$(this).change(function(){
			var string = $(this).children('option:selected').text();
			$(this).parent('.combo-content').children('.combo-fake').html(string);
		});
		
		// Seta valor inicial
		var str = $(this).children('option:selected').text();
		$(this).parent().children('.combo-fake').html(str);
		
		// Carrossel
		$(this).parent().children('.combo-itens').children('ul').jcarousel({
			scroll:quantidadeItens,
			vertical:true,
			itemFallbackDimension:alturaLI
		});
		
		if( contador < 4 ){
			$(this).parent().children('.combo-itens').children('.jcarousel-container').children('.jcarousel-clip').height(alturaLI*contador);
		}
		$(this).parent().children('.combo-itens').hide().children('div').css({'width':larguraCombo+'px','padding-right':borda+'px'});
		
	});
}


// Exemplo
/*
	<input type="radio" id="fem" name="sexo" class="radio-padrao" />
	<label for="fem" class="radio">Label pro Radio Feminino</label>
	<input type="radio" id="mas" name="sexo" class="radio-padrao" />
	<label for="mas" class="radio">Label pro Radio Masculino</label>
*/
// Imprescindível o uso de FOR no Label, ID e NAME nos Radios
function radioFake(){
    $('.radio-padrao').each(function(){
        $(this).css({display: 'none'});
        var idRadio = $(this).attr('id')
        // Seta o Radio Button Feminino ativo.
        // Caso exista algum outro tipo de Radio Button que precise inciar marcado, adicionar.
// VERSÃO ANTIGA        //if( $(this).attr('id') == "fem" || $(this).attr('id') == "cartao" || $(this).attr('id') == "aniversario" || $(this).attr('id') == "casa" || $(this).attr('id') == "publica" || $(this).attr('id') == "sedex" ){
        if( $(this).attr('checked') ){
            $(this).before('<div class="radio-'+idRadio+'" lang="radio"><span class="radio-fake radio-ativo replace"></span></div>');
            $(this).appendTo('div.radio-'+idRadio);
            $(this).parent('div').next('label').appendTo('div.radio-'+idRadio);
            $(this).click();
        } else{
            $(this).before('<div class="radio-'+idRadio+'" lang="radio"><span class="radio-fake replace"></span></div>');
            $(this).appendTo('div.radio-'+idRadio);
            $(this).parent('div').next('label').appendTo('div.radio-'+idRadio);
        }

        $(this).prev('.radio-fake').click(function(){
            var labelFor = $(this).next().attr('id');
            var nameRadio = $('#'+labelFor).attr('name');
            $('input[name='+nameRadio+']').each(function(){
                $(this).prev('.radio-fake').removeClass('radio-ativo');
								kill_radio_checked();
            });
            $('input:radio#'+labelFor).prev('.radio-fake').addClass('radio-ativo');
//            $('input:radio#'+labelFor).click();
						$('input:radio#'+labelFor).trigger('click');
        });
    });
    $('label.radio').click(function(){
        var labelFor = $(this).attr('for');
        var nameRadio = $('#'+labelFor).attr('name');
        $('input[name='+nameRadio+']').each(function(){
            $(this).prev('.radio-fake').removeClass('radio-ativo');
        });
        $('input:radio#'+labelFor).prev('.radio-fake').addClass('radio-ativo');
        $('input:radio#'+labelFor).click();
    });
}

function kill_radio_checked(){
	$("input:radio").each(function(){
			if($(this).parent("div").attr("lang") == "radio"){
			if(!$(this).prev("span").hasClass("radio-ativo")){
				$(this).removeAttr("checked");
			}
		}
	});
}

// Exemplo
/*
	<input type="checkbox" id="checkbox" class="checkbox-padrao" />
	<label for="checkbox" class="checkbox">Label pro Checkbox</label>
*/
function checkboxFake(){
	$('.checkbox-padrao').each(function(){
		$(this).css({display:'none'});
		if( $(this).attr('checked') )
			$(this).before('<span class="checkbox-fake checkbox-ativo replace"></span>');
		else
			$(this).before('<span class="checkbox-fake replace"></span>');
		$(this).prev('.checkbox-fake').click(function(){
			if($(this).hasClass('checkbox-ativo')){
				$(this).next('.checkbox-fake').click();
				$(this).removeClass('checkbox-ativo');
				$(this).next("input:checkbox").removeAttr("checked");
			}else{
				$(this).next('.checkbox-fake').click();
				$(this).addClass('checkbox-ativo');
				$(this).next("input:checkbox").click();
			}
		});
	});
	$('label.checkbox').click(function(){
		var labelFor = $(this).attr('for');
		if( $('#'+labelFor).prev('.checkbox-fake').hasClass('checkbox-ativo') ){
			//$('#'+labelFor).click();
			$('#'+labelFor).prev().removeClass('checkbox-ativo');
		}else{
			//$('#'+labelFor).click();
			$('#'+labelFor).prev().addClass('checkbox-ativo');
		}
	});
}

// Exemplo
/*
	<input type="file" id="arquivo" name="arquivo" class="file-padrao" />
*/
function fileFake(){
	$('.file-padrao').each(function(){
		var input = $(this);
		var texto = '<div class="fundo-fake"><span class="content-campo-file"></span></div>\
			<a class="bt-fake replace" href="javascript:void(0)"></a>\
			<div class="clear"></div>';
		$(this).before('\
		<div class="file-content">\
		</div>');
		$(this).appendTo('.file-content');
		$(texto).appendTo('.file-content');

		// Pré-Inicializa o campo no caso do usuário dar F5
		var string = $('.file-padrao').attr('value');
		if(string.length >= caracteresFileFake){
            string = string.substring(0,caracteresFileFake)+"...";
        }
		$(this).next('.fundo-fake').children('.content-campo-file').text(string);
	});
    $('.file-padrao').change(function(){
        var str = $(this).val()
        if(str.length >= caracteresFileFake){
            str = str.substring(0,caracteresFileFake)+"...";
        }
        $(this).next('.fundo-fake').children('.content-campo-file').text(str);
    });
}

function select_fake_all(){
	/*controls*/
	var qtd_show = 6; //quantidades de itens exibidos
	var speed = 600;
	
	
	/* ****** */
	
	var id_atual;
	
	$('.combo-fake-top, .combo-fake-bottom').each(function(){
		var size_content = parseInt($(this).closest('.select_brand').css('width')) - parseInt($(this).prev().css('width'));
		$(this).css({
			'width': size_content
		});
	});
	$('.combo-itens').each(function(){
		$(this).css({
			'width': $(this).closest('.select_brand').css('width')
		});
	});

    $('.bt_Select').click(function(){
        $(this).parent().find('.combo-itens').slideDown();
    });
    $('.combo_content').mouseout(function(){
        $(this).mouseleave(function(){
            $(this).find('.combo-itens').slideUp();
        });
    });
    $('.itens_select li').click(function(){
        $(this).parent().closest('.combo_content').find('.selected_item').html($(this).html());
        id_atual = $(this).attr('id');
        $(this).closest('.combo-itens').slideUp();
    });
	

	/*scroll*/
	/*monta scroll */
	$('.combo_content').each(function(){
		altura_item = $(this).find('.area_scroll .itens_select li').css('height');
		altura_scroll = parseInt(altura_item)*qtd_show;
		qdt_scroll = parseInt(altura_item)*qtd_show;
		qtd_last_page = $(this).find('.area_scroll .itens_select li').size()%qtd_show;
		var slide_atual;
		
		//alert(qdt_scroll);
		
		
		$(this).find('.area_scroll').css({'height':altura_scroll});
		
		//prev button
		$(this).find('.carousel-prev').each(function(){
			$(this).click(function(){
					slide_atual = parseInt($(this).next().children('ul').css('margin-top'));
					
					$(this).next().children('ul').animate({'marginTop':slide_atual+qdt_scroll+'px'}, speed, function(){
						$(this).parent().next().show();
						if( '0' == parseInt($(this).css('margin-top')) ){
							$(this).parent().prev().hide();
						}
					});	
			});
		});
		
		//next button
		$(this).find('.carousel-next').each(function(){
			$(this).click(function(){
					var max_down = -(parseInt($(this).closest('.combo_content').find('.area_scroll .itens_select').css('height'))-parseInt(altura_item)*qtd_last_page);
					slide_atual = parseInt($(this).prev().children('ul').css('margin-top'));
					
					$(this).prev().children('ul').animate({'marginTop':slide_atual-qdt_scroll+'px'}, speed, function(){
						$(this).parent().prev().show();
						
						if( max_down >= parseInt($(this).css('margin-top')) ){
							$(this).parent().next().hide();
						}
						
						
					});	
					
					
					
			});
		});
	});
	/*monta scroll / end */
	
	/*next page*/
	
	/*next page / end*/
	
}