var status = 1;
var currentLevel = 1;

$(function(){	
	$('.scroll-pane').jScrollPane();
	
	/* ajusto el height del sidebar on resize */
	/* 40px : padding de content */
	/* 60px : height del footer */
	$(window).resize(function(){
		var h = window.innerHeight - 40 - 60;
		//console.log(window.innerHeight);
		$('div.sidebar').css('height', h);
		$('div.sidebar .level1').css('height', h);
		$('div.sidebar .level2').css('height', h);
		$('body.under a.email img').css('top', h);
		$('.scroll-pane').jScrollPane(); // que ajuste el scroll (si existe) del level1
	}).resize();
	
	$('.level1 .toggle').live('click', function(){
		toggleSidebar();
	});
	
	Menu.setup();
	Contact.setup();
	Footer.setup();
	
	// level 2 hidden by default
	$('.level2').css({paddingLeft:0, paddingRight:0, width:1});
	$('.sidebar .menu').css({paddingLeft:299});
	
	/* WORKS */
	// cargo la ficha del trabajo en level2
	$('.works li a').live('click', function(e){
		var controller = $('.works').attr('data-controller');
		e.preventDefault();
		var id = $(this).attr('data-id');
		$.ajax({
		  url: APP.baseurl+controller+'/view/'+id,
		  success: function(data) {	
				$('.level2 .content').fadeTo(200, 0.1, function(){
					$('.level2 .content').html(data);
					$('.scroll-pane').jScrollPane();
					$('.level2 .content').fadeTo(200,1);
				});				
		  }
		});
	});
	// on change: select de categorias
	$('.categories select').live('change', function(e){
		e.preventDefault();
		var id = $(this).val();
		$.ajax({
		  url: APP.baseurl+'works/findByCategory/'+id,
		  success: function(data) {
		    $('.level1 .wrapper .works').html(data);
		  }
		});
	});
});

var Footer = {
	setup:function(){
		// Modal de Aviso Legal
		$('#footer .aviso').click(function(e){
			e.preventDefault();
			$.ajax({
				url: APP.baseurl+'pages/aviso_legal',
				success: function(data) {
					$('#modal').html(data).modal({
						minWidth:500,
						minHeight:400,
						overlayClose:true
					});
					$('.scroll-pane').jScrollPane();
				}
			});
		});
		// Contact shortcut
		$('#footer a.contact').click(function(){
			$('.menu li a[data-sec=contacto]').click();
		});
	}
};

var apis = [];

var Menu = {
	setup:function(){
		$('.sidebar .menu a').click(function(e){
			
			// get a reference of scroll-pane API
			$('.level1 .scroll-pane').each(
				function()
				{
					apis.push($(this).jScrollPane().data().jsp);
				}
			);
			
			$('.paginator').hide(); // hide paginador por defecto
			e.preventDefault();
			
			var sec = $(this).attr('data-sec');
			toggleLevel(sec);
			if (status == 0) toggleSidebar();
			// url correspondiente de la seccion
			switch(sec) {
				case 'nuestro_trabajo':
				var url =  APP.baseurl+'works/index';
				break;
				case 'nos_gusta':
				var url =  APP.baseurl+'inspirations/index';
				break;
				default:
				var url =  APP.baseurl+'pages/'+sec;
			}
			// le pongo clase "active" al li
			$('.sidebar .menu li').removeClass('active');
			$(this).parent().addClass('active');
			
			// cargo el view por AJAX
			$.ajax({
			  url: url,
			  success: function(data) {
				
				// Solo estas 2 secciones usan scroll:
				if (sec == 'nos_gusta' || sec == 'nuestro_trabajo') {
					$('.level1 .content').addClass('scroll-pane');
				} else {			
					// remove scrollpane containers...		
					if (apis.length) {
						$.each(
							apis,
							function(i) {
								this.destroy();
							}
						)
						apis = [];
					}
					$('.level1 .content').removeClass('scroll-pane').css('overflow', 'hidden');
				}
				
				// Fade IN-OUT
				$('.level1 .wrapper').fadeTo(200, 0.01, function(){				
					$('.level1 .wrapper').html(data);
					$('.level1 .scroll-pane').jScrollPane();
					$('.level1 .wrapper').fadeTo(200, 1);
				});
			  }
			});
		});
	}
};
var Contact = {
	setup: function() {
		$('.level1 .form form').live('submit', function(e){
			e.preventDefault();
			$(this).ajaxSubmit({
				target:'.level1 .content .form'
			});
		});
	}
};

