window.addEvent('domready', function() {
	// slide server infos
	var serFx = new Fx.Scroll('servers', {
		wait: false,
		duration:500,
        //duration:10000,
		offset: {'x': 0, 'y': 0}
	});
	serFx.set(0, 0);
	var pargo = 0;
	var vars = { counter: 0 };
     var curr_server = 0;
     var servrs = $$('.serverbox');
     
	var gogo = function(){
		if(pargo>0){
			var sdm = $('servers_slider').getSize();
			var sds = $('servers').getSize();
			if(this.counter<0) this.counter=0;
			if(this.counter>(sdm.x-sds.x)) this.counter=(sdm.x-sds.x);
			if(pargo==1){ this.counter=this.counter-4; } else { this.counter=this.counter+4; }
			serFx.set(this.counter,0);
		}
	}
	// server left to right and back
	//serFx.addEvent('complete', function(){ serFx.toLeft });
// 	serFx.addEvent('complete', function(){ serFx.toLeft });
// 	serFx.toLeft();
// 	serFx.toRight();
    //serFx.toElement(servrs[19]);
	
	var larr1 = new Image;
	larr1.src = 'themes/lgc/modules/layout/serverbasebox/img/leftarrow1.png';
	var larr2 = new Image;
	larr2.src = 'themes/lgc/modules/layout/serverbasebox/img/leftarrow2.png';
	var rarr1 = new Image;
	rarr1.src = 'themes/lgc/modules/layout/serverbasebox/img/rightarrow1.png';
	var rarr2 = new Image;
	rarr2.src = 'themes/lgc/modules/layout/serverbasebox/img/rightarrow2.png';
	
	$('server_leftarr').addEvents({
		'mouseover': function(){
			this.setProperty('src',larr2.src);
		},
		'mouseout': function(){
// 			pargo = 0;
			this.setProperty('src',larr1.src);
		},
		'mousedown': function(){
// 			pargo = 1;
// 			gogo.periodical(1,vars);
               curr_server -= 1;
               if(curr_server < 0)
               {
                    curr_server = 0;
               }
               serFx.toElement(servrs[curr_server]);
		},
		'mouseup': function(){
// 			pargo = 0;
		}
	});
	$('server_rightarr').addEvents({
		'mouseover': function(){
			this.setProperty('src',rarr2.src);
		},
		'mouseout': function(){
// 			pargo = 0;
			this.setProperty('src',rarr1.src);
		},
		'mousedown': function(){
// 			pargo = 2;
// 			gogo.periodical(1,vars);
// 			
//               curr_server += 1;
//
//               if(curr_server > (servrs.length - 2 ))
//               {
//
//                    curr_server = servrs.length - 2;
//               }
               var sdm = $('servers_slider').getSize();
               var sds = $('servers').getSize();
//               if(this.counter<(sdm.x-sds.x)){
//                   curr_server += 1;
//               }
            
            pp = servrs[servrs.length-1].getPosition($('servers'));
            //pps = servrs[servrs.length-1].getSize();

//            if(pp.x>(sdm.x-sds.x)) curr_server-=1;

            //alert(curr_server+" / "+(pp.x+pps.x)+">"+sdm.x+" / "+sds.x);

            if((sdm.x-(curr_server*160))>sds.x) curr_server += 1;

            //alert(curr_server);
            //alert(sds.x+" / "+sdm.x-(curr_server*160));


//alert(curr_server+" / "+pp.x+" / "+sdm.x+" / "+sds.x);
               
               serFx.toElement(servrs[curr_server]);
		},
		'mouseup': function(){
// 			pargo = 0;
		}
	});
	
	// open details about server
	var arrows = $$('.serverbox .arrow');
	arrows.each(function(item,i){
		item.store('open',false);
		item.addEvent('click',function(){
			var par = item.getParent('div').getParent('div');
			var myFx = new Fx.Morph(par);
			
			if(item.retrieve('open')){
				var sz = par.getSize();
				myFx.addEvents({
					'complete': function(){
						item.setProperty('src','themes/lgc/modules/layout/serverbasebox/img/arrow1.png');
						item.store('open',false);
						//
						var sdm = $('servers_slider').getSize();
						$('servers_slider').setStyle('width',sdm.x-(sz.x-150));
						var wtf = $('servers').getSize();
// 						alert(wtf.x+' '+);
						//if()
//						serFx.toElement(item.getParent('div'));
					}
				});
				myFx.start({
					'width': [sz.x, 150]
				});
			} else {
				var pred=0;
				myFx.addEvents({
					'complete': function(){
						par.setStyle('width','auto');
						item.setProperty('src','themes/lgc/modules/layout/serverbasebox/img/arrow2.png');
						item.store('open',true);
						//
						var rgm = par.getSize();
						$('servers_slider').setStyle('width',pred.x+(rgm.x-150));
					},
					'start': function(){
						pred = $('servers_slider').getSize();
						$('servers_slider').setStyle('width',9000);
					}
				});
				myFx.start({
					'width': [150, 300]
				});
			}
		});
	});
	
	// scroll table up and down with slider
	var slides = $$('.slide');
	var sliders = $$('.slider');
	var sstats = $$('.server_stats');
	var stats = $$('.stats');
	var sl = new Array();
	slides.each(function(item,i){
		var gop = sstats[i];
		var slFx = new Fx.Scroll(gop);
		var ss = stats[i].getSize()
		sl[i] = new Slider(item, sliders[i], {
			steps: (ss.y-163),
			mode: 'vertical',
			onChange: function(step){
				slFx.set(0,step);
			}
		}).set(0);
	});
	
	// scroll table up and down with arrows
	var uarr1 = new Image;
	uarr1.src = 'themes/lgc/modules/layout/serverbasebox/img/uparrow.png';
	var uarr2 = new Image;
	uarr2.src = 'themes/lgc/modules/layout/serverbasebox/img/uparrow2.png';
	var darr1 = new Image;
	darr1.src = 'themes/lgc/modules/layout/serverbasebox/img/downarrow.png';
	var darr2 = new Image;
	darr2.src = 'themes/lgc/modules/layout/serverbasebox/img/downarrow2.png';
	
	var stsl = $$('.stats_slider img');
	stsl.each(function(item,i){
		var per = false;
		item.addEvents({
			'mousedown': function(){
				per = true;
				var godown = function(){ if(per) sl[Math.floor(i/2)].set(sl[Math.floor(i/2)].step-1) };
				var goup = function(){ if(per) sl[Math.floor(i/2)].set(sl[Math.floor(i/2)].step+1) };
				switch(item.getProperty('alt')){
					case 'up': if(i==1) goup.periodical(10,per); else godown.periodical(10,per); break;
					case 'down': if(i==1) godown.periodical(10,per); else goup.periodical(10,per);
				}
			},
			'mouseup': function(){
				per=false;
			},
			'mouseover': function(){
				switch(item.getProperty('alt')){
					case 'up': item.setProperty('src',uarr1.src); break;
					case 'down': item.setProperty('src',darr1.src);
				}
			},
			'mouseout': function(){
				per = false;
				switch(item.getProperty('alt')){
					case 'up': item.setProperty('src',uarr2.src); break;
					case 'down': item.setProperty('src',darr2.src);
				}
			}
		});
	});
});