var scroll;
var section='main';

function showArrows(){
	if(section=='gallery'){
		var myEffect = new Fx.Morph('arrowright', {duration: 400, transition: Fx.Transitions.Sine.easeInOut});
		myEffect.start({
			//'opacity':1.0,
			'background-position':'0px 0px'
		});

		var myEffect = new Fx.Morph('arrowleft', {duration: 400, transition: Fx.Transitions.Sine.easeInOut});
		myEffect.start({
			//'opacity':1.0,
			'background-position':'0px 0px'
		});
	}
}

function hideArrows(){
	if(section=='main'){
		var myEffect = new Fx.Morph('arrowright', {duration: 400, transition: Fx.Transitions.Sine.easeInOut});
		myEffect.start({
			//'opacity':0.0,
			'background-position':'-50px 0px'
		});

		var myEffect = new Fx.Morph('arrowleft', {duration: 400, transition: Fx.Transitions.Sine.easeInOut});
		myEffect.start({
			//'opacity':0.0,
			'background-position':'50px 0px'
		});
		hideContainerBg();
	}
}



function showContainerBg(type){
	//alert(type);
	var myEffect = new Fx.Morph('contenedor', {duration: 400, transition: Fx.Transitions.Sine.easeOut,onStart:function(){	$('contenedor').setProperty('class',type);}});
	/*myEffect.start({
		'background-position':'450px 0px'

	});*/
	myEffect.start.delay(600, myEffect,{
		'background-position':'450px 0px'

	});

}

function hideContainerBg(){
	var myEffect = new Fx.Morph('contenedor', {duration: 200, transition: Fx.Transitions.Sine.easeInOut,onComplete:function(){$('contenedor').setProperty('class','');}});
	myEffect.start({
		'background-position':'450px -105px'
	});

}

function initPictureSlider(maskid){
	var perPage=5;
	var mask=$(maskid);
	var group = $$('#'+maskid+' ul');
	var items = $$('#'+maskid+' ul li');
	if(items.length>0){
		var pages = Math.ceil(items.length/perPage);
		//alert(pages);		
		var page = 1;
		var pageWidth = items[0].getSize().x * perPage;
		var direction = "forward";
		var prev = $('arrowleft');
		var next = $('arrowright');

		var anim = new Fx.Scroll(mask, {
			duration: 600,
			transition: Fx.Transitions.Sine.easeInOut,
			onStart: function(){
				//alert(page);
				if(direction == "forward"){
					page < pages ? page++ : page = 1;
				}
				if(direction == "backward"){
					page > 1 ? page-- : page = 1;
				}
			},
			onComplete: function(){
				if(items.length>perPage) showArrows();
				
			}

		});	
		showContainerBg(maskid.split('-')[1]);
		anim.toLeft();
		page = 1;//pages;

		if (page == 1) {prev.fade(0.3);} else {prev.fade(1);}
		if (page == pages) {next.fade(0.3);} else {next.fade(1);}

		group.setStyle('width', items.length * items[0].getSize().x);
	
		prev.addEvent('click', function(e){
			e = new Event(e).stop();
			direction = "backward";
			if (page > 1) anim.start((page-2) * pageWidth, 0);
			if (page == 1) {prev.fade(0.3);} else {prev.fade(1);}
			if (page == pages) {next.fade(0.3);} else {next.fade(1);}
		});

		next.addEvent('click', function(e){
			e = new Event(e).stop();
			direction = "forward";
			if (page < pages) anim.start(page * pageWidth, 0);
			if (page == 1) {prev.fade(0.3);} else {prev.fade(1);}
			if (page == pages) {next.fade(0.3);} else {next.fade(1);}
		});

		
	}
}


 function toggle(gid,description,title,newSrc){
	//alert(newSrc);

        var el=$('imagecontainer-'+gid);
      	var eltext=$('infocontainer-'+gid);
	var images = [newSrc];
	$('imgloader').fade(1);
	var loader = new Asset.images(images, {
		onStart: function(counter,index) {
			$('imgloader').fade(1);
			//progressBar.set((counter + 1) * (100 / images.length));
		},
		onComplete: function() {
			images.each(function(im) {
				transicion1.set({
					'height':0
					/*'background-position':'center -320px'*/
				});
				transicion1.start({
					'width': [360, 360],
					/*'background-position':'center 0px',*/
					'height': [0, 320],
					'background-image': 'url(\''+newSrc+'\')',
					onStart:function(){$('imgloader').fade(0.0);}
				})
				//new Element('img',{ src:im, width:200, style:'width:200px;margin:20px 20px 20px 0;' }).inject($('images-holder'));
			});
		}
	});

      	var transicion1 = new Fx.Morph(el,{
			duration: 500,
			transition: Fx.Transitions.Bounce.easeOut,
			link: 'ignore',
			onComplete: function(){
				el.getElement('a').href=newSrc;
				el.getElement('a').title=title;
				//el.getElement('a').caption=description;
				eltext.fade(1);
				eltext.getElement('h2').set('html',title);
				eltext.getElement('p').set('html',description);
				
			
			},
			onStart:function(){
				eltext.fade(0);
				el.set({
				'width': 50,
				'height':50
				})
			}
			
		});

}


