var numeroSecciones = 14;
var seccionActual = 1;
var secciones = new Array();
var debug = 0;

function cargarPagina() {
	$('body').append('<div id="vista"></div>');
	//$('body').append('<div style="top:0px;left:0px;position:fixed;width:40px;height:20px;background-color:#ff0000;z-index:99999;"><a href="javascript:alert(debug);">debug</a></div>');
	crearMenu();
	crearSocialBox();
	crearContenedores();
	crearLogo();
	crearSecciones();
	redimensionarVista();
}

function crearSecciones() {
	secciones[1] = new seccionHome('seccion_1');
	secciones[4] = new seccionQuienesSomos('seccion_4');
	secciones[7] = new seccionServicios('seccion_7');
	secciones[10] = new seccionPortfolio('seccion_10');
	secciones[13] = new seccionContacto('seccion_13');

	for(x = 1; x <= secciones.length; x++) {
		if(isObject(secciones[x])) {
			secciones[x].crear();
		}
	}
}

function redimensionarVista() {
	var x = 1;
	var marginTop = 80;
	var marginLeft = parseInt(getPageWidth()*0.1);
	debug++;

	$('#vista').css({'width' : getPageWidth()+'px', 'height' : getPageHeight()+'px'});

	$('#socialBox').css('top', parseInt((getPageHeight()-parseInt($('#socialBox').css('height')))/2)+'px');

	$('.seccion_fondo').css({'width' : getPageWidth()+'px', 'height' : getPageHeight()+'px'});
	$('.seccion_contenido').css({'width' : (getPageWidth()-(2*marginLeft))+'px', 'height' : (getPageHeight()-(2*marginTop))+'px', 'margin-left' : marginLeft+'px', 'margin-top' : marginTop+'px'});

	for(x = 1; x <= secciones.length; x++) {
		if(isObject(secciones[x])) {
			secciones[x].redimensionar();
		}
	}

	cambiarTamanyos();
	verSeccion(seccionActual);
}

function crearLogo() {
	$('body').append('<div id="logo"><img src="imagenes/logos/blanco.png" /></div>');
}

function cambiarTamanyos() {
	var pixels = getPageWidth()*getPageHeight();
	/*
	Grupo grande
		1920x1080 = 2073600
		1680x1050 = 1764000
	Grupo mediano
		1440x900 = 1296000
		1280x1024 = 1310720
		1366x768 = 1049088
		1280x800 = 1024000
	Grupo pequeño
		1024x768 = 786432
	*/
	if(pixels > 0 && pixels <= 786432) {
		$('.size1').css('font-size', '10px').css('line-height', '10px');
		$('.size2').css('font-size', '12px').css('line-height', '14px');
		$('.size3').css('font-size', '18px').css('line-height', '20px');
		$('.size4').css('font-size', '24px').css('line-height', '26px');
		$('.size5').css('font-size', '32px').css('line-height', '34px');
	} else if(pixels > 786432 && pixels <= 1296000) {
		$('.size1').css('font-size', '12px').css('line-height', '14px');
		$('.size2').css('font-size', '14px').css('line-height', '16px');
		$('.size3').css('font-size', '20px').css('line-height', '22px');
		$('.size4').css('font-size', '30px').css('line-height', '32px');
		$('.size5').css('font-size', '40px').css('line-height', '42px');
	} else  {
		$('.size1').css('font-size', '14px').css('line-height', '16px');
		$('.size2').css('font-size', '18px').css('line-height', '20px');
		$('.size3').css('font-size', '26px').css('line-height', '28px');
		$('.size4').css('font-size', '32px').css('line-height', '34px');
		$('.size5').css('font-size', '50px').css('line-height', '52px');
	}
}

