include('css/main.css');
var carroJson;
var productosJson;

$(document).ready(
	function() {
		trace('main-ui');
		if($.cookie('carro')!=null){
			carroJson = parsearJSON($.cookie('carro'));
		}else{
			carroJson = {'Productos':[]};
		}
		mainInit();

		/*//LOAD LANGUAGE
		geti18nLang(function(json){
			var languages='';
			for(var i=0;i < json.list.length;i++){
				var abrev=json.list[i].abrev;
				languages+=(languages==''?'':',')+abrev
				//setea diccionario de idioma actual
				if(abrev==getSession('lang')){
					geti18nClaves(function(json){
						//alert(html);
						setDic(json);
						i18n($('body'));
						mainInit();
						pintarBotonesLang();						
					});
				}
				setSession('languages',languages);
				dumpSession();
			}
		});	*/
	}
);

function mainInit(){
	$('body').show();
	trace('init-history-tracker');
	initHistoryTracker(function(hash){
		if(!$.browser.msie && !$.browser.mozilla) ;
		
		if($.browser.msie) { 
			hash = encodeURIComponent(hash); 
		} 
		contentLoader(hash);
		}
	);
	
	
	/*$('#bt_'+seccion_actual).addClass('btn-selected');	
	$('#bt_'+seccion_actual).animate({
		paddingTop: 112,	
		height:30			 
	  }, 500, function() {
		// Animation complete.
	});*/
	$('.btn-header').hover(
		function() {
			if($(this).attr('class').indexOf('btn-selected')==-1){
				$(this).stop().animate({
					paddingTop: 112,	
					height:30			 
				  }, 500, function() {
					// Animation complete.
				});
			}
		},
		function() {	
			if($(this).attr('class').indexOf('btn-selected')==-1){
				$(this).stop().animate({
					paddingTop:5,	
					height:137			 
				}, 500, function() {
					// Animation complete.
				});
			}
		}
	);
	actualizarCarro();
	pintarCategorias();
	pintarLogos();
	if (getSession('logged')=='null' || getSession('logged')==undefined || getSession('usuario')=='null' || getSession('usuario')==undefined){
		logOut();
	}else{
		doLogin();
	}
}

function pintarBotonesLang(){
	//pinta botones de switch de lenguaje
	var langs=getSession('languages').split(',');
	if(langs.length<2) return;
	var html='';
	for(var i=langs.length-1;i > -1;i--){
		//html+='<div class="lang-item" onclick="setLang(\''+langs[i]+'\');\">'+langs[i].toUpperCase()+'</div>';
		html+='<div class="lang-item" onclick="setLang(\''+langs[i]+'\');\">'+i18n('cms_lang_'+langs[i].toLowerCase())+'</div>';
	}
	escribir($('.lang-container'),html);
}


// PINTADO DE CATEGORIAS
function pintarCategorias(){
	getCategorias(function(json){
		escribir($('#categorias_nav'),'');
		var html='';
		for(var i=0; i<json.list.length; i++){
			html+='<div class="list-categoria" align="left" id="'+json.list[i].id+'" onClick="selBtn(\'bt_productos\'); gotoHref(\'productos?id='+json.list[i].id+'\&categoria='+json.list[i].categoria+'\')">'+json.list[i].categoria+'</div>';
		}
		escribir($('#categorias_nav'),html);
	});
}

// PINTADO DE LOGOS
function pintarLogos(){	
	//Carousel INIT PAGE
	var html='';	
	for(var i=1; i < 11; i++){
		html+='<li >\n';
		html+='    <img id="'+i+'" src="images/sponsors/'+i+'.png" />\n';		
		html+='</li>\n';
	}
	
	escribir($('#main_banner'), html);
	$('#main_banner').jcarousel({
		//wrap: 'circular',
		wrap: 'last',
        scroll: 1,
        auto:3
    });	
}


//CONTROL DE SECCIONES
function contentLoader(key){
	try{
		//alert(key)
		trace('content-loader-'+key);
		url_actual=key;

		if(no_load){
			no_load=false;
			return;
		}		
		
		key = (key=='')?'home':key; //global variable
		
		if(unescape(key).indexOf('?')>-1){
			name_contentloader=unescape(key).substring(0,unescape(key).indexOf('?'));
		}else{
			name_contentloader=unescape(key);
		} 
		var name=name_contentloader;
		seccion_actual=name;

		//validación de permisos en session
				
		$('#main_content').hide();

		resetScripts();
		
		$('#main_menu').find('a').each(
		function(){	
			if($(this).attr('href')=='#'+key){
				$(this).attr('class','item2');
			}else{
				$(this).attr('class','item');
			}
		});
		$('#main_menu .sub-menu').find('a').each(
				function(){	
					$(this).attr('class','sub-item');				
				});
		
		
		$('#main_content').load('./includes/'+name+'.php',loadSuccess);
		pageTracker._trackPageview(name);	
		
		
		
		
	}catch(err){
		errorMsg(err,arguments);
		return null;
	}
}

