// JavaScript Document
window.addEvent('domready', function(){
	
	var list = $$('#sliding-navigation li a');
	list.each(function(element) {
		var fx = new Fx.Morph(element, {duration:150, wait:false});
		element.addEvent('mouseenter', function(){
			fx.start({
				'padding-left': 30
			});
		});
		element.addEvent('mouseleave', function(){
			fx.start({
				'padding-left': 18
			});
		});
	});
	
	var scroll = new Fx.Scroll('demo-wrapper', {
		wait: false, duration: 800, offset: {'x': 0, 'y': 0}, transition: Fx.Transitions.Quad.easeInOut
	});
	
	var scroll2 = new Fx.Scroll('content3', {
		wait: false, duration: 800,	offset: {'x': 0, 'y': 0}, transition: Fx.Transitions.Quad.easeInOut
	});
	
	var scroll3 = new Fx.Scroll('content4', {
		wait: false, duration: 800,	offset: {'x': 0, 'y': 0}, transition: Fx.Transitions.Quad.easeInOut
	});
	
	list.each(function(element,i) {
		element.addEvent('click', function(event) {
			event = new Event(event).stop();
			scroll.toElement('content'+(i+1));
			scroll2.toElement('port-default');
			scroll3.toElement('serv0');

		});		
	});
	
	
	/************************************************/
	$('serv-back').addEvent('click', function(event) {
			event = new Event(event).stop();
			scroll3.toElement('serv0');
	});

	$('serv-more').addEvent('click', function(event) {
			event = new Event(event).stop();
			scroll3.toElement('serv1');
	});
	
	var getback = $$('#port-wrapper .port-back');
	getback.each(function(e){
		e.addEvent('click', function(event) {
			event = new Event(event).stop();
			scroll2.toElement('port-default');
		});
	});
	
	/************************************************/
	var port = $$('#kwicks li');
	port.each(function(element,i) {
		element.addEvent('click', function(event) {
			event = new Event(event).stop();
			scroll2.toElement('portfolio'+(i+1));
		});		
	});			
	
	var szNormal = 110, szSmall = 88, szFull = 220;
	
	var kwicks = $$('#kwicks .kwick');
	var fx2 = new Fx.Elements(kwicks, {wait: false, duration: 600, transition: Fx.Transitions.Back.easeOut});
	kwicks.each(function(kwick, i) {
		kwick.addEvent('mouseenter', function(event) {
			var o = {};
			o[i] = {width: [kwick.getStyle('width').toInt(), szFull]};
			kwicks.each(function(other, j) {
				if(i != j) {
					var w = other.getStyle('width').toInt();
					if(w != szSmall) o[j] = {width: [w, szSmall]};
				}
			});
			fx2.start(o);
		});
	});
			
	$('kwicks').addEvent('mouseleave', function(event) {
		var o = {};
		kwicks.each(function(kwick, i) {
			o[i] = {width: [kwick.getStyle('width').toInt(), szNormal]};
		});
		fx2.start(o);
	});
	
	kwicks.each(function(element) {
		element.addEvent('mouseenter', function(){
			this.setStyle('background-position', 'center -300px');
		});
		element.addEvent('mouseleave', function(){
			this.setStyle('background-position', 'center 0');
		});
	});
});