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



// Select Fake

var tamanhoBorda = 5; // 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)



// File Fake

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



function selectFakePrincipal(){

	$('.select-padrao').each(function(){

		var valorInicial  = $(this).children('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-principal" 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-principal').children('.select-fake').html(string);

		});

		var str = $(this).children('option:selected').text();

		$(this).parent('.select-content-principal').children('.select-fake').html(str);

	});

}



function selectFake(){

	$('.select-padrao2').each(function(){

		var valorInicial  = $(this).find('option:first-child').html();

		var selectContent = parseInt($(this).css('width'));

		var largura = selectContent - tamanhoBorda;

		$(this).addClass('select-hide2');

		$(this).before('<div class="select-content" style="width:'+selectContent+'px"><div class="borda-left2"></div><div class="select-fake2" 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).prev('div').prev('.select-content').children('.select-fake2').html(string);

			$(this).parent('div').find('.select-fake2').html(string);

		});

		var string = $(this).children('option:selected').text();

		$(this).parent('div').find('.select-fake2').html(string);

	});

}



// 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');

			});

			$('input:radio#'+labelFor).prev('.radio-fake').addClass('radio-ativo');

			$('input:radio#'+labelFor).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();

	});

}



// Exemplo

/*

	<input type="checkbox" id="checkbox" class="checkbox-padrao" />

	<label for="checkbox" class="checkbox">Label pro Checkbox</label>

*/

function checkboxFake(){

	$('.checkbox-padrao').each(function(){

		if( $(this).attr('checked') )

			$(this).before('<span class="checkbox-fake checkbox-ativo replace"></span>');

		else

			$(this).before('<span class="checkbox-fake replace"></span>');

			

		$(this).css({display:'none'});

		$(this).prev('.checkbox-fake').click(function(){

			if($(this).hasClass('checkbox-ativo')){

				$(this).next('.checkbox-padrao').click();

				$(this).removeClass('checkbox-ativo');

			}else{

				$(this).next('.checkbox-padrao').click();

				$(this).addClass('checkbox-ativo');

			}

		});

	});

	$('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');

		}

	});

}



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');

	});

    $('.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);

    });

}