var paddings3D = new Array();

var bg3dsizes = new Array();
bg3dsizes[0] = 1280;
bg3dsizes[1] = 522;

var cont3dsizes = new Array();
var bg3dpaddings = new Array();
var currentStep = new Array();

var a3dsizes = new Array();
a3dsizes[0] = 296;
a3dsizes[1] = 323;
conta3dsizes = new Array();

var b3dsizes = new Array();
b3dsizes[0] = 238;
b3dsizes[1] = 792;
contb3dsizes = new Array();

var c3dsizes = new Array();
c3dsizes[0] = 547;
c3dsizes[1] = 522;
contc3dsizes = new Array();

var onoffflag = false;
window.addEvent('load', function(){
	$('preloader').fade(0);
	//$('preloader').destroy();
	
});


window.addEvent('domready', function() {

	$('mask3d').setStyle('opacity',0);
	$('on-off-bt').addEvent('click', function(item, index){
		if(onoffflag){
			$('on-off').removeClass('off-on');
			$('mask3d').fade(0);
			onoffflag = false;
		}else{
			$('on-off').addClass('off-on');
			$('mask3d').fade(0.8);
			onoffflag = true;
		}
	});
	
	paddings3D[1] = $('container-3d').getPosition();
	paddings3D[0] = paddings3D[1].x;
	paddings3D[1] = paddings3D[1].y;
	
	cont3dsizes[1] = $('container-3d').getSize();
	cont3dsizes[0] = cont3dsizes[1].x;
	cont3dsizes[1] = cont3dsizes[1].y;
	
	bg3dpaddings[0] = -1*((bg3dsizes[0]-cont3dsizes[0])/2).toInt();
	bg3dpaddings[1] = -1*((bg3dsizes[1]-cont3dsizes[1])/2).toInt();
	bg3dpaddings[0] = -40; //temp
	currentStep[0] = 0;
	currentStep[1] = 0;
	
	conta3dsizes[1] = $('a3d').getSize();
	conta3dsizes[0] = conta3dsizes[1].x;
	conta3dsizes[1] = conta3dsizes[1].y;
	$('a3d').setStyle('background-position', (((conta3dsizes[0]-a3dsizes[0])/2).toInt())+'px '+(((conta3dsizes[1]-a3dsizes[1])/2).toInt())+'px');
	
	contb3dsizes[1] = $('b3d').getSize();
	contb3dsizes[0] = contb3dsizes[1].x;
	contb3dsizes[1] = contb3dsizes[1].y;
	$('b3d').setStyle('background-position', (((contb3dsizes[0]-b3dsizes[0])/2).toInt())+'px '+(((contb3dsizes[1]-b3dsizes[1])/2).toInt())+'px');	
	
	//contc3dsizes[1] = $('c3d').getSize();
	//contc3dsizes[0] = contc3dsizes[1].x;
	//contc3dsizes[1] = contc3dsizes[1].y;
	//$('c3d').setStyle('background-position', (((contc3dsizes[0]-c3dsizes[0])/2).toInt())+'px '+(((contc3dsizes[1]-c3dsizes[1])/2).toInt())+'px');	
	
	$('container-3d').setStyle('background-position', bg3dpaddings[0]+'px '+bg3dpaddings[1]+'px');
	
	$('container-3d').addEvents({
		'mousemove':function(e){
			currentStep[0] = e.page.x-paddings3D[0];
			currentStep[1] = e.page.y-paddings3D[1];
			$('a3d').setStyle('background-position', (conta3dsizes[0]-a3dsizes[0]-Math.round((currentStep[0]*(conta3dsizes[0]-a3dsizes[0]))/cont3dsizes[0]))
				+'px '+(conta3dsizes[1]-a3dsizes[1]-Math.round((currentStep[1]*(conta3dsizes[1]-a3dsizes[1]))/cont3dsizes[1]))+'px');
			$('b3d').setStyle('background-position', (contb3dsizes[0]-b3dsizes[0]-Math.round((currentStep[0]*(contb3dsizes[0]-b3dsizes[0]))/cont3dsizes[0]))
				+'px '+(contb3dsizes[1]-b3dsizes[1]-Math.round((currentStep[1]*(contb3dsizes[1]-b3dsizes[1]))/cont3dsizes[1]))+'px');		
			
			var glbX = -1*Math.round((currentStep[0]*bg3dpaddings[0]*2)/cont3dsizes[0]);
			var glbY = -1*Math.round((currentStep[1]*bg3dpaddings[1]*2)/cont3dsizes[1]);
			
			$('container-3d').setStyle('background-position', (bg3dpaddings[0]*2+glbX)
				+'px '+(bg3dpaddings[1]*2+glbY+'px'));
			
			
			$('dots-c').setStyles({
				'left':glbX+bg3dpaddings[0],
				'top':glbY+bg3dpaddings[1]
			});			
			$('on-off-c').setStyles({
				'left':glbX+bg3dpaddings[0],
				'top':glbY+bg3dpaddings[1]
			});
		}
	});
	
	var dotsFx = new Array();
	var dotsW = new Array();
	var dotsH = new Array();
	$$('.dot3d').each(function(item, index){
	
		dotsW[index] = item.getStyle('left').toInt();
		dotsH[index] = item.getStyle('top').toInt();
	//	item.getChildren('div')[0].setStyle('opacity',0);
		dotsFx[index] = new Fx.Morph(item,{
			link:'cancel',
			duration:250,
			fps:40,
			onComplete:function(){
				//item.getChildren('div')[0].fade(1);
				item.getChildren('div')[0].setStyle('display','block');
			}
		});
		item.addEvents({
			'mouseenter':function(e){
				dotsFx[index].start({
					'width':149,
					'height':149,
					'left':dotsW[index] - 67,
					'top':dotsH[index] - 67
				});
			},
			'mouseleave':function(e){
				/*dotsFx[index].start({
					'width':15,
					'height':15,
					'left':dotsW[index],
					'top':dotsH[index]
				});*/
				//item.getChildren('div')[0].fade(0);
				item.getChildren('div')[0].setStyle('display','none');
				dotsFx[index].cancel();
				
				dotsFx[index].set({
					'width':15,
					'height':15,
					'left':dotsW[index],
					'top':dotsH[index]
				});
			}
		});

	});
});	

window.addEvent('resize', function() {
	paddings3D[1] = $('container-3d').getPosition();
	paddings3D[0] = paddings3D[1].x.toInt();
	paddings3D[1] = paddings3D[1].y.toInt();
});