// JavaScript Document

var Clientes = new Class({
	Extends: Menu,
	Implements: [Options, Events],
	options:
	{
	},
	initialize:function(options)
	{
		this.setOptions(options);
		this.getClientes();
	},
	getClientes:function()
	{
		var sd = new Request({url: "./sys/clientes.php",
			onRequest:function(){
				this.loadCaja("cargando clientes...");
			}.bind(this),
			onSuccess: function(r){
				this.setCaja(r);
				this.cliEvents();
			}.bind(this)
		}).get({"getClientes":""});		
	},
	cliEvents:function()
	{
		$$(".clientesListImglink").each(function(i){
			i.addEvent("click",function(){
				this.cliImg(i.id);
			}.bind(this));
		}.bind(this));
	},
	cliImg:function(cliId)
	{
		function byeTapaTodoNoticias()
		{
			$("closeExplorador").setStyles({"display":"none"});
			$("loginTapaTodo").setStyles({"opacity":0,"display":"none"});
			$("loginBox").setStyles({"opacity":0,"display":"none"});
			$("loginBox").set("html","");
			$("loginTapaTodo").removeEvent("click",byeTapaTodoNoticias);
			$("closeExplorador").removeEvent("click",byeTapaTodoNoticias);
			$("loginBox").removeEvent("click",byeTapaTodoNoticias);
		}

		$("loginTapaTodo").setStyles({"opacity":0,"display":"block"});
		$("loginTapaTodo").tween("opacity",0.8);
		$("loginTapaTodo").addEvent("click",byeTapaTodoNoticias);
		$("closeExplorador").addEvent("click",byeTapaTodoNoticias);
		$("loginBox").addEvent("click",byeTapaTodoNoticias);
		
		
		var sd = new Request({url: "./sys/clientes.php",
			onRequest:function(){
				$("loginBox").setStyles({
					"opacity":0,
					"display":"block",
					"color":"#000",
					"background-image":"url(css/spinner.gif)",
					"background-repeat":"no-repeat",
					"background-color":"#fff",
					"background-position":"center center",
					'width': [100],
					'height': [100],
					'padding': [5],
					'margin-top':[-50],
					'margin-left':[-50],
					'opacity':1});
				
				$("closeExplorador").setStyles({
					"display":"block",
					"margin-left":34,
					"margin-top":-75});	
			}.bind(this),
			onSuccess: function(r){
				$("closeExplorador").setStyles({
					"opacity":0,
					"display":"none"});
				
				var loginBoxFx = new Fx.Morph('loginBox', {duration: 100, transition: Fx.Transitions.Sine.easeOut});
				var j = JSON.decode(r);	
				
  var loader = new Asset.image(j.url, {
    onLoad: function() {
				loginBoxFx.start({
					'height': [j.height],
					'margin-top':[-(j.height/2)],
					'width': [j.width],
					'margin-left':[-(j.width/2)]
				});
				
				var cloLeft = ((j.width/2)-20);
				var cloTop =  -((j.height/2)-3);
				
				$("closeExplorador").setStyles({	
					"display":"block",
					"margin-left":cloLeft,
					"margin-top":cloTop});	
				$("closeExplorador").morph({
					"opacity":1});
					
		document.id("loginBox").set("html",j.html);		
    }
  });		
  		
			}.bind(this)
		}).get({"cliImg":cliId});		
	}
});