var Works = {
	
	picIndex:0,
	totalPics:0,
	state:'normal',
	
	setup:function() {

		$('.paginator').show();
		$('.paginator').children('[class!=center]').each(function(){ $(this).hide(); }); // hide flechitas

		Works.totalPics = $('.rutas li').length;

		$('.paginator .center a').unbind('click'); // reset old handlers
		$('.paginator .center a').click(function(){
			Works.toggleView();
		});

		if (Works.totalPics > 1) {
			// show flechitas
			$('.paginator').children().each(function(){ $(this).show(); });
			/* activo las flechitas */
			$('.paginator .next').click(function(){
				Works.picIndex = (Works.picIndex + 1 < Works.totalPics) ? Works.picIndex+1 : 0;
				Works.loadPic();
			});
			$('.paginator .prev').click(function(){
				Works.picIndex = (Works.picIndex - 1 >= 0) ? Works.picIndex-1 : Works.totalPics-1;
				Works.loadPic();
			});
		} else {
			/* desactivo esos botones */
			$('.paginator .next').unbind('click');
			$('.paginator .prev').unbind('click');
		}

		Works.loadPic();
	},
	
	loadPic:function() {
		//console.log('loadPic');
		var ruta = $('.rutas li').eq(Works.picIndex).html();
		$.backstretch(APP.baseurl+ruta, {speed:200});
	},
	
	toggleView:function(){
		if (Works.state == 'normal') {
			// set fullscreen
			$('.sidebar').animate({width:660, opacity:0}, 600, 'easeOutExpo');
			$('.paginator').animate({left:'50%', marginLeft:'-85px'}, 600, 'easeOutExpo');
			$('.paginator .center a').html(APP.locale.ver_menus);
			Works.state = 'fullscreen';
		} else {
			// set normal
			$('.sidebar').animate({paddingLeft:0, opacity:1}, 600, 'easeOutExpo');
			$('.paginator').animate({left:20, marginLeft:0}, 600, 'easeOutExpo');
			$('.paginator .center a').html(APP.locale.ver_completa);
			Works.state = 'normal';
		}
	}
	
};

function toggleLevel(sec) {
	if (sec == 'nos_gusta' || sec == 'nuestro_trabajo') {
		// show level 2
		if (currentLevel == 1) {
			$('.level2').animate({width:'260px', paddingLeft:20, paddingRight:20}, 600, 'easeOutExpo');
			$('.sidebar .menu').animate({paddingLeft:0}, 600, 'easeOutExpo');
			currentLevel = 2;
		}
		$('.level2 .content').html('').each(function(){ $(this).show(); });
		$('.level1').animate({right:300}, 600, 'easeOutExpo');
	} else {
		// hide lvl 2
		if (currentLevel == 2) {
			$('.level2 .content').each(function(){ $(this).hide(); });
			$('.level2').animate({width:1, paddingLeft:0, paddingRight:0}, 600, 'easeOutExpo');
			$('.sidebar .menu').animate({paddingLeft:'299px'}, 600, 'easeOutExpo');
			currentLevel = 1;
		}
		$('.level1').animate({right:1}, 600, 'easeOutExpo');
	}
	$('ul.rutas').hide();
}

function toggleSidebar() {
	//console.log(status);
	if (status == 1) {
		// OFF	
		// level1:
		$('.level1 .content').css('width', 1);
		
		$('.level1 .content').children('[class!="toggle"]').each(function(){ $(this).hide(); });	
		$('.level1').find('.toggle').html('<');
		$('.level1').animate({ right:1, width:'10px' }, 600, 'easeOutExpo');
		// level2:
		$('.level2 .content').children().each(function(){ $(this).hide(); });
		$('.level2').animate({ width:1, paddingLeft:0, paddingRight:0 }, 600, 'easeOutExpo');
		// menu
		$('.sidebar .menu').animate({ paddingLeft:'469px' }, 600, 'easeOutExpo');
	} else {
		// ON
		// show level 1
		
		$('.level1 .content').css('width', 180);
		var w=1;
		if (currentLevel==2) {
			w=300;
			// show level 2
			$('.level2 .content').children().each(function(){ $(this).show(); });
			$('.level2').animate({ width:'260px', paddingLeft:20, paddingRight:20 }, 600, 'easeOutExpo');
			$('.sidebar .menu').animate({ paddingLeft:0 }, 600, 'easeOutExpo');
		} else {
			$('.sidebar .menu').animate({ paddingLeft:299 }, 600, 'easeOutExpo');
		}
		
		$('.level1 .content').children('[class!="toggle"]').each(function(){ $(this).show(); });	
		$('.level1').find('.toggle').html(APP.locale.ocultar);
		$('.level1').animate({ right:w, width:'180px' }, 600, 'easeOutExpo');
		$('.level1 .scroll-pane').css('width', 180);
	}	
	status = (status == 1 ? 0 : 1);
	$('ul.rutas').hide();
}