function crearSocialBox() {
	$('body').append('<div id="socialBox"></div>');
	$('#socialBox').append('<ul class="socialButton"><li class="facebook"><div><span><iframe src="http://www.facebook.com/plugins/like.php?app_id=134496623306432&amp;href=http%3A%2F%2Fwww.facebook.com%2Fpages%2Fuebdisain%2F227450940605820&amp;send=false&amp;layout=box_count&amp;width=100&amp;show_faces=true&amp;action=like&amp;colorscheme=light&amp;font=segoe+ui&amp;height=90" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:100px; height:90px;" allowTransparency="true"></iframe></span></div></li></ul>');
	//$('#socialBox').append('<ul class="socialButton"><li class="twitter"><div><span><a href="http://twitter.com/uebdisain" class="twitter-follow-button" data-show-count="false" data-lang="es">Follow @uebdisain</a><script src="http://platform.twitter.com/widgets.js" type="text/javascript"></script></span></div></li></ul>');
    var d=300;
    $('ul.socialButton div').each(function(){
        $(this).stop().animate({
				'marginRight':'-130px'
        },d+=150);
    });

    $('ul.socialButton > li').hover(
		function () {
			$('div',$(this)).stop().animate({
				'marginRight':'-10px'
			}, d);
		},
		function () {
			$('div',$(this)).stop().animate({
				'marginRight':'-130px'
			}, d);
		}
	);
}

function crearMenu() {
	$('body').append('<ul id="menu" class="white"></ul>');
	$('#menu').append('<li class="home"><a href="#home" onclick="javascript:verSeccion(1);" class="active"><span>Home</span></a></li>');
	$('#menu').append('<li class="quienes_somos"><a href="#quienes-somos" onclick="javascript:verSeccion(4);"><span>Quienes Somos</span></a></li>');
	$('#menu').append('<li class="servicios"><a href="#servicios" onclick="javascript:verSeccion(7);"><span>Servicios</span></a></li>');
	$('#menu').append('<li class="portfolio"><a href="#portfolio" onclick="javascript:verSeccion(10);"><span>Portfolio</span></a></li>');
	$('#menu').append('<li class="contacto"><a href="#contacto" onclick="javascript:verSeccion(13);"><span>Contacto</span></a></li>');
    var d=300;
    $('#menu a').each(function(){
        $(this).stop().animate({
            'marginTop':'-80px'
        },d+=150);
    });

    $('#menu > li').hover(
		function () {
			$('a',$(this)).stop().animate({
				'marginTop':'-2px'
			},200);
		},
		function () {
			$('a',$(this)).stop().animate({
				'marginTop':'-80px'
			},200);
		}
	).click(function(){
		$('#menu > li > a').removeClass('active');
		$('a', this).addClass('active');
	});
}

function crearContenedores() {
	var x = 1;

	for(x = 1; x <= numeroSecciones; x++) {
		$('#vista').append('<div id="seccion_'+x+'" class="seccion"></div>');
		$('#seccion_'+x).append('<div class="seccion_contenido"></div>');
		$('#seccion_'+x).append('<div class="seccion_fondo"><img src="imagenes/fondo/'+x+'.jpg" title=""/></div>');
	}
}

function verSeccion(seccion) {
	var pos = parseInt(seccion) - 1;
	var diferencia = 1;

	if(parseInt(seccion) > seccionActual) {
		diferencia = parseInt(seccion) - seccionActual;
	} else {
		diferencia = seccionActual - parseInt(seccion);
	}

	for(x = 1; x <= secciones.length; x++) {
		if(isObject(secciones[x])) {
			secciones[x].ocultar();
		}
	}

	diferencia = Math.max(diferencia, 4);

	//Depuracion
	//diferencia = 1;

	seccionActual = parseInt(seccion);

	//$('#logo').effect('bounce', {}, 300);

	var effect = 'easeInOutSine';
	var duration = 250;
	$('#vista').stop().animate({ 'marginTop': '-'+(pos*getPageHeight())+'px' }, diferencia*duration, effect, function() {
		if(isObject(secciones[seccionActual])) {
			secciones[seccionActual].mostrar();
		}
	});
}