window.addEvents({
	'domready': function(){
		
		scroll = new Fx.Scroll('pagesmask', {
			wait: false,
			wheelStops:false,
			duration: 600,
			offset: {'x': 0, 'y': 0},
			transition: Fx.Transitions.Sine.easeInOut,
			//onComplete:showArrows,
			onStart:hideArrows//transition: Fx.Transitions.Sine.easeInOut
		});
		
		
		/*$('portfolio_illustration_link').addEvent('mouseout', function(e){e = new Event(e).stop();$('portfolio_illustration_link').fade(1);$('portfolio_photo_link').fade(1);$('portfolio_web_link').fade(1);$('portfolio_dessign_link').fade(1);});
		$('portfolio_photo_link').addEvent('mouseout', function(e){e = new Event(e).stop();$('portfolio_illustration_link').fade(1);$('portfolio_photo_link').fade(1);$('portfolio_web_link').fade(1);$('portfolio_dessign_link').fade(1);});
		$('portfolio_web_link').addEvent('mouseout', function(e){e = new Event(e).stop();$('portfolio_illustration_link').fade(1);$('portfolio_photo_link').fade(1);$('portfolio_web_link').fade(1);$('portfolio_dessign_link').fade(1);});
		$('portfolio_dessign_link').addEvent('mouseout', function(e){e = new Event(e).stop();$('portfolio_illustration_link').fade(1);$('portfolio_photo_link').fade(1);$('portfolio_web_link').fade(1);$('portfolio_dessign_link').fade(1);});
		
		$('portfolio_illustration_link').addEvent('mouseover', function(e){
				e = new Event(e).stop();
				this.fade(1.0);
				$('portfolio_photo_link').fade(0.5);
				$('portfolio_web_link').fade(0.5);
				$('portfolio_dessign_link').fade(0.5);
				
				
		});
		
		$('portfolio_photo_link').addEvent('mouseover', function(e){
				e = new Event(e).stop();
				this.fade(1.0);
				$('portfolio_illustration_link').fade(0.5);
				$('portfolio_web_link').fade(0.5);
				$('portfolio_dessign_link').fade(0.5);
				
				
		});
		
		$('portfolio_web_link').addEvent('mouseover', function(e){
				e = new Event(e).stop();
				this.fade(1.0);
				$('portfolio_illustration_link').fade(0.5);
				$('portfolio_photo_link').fade(0.5);
				$('portfolio_dessign_link').fade(0.5);
				
				
		});
		
		$('portfolio_dessign_link').addEvent('mouseover', function(e){
				e = new Event(e).stop();
				this.fade(1.0);
				$('portfolio_illustration_link').fade(0.5);
				$('portfolio_web_link').fade(0.5);
				$('portfolio_photo_link').fade(0.5);
				
				
		});
		
		$('contact_feet').addEvent('mouseout', function(e){e = new Event(e).stop();$('contact_phone').fade(1);$('contact_feet').fade(1);$('contact_email').fade(1);});
		$('contact_phone').addEvent('mouseout', function(e){e = new Event(e).stop();$('contact_phone').fade(1);$('contact_feet').fade(1);$('contact_email').fade(1);});
		$('contact_email').addEvent('mouseout', function(e){e = new Event(e).stop();$('contact_phone').fade(1);$('contact_feet').fade(1);$('contact_email').fade(1);});
		
		$('contact_feet').addEvent('mouseover', function(e){
				e = new Event(e).stop();
				this.fade(1.0);
				$('contact_phone').fade(0.5);
				$('contact_email').fade(0.5);
		});
		
		$('contact_phone').addEvent('mouseover', function(e){
				e = new Event(e).stop();
				this.fade(1.0);
				$('contact_feet').fade(0.5);
				$('contact_email').fade(0.5);
		});
		
		$('contact_email').addEvent('mouseover', function(e){
				e = new Event(e).stop();
				this.fade(1.0);
				$('contact_phone').fade(0.5);
				$('contact_feet').fade(0.5);
		});
		*/
		
		$$('a.illustrationlink').addEvent('click', function(e){
				e = new Event(e).stop();
				section='gallery';
				scroll.start(1220,500);
				initPictureSlider("mask-illustration");
				
				
		});
		
		$$('a.newslink').addEvent('click', function(e){
				e = new Event(e).stop();
				section='main';
				scroll.start(0,500);
				
		});
		$$('a.newslink2').addEvent('click', function(e){
				e = new Event(e).stop();
				section='main';
				scroll.start(0,500);
				
		});

		$$('a.infolink').addEvent('click', function(e){
				e = new Event(e).stop();
				section='main';
				scroll.start(610,0);
		});
		
		
		
		$$('a.photolink').addEvent('click', function(e){
				e = new Event(e).stop();
				section='gallery';
				scroll.start(1220,1000);
				initPictureSlider("mask-photo");
				//showArrows();
		});
		
		$$('a.weblink').addEvent('click', function(e){
				e = new Event(e).stop();
				section='gallery';
				scroll.start(1220,1500);
				initPictureSlider("mask-web");
				//showArrows();
		});
		
		$$('a.dessignlink').addEvent('click', function(e){
				e = new Event(e).stop();
				section='gallery';
				scroll.start(1220,2000);
				initPictureSlider("mask-dessign");
				//showArrows();
		});
	
		
		
		$$('a.maplink').addEvent('click', function(e){
				e = new Event(e).stop();
				section='main';
				scroll.start(1830,500);
				//hideArrows();
		});

		$$('a.portfoliolink').addEvent('click', function(e){
				e = new Event(e).stop();
				section='main';
				scroll.start(1220,0);
				//hideArrows();
		});

		$$('a.contactlink').addEvent('click', function(e){
				e = new Event(e).stop();
				section='main';
				scroll.start(1830,0);
				//hideArrows();
		});

		$$('a.homelink').addEvent('click', function(e){
				e = new Event(e).stop();
				section='main';
				scroll.start(0,0);
				//hideArrows();
		});
		
		$$('a.pepelink').addEvent('click', function(e){
				e = new Event(e).stop();
				section='main';
				scroll.start(610,500);
				//hideArrows();
		});
		
		$$('a.txolink').addEvent('click', function(e){
				e = new Event(e).stop();
				section='main';
				scroll.start(610,1000);
				//hideArrows();
		});
		
		$$('a.chivetilink').addEvent('click', function(e){
				e = new Event(e).stop();
				section='main';
				scroll.start(610,1500);
				//hideArrows();
		});

		/*PRELOADER*/
			/* progress bar */
			var progressBar = new dwProgressBar({
				container: $('progress-bar'),
				startPercentage: 0,
				speed:10,
				boxID: 'box',
				percentageID: 'perc',
				displayID: 'text',
				displayText: true
			});
	
			/* preloading */
			var imagesobj = $$('img');
			var customimages=new Array('images/arrowleft.jpg','images/arrowright.jpg','images/bg-img-mask.jpg','images/colored-pencils.jpg','images/design-top-bg.jpg','images/mainbg.jpg','images/newslink_ca.jpg','images/newslink_es.jpg','images/newslink_en.jpg','images/underline.jpg','images/web-top-bg.jpg','images/photo-top-bg.jpg');
			//alert(imagesobj.length +" "+ customimages.length);
			var images=new Array(imagesobj.length + customimages.length);
			
			
			
			for(i=0;i<customimages.length;i++){
				//alert(imagesobj[i].get('src'));
				images[i]=customimages[i];
			}
			
			for(i=0;i<imagesobj.length;i++){
				//alert(imagesobj[i].get('src'));
				images[customimages.length+i]=imagesobj[i].get('src');
			}
			
			//alert(images.length);
			var loader = new Asset.images(images, {
				onProgress: function(counter,index) {
					var tmp=(counter + 1) * (100 / images.length);
					//alert(tmp);
					progressBar.set(tmp);
				},
				onComplete: function() {
					$('loader').destroy();
				}
			});
		
		
	}/*,
	
	'load':function(){
		var myEffect = new Fx.Morph('loader', {duration: 2000, transition: Fx.Transitions.Sine.easeOut,onComplete: function(){
				//$('loader').destroy();
			},onStart:function(){
				//scroll.start(600,0);
			}
		});

		
		myEffect.set({
			'opacity':0.0
			
		});
		
		//$('loader').morph({duration:1000, height: 100, width: 200});


	}*/
	
});