function loadSuccess(){
	try{
		var name=name_contentloader;
		trace('loadSuccess-'+name);
		$('#inicio').hide();
		$('#main').show();
		//i18n($('#main_content'));
		//includes dependientes entre si
		$.include('js/'+name+'/'+name+'-ui.js#',
		[
		 	$.include('js/'+name+'/'+name+'-com.js#')
		]);

		$('head').append('<link href="'+'css/'+name+'/'+name+'.css#'+'" rel="stylesheet" type="text/css" />');
		
		//PRELOAD PARA SECCIONES OPCIONAL CON TIMEOUT
		//la segunda opcion es poner la fun que se ejecuta en el timeout dentro de cada
		//seccion para que determinar la carga completa
		/*$('#main_content_preload').show();
		$('#main_content').hide();
		setTimeout( function(){
				$('#main_content').show();
				$('#main_content_preload').hide();			
			}, 2000);*/
		
		$('#main_content').fadeIn(2000);
		//inicializa links q puede haber en el contenido
		$('#main_content').find("*[rel='history']").click(function(){
	        $.history.load(this.href.replace(/^.*#/, ''));
	        return false;
	    });
		$('#main_content').find("*[rel='history']").each(function(){
	    	$(this).removeAttr("rel");
	    });
		selBtn($('#bt_'+seccion_actual));
		$('#nav').show();
	}catch(err){
		errorMsg(err,arguments);
		return null;
	}
}

function getContact(){
	
	// Formulario
	
	var html= '<div class="main-modulo-mail-content" id="">';
		html+=	'<br>';
		html+=	'<div class="" id="">';
		html+=		'<span class="main-titulo-input">';
		html+=			'<object class="i18n">consejero_ingresar_nombre</object> <span class="texto-rojo">*</span>';
		html+=		'</span></span><br>';
		html+=		'<span class="texto-azul-light"><input id="contacto_nombre" class="main-input-largo" type="text" size="20" ></span><br>';
		html+=		'<div class="separator-10px"></div>';
		html+=		'<span class="main-titulo-input">';
		html+=			'<object class="i18n">registro_input_email</object>: <span class="texto-rojo">*</span>';
		html+=		'</span></span><br>';
		html+=		'<span class="texto-azul-light"><input id="contacto_email" class="main-input-largo" type="text" size="20" ></span><br>';
		html+=		'<div class="separator-10px"></div>';
		html+=		'<span class="main-titulo-input">';
		html+=			'<object class="i18n">registro_input_pueblo</object>:';
		html+=		'</span></span><br>';
		html+=		'<span class="texto-azul-light"><input id="contacto_pueblo" class="main-input-largo" type="text" size="20" ></span><br>';
		html+=		'<div class="separator-10px"></div>';
		html+=		'<span class="main-titulo-input">';
		html+=			'<object class="i18n">registro_input_pais</object>:';
		html+=		'</span></span><br>';
		html+=		'<span class="texto-azul-light"><input id="contacto_pais" class="main-input-largo" type="text" size="20" ></span><br>';
		html+=		'<div class="separator-10px"></div>';
		html+=		'<span class="main-titulo-input">';
		html+=			'<object class="i18n">enviarmensaje_mensaje</object>: <span class="texto-rojo">*</span>';
		html+=		'</span><br>';
		html+=		'<span class="texto-azul-light"><textarea id="contacto_mensaje" class="main-input-mensaje"></textarea></span><br>';
		html+=		'<input name="tipoUsuario" type="radio" value="alumno" id="alumno"/><span class="main-titulo-radiobutton"><object class="i18n">registro_input_alumno</object></span><input name="tipoUsuario" type="radio" value="maestro" id="maestro" /><span class="main-titulo-radiobutton"><object class="i18n">registro_input_maestro</object></span><input name="tipoUsuario" type="radio" value="otro" id="otro" checked /><span class="main-titulo-radiobutton"><object class="i18n">registro_input_otro</object></span><br><br>';
		html+=		'<div class="main-enviar" align="center" onClick="enviarFormulario(this);">';
		html+=			'<object class="i18n">enviarmensaje_enviar</object>';
		html+=		'</div>';
		html+=	'  </div>';
		html+=	'</div>';
		html+=	'<div class="info-contacto" id="info_contacto">';
		html+=  '</div>';

		getModalContent('Formulario de contacto', 880, 500, html,null);	
		
		
		// Texto de ayuda
		
		ti18n(getSession('paisId'), 'contacto_txt_ppal', function(json){escribir($('#info_contacto'), json.filas[0].valor);});
}

function enviarFormulario(e){
	var jsonDatos='{"campos":['+
		'{"nombre":"Nombre y Apellido","campo":"contacto_nombre","validacion":"B"},'+
		'{"nombre":"Mensaje","campo":"contacto_mensaje","validacion":"B"},'+
		'{"nombre":"E-Mail","campo":"contacto_email","validacion":"BE"},'+		
		']}';
	jsonDatos=eval('('+jsonDatos+')');
	if(validar(jsonDatos, e)){
		var mailPais = i18n('mail_contacto_pais');
		enviarFormularioContacto($('#contacto_pais').val(), $('#contacto_nombre').val(), $('#contacto_email').val(), $('#contacto_pueblo').val(), $('#contacto_mensaje').val(), mailPais, $("input[name='tipoUsuario']:checked").val());
		MSG('alert',i18n('mensajes_titulo_ventana'),i18n('mensajes_ventana_enviado'),null,null);
		$("#dialog_modal_content").remove();
	}	
}


function selBtn(el){
	if(el=='bt_productos') el=$('#bt_productos');
	$('.btn-header').removeClass('btn-selected');
	$('.btn-header').stop().animate({
		paddingTop:5,	
		height:137			 
	}, 500, function() {
		// Animation complete.
	});
	$(el).stop().animate({
		paddingTop: 112,	
		height:30			 
	}, 500, function() {
		// Animation complete.
	});

	$(el).addClass('btn-selected');	
}

function setDragDrop(){
	// Setea dragg y dropp
	$(".list-producto").draggable({
		appendTo: "body",
		cursor: "move",
		scroll: false,
		distance: 20,
		opacity: 0.6,
		helper: "clone",
		start: function(event, ui){
			$('body').attr('unselectable', 'on');
			$('#carro_content').hide();
			$('#carro_mensaje').show();
			var scrollPos = 0;
			if(window.pageYOffset){
				scrollPos = window.pageYOffset;
			 }
			 else {
				scrollPos =  Math.max(document.body.scrollTop,document.documentElement.scrollTop);
			 }
			if(scrollPos>300){
				$('#carro').addClass('siempreVisible');
				$('#carro').css('top', (scrollPos+5)+'px');
			}
		},
		stop: function(event, ui){
			$('body').attr('unselectable', 'off');
			$('#carro_content').show();
			$('#carro_mensaje').hide();
			$('#carro').removeClass('siempreVisible');
		}
	});
	$( "#carro" ).droppable({
		activeClass: "ui-state-default",
		hoverClass: "ui-state-hover",
		accept: ":not(.ui-sortable-helper)",
		drop: function( event, ui ) {
			$( this ).find( ".placeholder" ).remove();
			addCarro(ui.draggable);
		}
	});
	$(".list-producto").each(function() {
      this.onselectstart = function() { return false; };
    });
	$("img").each(function() {
      this.onselectstart = function() { return false; };
    });
}


// FUNCIONES CARRO
function addCarro(divContainer){
	var bandera = false;
	var banderaId;
	for(var i=0; i<carroJson.Productos.length; i++){
		if(carroJson.Productos[i].id == divContainer.attr('id') && carroJson.Productos[i].color == divContainer.find('#list-producto-color :selected').val()){
			bandera = true;
			
			var valorCantidad = (carroJson.Productos[i].cantidad*1)+(divContainer.find('#cantidad').val()*1);
			if(valorCantidad<=0) valorCantidad=1
			carroJson.Productos[i].cantidad = valorCantidad;
		}
	}
		
	if(bandera==false){
		carroJson.Productos.push(parsearJSON('{"id":"'+divContainer.attr('id')+'", "producto":"'+divContainer.find('.list-producto-titulo').text()+'", "color":"'+divContainer.find('#list-producto-color :selected').val()+'", "cantidad":"'+divContainer.find('#cantidad').val()+'"}'));
	}
	actualizarCarro();
	divContainer.find('#cantidad').val('1');
}

function addNoDrag(productoId){
	$('body #main_content').find('#'+productoId).effect("transfer", { to: $("#carro"), className: "ui-effects-transfer", easeFunc: "easeInCubic"}, 600);

	addCarro($('#main_content').find('#'+productoId));
	
}

function actualizarCarro(){
	//alert(JSONtoString(carroJson.Productos));
	$.cookie('carro',JSONtoString(carroJson), { expires: 7 });
	
	var n = 0;
	for (var i=0; i<carroJson.Productos.length; i++){
		n += 1 * carroJson.Productos[i].cantidad;
	}
	escribir($('.carro-cantidad'), n);

}


function verDetalleCarro(){
	
	if(carroJson.Productos.length==0){
		MSG('alert','Alerta','No hay productos en su carro',null,null);
	}else{
		var pts=0;
		var html='';
		html+='<div style="width:100%; padding-bottom:5px; max-height:540px; overflow:auto;" id="contenedor_detalle_carro">';
		for (var i=0; i<carroJson.Productos.length; i++){
			html+='<div class="list-carro-productos elemento_'+i+'"  id="'+carroJson.Productos[i].id+'">';
			html+='	<div class="list-carro-productos-left" align="left">';
			html+='		<div class="list-carro-img"><img class="list-producto-imagen" src="images/productos/'+carroJson.Productos[i].id+'.jpg" style="width:80px; height:60px;"\></div>';
			html+='		<div class="list-carro-descripcion"><span id="titulo" style="font-size:16px; font-weight:800;">'+carroJson.Productos[i].producto+'</span></div>';
			html+='		<div class="list-carro-color"><span id="titulo" style="color:#666;">Color seleccionado: '+carroJson.Productos[i].color+'</span></div>';
			html+='		<div class="list-carro-color"><span id="titulo" style="color:#666;">Cantidad: <input style="width:40px;" id="cantidad" value="'+carroJson.Productos[i].cantidad+'" onkeypress="validateInput(event);" onBlur="updateCantidad(this,\''+carroJson.Productos[i].id+'\',\''+carroJson.Productos[i].color+'\');"/></div>';
			html+='	</div>';
			html+='	<div class="list-carro-productos-right" align="right">';
			html+='		<div class="list-carro-delete" align="center" onClick="eliminarProducto('+i+',\''+carroJson.Productos[i].id+'\',\''+carroJson.Productos[i].color+'\');" title="Eliminar">X</div>';
			html+='	</div>';
			html+='</div>';
		}
		html+='</div>';
		getModalContent('Canasta', 520, 'auto', html);
		
	}
}

function updateCantidad(el, idProducto, color){
	for(var i=0; i<carroJson.Productos.length; i++){
		if(carroJson.Productos[i].id == idProducto && carroJson.Productos[i].color == color){
			var valorCantidad = $(el).val();
			if(valorCantidad<=0) valorCantidad=1
			carroJson.Productos[i].cantidad = valorCantidad;
			actualizarCarro();
		}
	}
}

function eliminarProducto(el, productoId, color){

	for(var i=0; i<carroJson.Productos.length; i++){
		if(carroJson.Productos[i].id == productoId && carroJson.Productos[i].color == color){
			carroJson.Productos.splice(i,1);
		}
	}
	
	$('.elemento_'+el).remove();
	if(carroJson.Productos.length==0){
		destroyModal();
		MSG('alert','Alerta','No hay productos en su carro',null,null);
	}
	actualizarCarro();
}

function validateInput(evt) {
  var theEvent = evt || window.event;
  var key = theEvent.keyCode || theEvent.which;
  key = String.fromCharCode( key );
  var regex = /[0-9]|\./;
  if( !regex.test(key) ) {
    theEvent.returnValue = false;
    if(theEvent.preventDefault) theEvent.preventDefault();
  }
}

function enviarPedido(){
	
	if (getSession('logged')=='null' || getSession('logged')==undefined){
		MSG('alert','Alerta','Para enviar pedidos debes estar registrado.',null,null);
	}else{		
		if(carroJson.Productos.length==0){
			MSG('alert','Alerta','Su carro de pedidos se encuentra vacio.',null,null);
		}else{
			//INSERTA EN DB
			var date = new Date();
			var day = padL(date.getDate(),'0',2);
			var month = padL((date.getMonth()+1),'0',2);
			var year = date.getFullYear();
			
			var fecha = day + '/' + month +'/'+year;
			var url='./src/controller/carro.php';
			for (var i=0; i<carroJson.Productos.length; i++){
				var valores ='"accion":"ins",';	
				valores +='"values":"\"'+carroJson.Productos[i].id+'\",\"'+carroJson.Productos[i].cantidad+'\",\"'+getSession('usuarioId')+'\",\"'+fecha+'\",\"'+escape(carroJson.Productos[i].color)+'\",\"'+escape(carroJson.Productos[i].producto)+'\",\"pendiente\""';
				
				valores='_p='+encode(escape('{'+valores+'}'));
				$.ajax({
				url: url,
				data: valores
				});
			}
			
			// ENVIA MAIL DE PEDIDO
			var mensaje ='<html>';
			mensaje +='<head>';
			mensaje +='<meta http-equiv=Content-Type content="text/html; charset=UTF-8">';
			mensaje +='</head>';
			mensaje +='<body>';
			mensaje += '<b>Nombre:</b> '+getSession('nombre')+' '+ getSession('apellido')+'<br/>';
			mensaje += '<b>Email:</b> '+getSession('email')+'<hr/><br/>';
			mensaje += 'Ha realizado el siguiente pedido:<br/><br/>';
			mensaje+='<div style="width:100%; max-height:540px; " >';
				for (var i=0; i<carroJson.Productos.length; i++){
					mensaje+='		<img src="http://www.ceramicaformas.com/images/productos/'+carroJson.Productos[i].id+'.jpg" style="width:80px; height:60px;"\><br />';
					mensaje+='		<span style="font-size:16px; font-weight:800;">'+carroJson.Productos[i].producto+'</span> - ';
					mensaje+='		<span style="color:#666;">Color seleccionado: '+carroJson.Productos[i].color+'</span> - ';
					mensaje+='		<span id="titulo" style="color:#666;">Cantidad: '+carroJson.Productos[i].cantidad+'</span><br /><br />';
				}
			mensaje +='</div>';
			mensaje +='</body>';
			mensaje +='</html>';
			
			var valores ="'accion':'enviarMail',";
			valores+="'asunto':'Pedido enviado desde la web de Formas',";
			valores+="'mensaje':'"+escape(mensaje)+"',";
			valores+="'email':'no-reply@ceramicaformas.com',";
			valores+="'name':'Ceramica Formas'";

			valores='_p='+encode(escape('{'+valores+'}'));

			url='./src/controller/mail.php';

			$.ajax({
				url: url,
				data: valores,
				success: function(response){
					//alert(response)
					//alert(decode(response))
					var json=parsearJSON(decode(response))
				}
			});
				
			$.cookie('carro',null);
			carroJson = {'Productos':[]};
			actualizarCarro();
			MSG('alert','Alerta','Pedido enviado exitosamente.',null,null);
		}
	}
}


//  LOGIN / LOGOUT  //

function login(e){	
	var valores ="'accion':'selxUsuario',";	
	valores +="'usuario':'"+$('#login_usuario').val()+"'";	
	valores='_p='+encode(escape('{'+valores+'}'));	
	
	var url='./src/controller/usuarios.php';

	$.ajax({
		url: url,
		data: valores,
		async: false,
		global: false,
	    success: function(response){
			var json=parsearJSON(decode(response));
	    	//obtenerNavList();
			if(json != null && json.list[0]!=null){		
				if(json.list[0].contrasena==$('#login_pass').val()){
					//obtenerNavList();
					setSession('logged','true');
					setSession('usuario',json.list[0].usuario);
					setSession('usuarioId',json.list[0].id);
					setSession('nombre',json.list[0].nombre);
					setSession('apellido',json.list[0].apellido);
					setSession('email',json.list[0].mail);
					dumpSession();
					doLogin();
				}else{
					MSG('alert','Alerta','Password Incorrecto',null,null);
				}
			}else{
				MSG('alert','Alerta','Usuario Incorrecto',null,null);
			}
		}
	});
}

function doLogin(){
	escribir($('#usuario_nombre'), 'Bienvenido '+ getSession('nombre') +' '+getSession('apellido'));
	$('#login_form').hide();
	$('#user_data').show();
}

function logOut(){
	setSession('logged','null');
	dumpSession();
	$('#login_form').show();
	$('#user_data').hide();
}

function pressEnter(event, e, success) {
	if (event.keyCode == '13'){
		success(e);
	}
}

function verCuenta(){
	MSG('alert','Alerta','Estamos trabajando en esta secci&oacute;n. Pr&oacute;ximamente podr&aacute;s consultar y modificar tu cuenta.',null,null);
}
