$(function() {
	var $ac_background	= $('#ac_background'),
	$ac_bgimage		= $ac_background.find('.ac_bgimage'),
	$ac_loading		= $ac_background.find('.ac_loading'),
	
	$ac_content		= $('#ac_content'),
	$title			= $ac_content.find('h1'),
	$menu			= $ac_content.find('.ac_menu'),
	$mainNav		= $menu.find('ul:first'),
	$menuItems		= $mainNav.children('li'),
	totalItems		= $menuItems.length,
	$ItemImages		= new Array();
	
	/*
	 * for this menu, we will preload all the images. let's add all the image
	 * sources to an array, including the bg image
	 */
	$menuItems.each(function(i) {
		$ItemImages.push($(this).children('a:first').attr('href'));
	});
	$ItemImages.push($ac_bgimage.attr('src'));
		  
	
	var Menu 			= (function(){
		var init				= function() {
			loadPage();
			initWindowEvent();
		},
		loadPage			= function() {
			/*
			 * 1- loads the bg image and all the item images; 2- shows the bg
			 * image; 3- shows / slides out the menu; 4- shows the menu items;
			 * 5- initializes the menu items events
			 */
        $ac_loading.show();// show loading status image
        initEventsSubMenu();
			$.when(loadImages()).done(function(){
				$.when(showBGImage()).done(function(){
					// hide the loading status image
					$ac_loading.hide();
					$.when(slideOutMenu()).done(function(){
							$.when(toggleMenuItems('up')).done(function(){
							// initEventsSubMenu(); // bruno
						});
					});
				});
			});
		},
		showBGImage			= function() {
			return $.Deferred(
			function(dfd) {
				// adjusts the dimensions of the image to fit the screen
				adjustImageSize($ac_bgimage);
				$ac_bgimage.fadeIn(500, dfd.resolve);
			}
		).promise();
		},
		slideOutMenu		= function() {
			/* calculate new width for the menu */
			var new_w	= $(window).width() - $title.outerWidth(true);
			return $.Deferred(
			function(dfd) {
				// slides out the menu
				$menu.stop()
				.animate({
					width	: new_w + 'px'
				}, 500, dfd.resolve);
			}
		).promise();
		},
			/* shows / hides the menu items */
			toggleMenuItems		= function(dir) {
			return $.Deferred(
			function(dfd) {
				/*
				 * slides in / out the items. different animation time for each
				 * one.
				 */
				$menuItems.each(function(i) {
							var $el_title	= $(this).children('a:first'),
								marginTop, opacity, easing;
							if(dir === 'up'){
								marginTop	= '0px';
								opacity		= 1;
								easing		= 'easeOutBack';
							}
							else if(dir === 'down'){
								marginTop	= '60px';
								opacity		= 0;
								easing		= 'easeInBack';
			}
					$el_title.stop()
					.animate({
										marginTop	: marginTop,
										opacity		: opacity
									 }, 100 + i * 100 , easing, function(){
						if(i === totalItems - 1)
							dfd.resolve();
					});
				});
			}
		).promise();
		},
		initEventsSubMenu	= function() {
			$menuItems.each(function(i) {
				var $item		= $(this), // the <li>
				$el_title	= $item.children('a:first'),
				el_image	= $el_title.attr('href'),
				$sub_menu	= $item.find('.ac_subitem'),
				$ac_close	= $sub_menu.find('.ac_close');
				
				/*
				 * user clicks one item
				 */
				$el_title.bind('click.Menu', function(e) {
						$.when(toggleMenuItems('down')).done(function(){
						openSubMenu($item, $sub_menu, el_image);
					});
					return false;
				});
				/* closes the submenu */
				$ac_close.bind('click.Menu', function(e) {
					closeSubMenu($sub_menu);
					return false;
				});
			});
		},
		openSubMenu			= function($item, $sub_menu, el_image) {
			$sub_menu.stop()
			.animate({
				height		: ($(window).height()) + 'px'
			}, 300, function() {
				resizeMenu();
				// the bg image changes
				showItemImage(el_image);
			});
		},
			/* changes the background image */
		showItemImage		= function(source) {
				// if its the current one return
			if($ac_bgimage.attr('src') === source)
				return false;
					
			var $itemImage = $('<img src="'+source+'" alt="Background" class="ac_bgimage"/>');
			$itemImage.insertBefore($ac_bgimage);
			adjustImageSize($itemImage);
			$ac_bgimage.fadeOut(500, function() {
				$(this).remove();
				$ac_bgimage = $itemImage;
			});
			$itemImage.fadeIn(500);
		},
		closeSubMenu		= function($sub_menu) {
			resizeMenu(true);
			$sub_menu.stop()
			.animate({
				height		: '0px',
				marginTop	: '0px'
			}, 300, function() {
				// show items
				toggleMenuItems('up');
			});
		},
			/*
			 * on window resize, ajust the bg image dimentions, and recalculate
			 * the menus width
			 */
		initWindowEvent		= function() {
			/* on window resize set the width for the menu */
			$(window).bind('resize.Menu' , function(e) {
				adjustImageSize($ac_bgimage);
				resizeMenu();
			});
		},
		
		resizeMenu = function(forceFullSize) {
			var new_w	= $(window).width() - $title.outerWidth(true);
			var animate = false;
			
			if (!forceFullSize) {
				$('.ac_subitem').each(function() {
					if ($(this).height() > 0) {
						new_w -= 600;
						animate = true;
						$(this).css('height', ($(window).height()) + 'px');
					}
				});
			}
			
			if (animate)
				$menu.animate({'width': new_w + 'px'}, 100);
			else
				$menu.css('width', new_w + 'px');
		},
			/* makes an image "fullscreen" and centered */
		adjustImageSize		= function($img) {
			var w_w	= $(window).width(),
			w_h	= $(window).height(),
			r_w	= w_h / w_w,
			i_w	= $img.width(),
			i_h	= $img.height(),
			r_i	= i_h / i_w,
			new_w,new_h,
			new_left,new_top;
				
			if(r_w > r_i){
				new_h	= w_h;
				new_w	= w_h / r_i;
			}
			else{
				new_h	= w_w * r_i;
				new_w	= w_w;
			}
				
			$img.css({
				width	: new_w + 'px',
				height	: new_h + 'px',
				left	: (w_w - new_w) / 2 + 'px',
				top		: (w_h - new_h) / 2 + 'px'
			});
		},
			/* preloads a set of images */
		loadImages			= function() {
			return $.Deferred(
			function(dfd) {
				var total_images 	= $ItemImages.length,
				loaded			= 0;
				for(var i = 0; i < total_images; ++i){
					$('<img/>').load(function() {
						++loaded;
						if(loaded === total_images)
							dfd.resolve();
					}).attr('src' , $ItemImages[i]);
				}
			}
		).promise();
		};
			
		return {
			init : init
		};
	})();

	/*
	 * call the init method of Menu
	 */
	Menu.init();

	$("#contact-form").submit(function(e) {
		e.preventDefault();
		
		var $form = $(this);
		var $fields = $form.find('input[type=text], textarea');

		var valid = $fields.filter('[value=""]').length == 0;
		if (!valid) {
			alert('Por favor preencha todos os campos.');
			return;
		}
		valid = $('#email').val().match(/^[A-Z0-9._%-]+@[A-Z0-9._%-]+\.[A-Z]{2,4}$/i);
		if (!valid) {
			alert('Por favor introduza um email válido.');
			return;
		}
		
		var data = $form.serialize();
		$.ajax('contact.php', {
			type: 'POST',
			data: data
		}).success(function(data) {
			if (data == '1') {
				alert('Mensagem enviada com sucesso!');
				$fields.val('');
			} else {
				alert('Erro ao enviar a mensagem! Por favor confirme os seus dados.');
			}
		}).error(function() {
			alert('Erro ao enviar a mensagem! Por favor confirme os seus dados.');
		});
	});
});

/*
the images preload plugin
*/
(function($) {
	$.fn.preload = function(options) {
		var opts 	= $.extend({}, $.fn.preload.defaults, options);
		o			= $.meta ? $.extend({}, opts, this.data()) : opts;
		var c		= this.length,
			l		= 0;
		return this.each(function() {
			var $i	= $(this);
			$('<img/>').load(function(i){
				++l;
				if(l == c) o.onComplete();
			}).attr('src',$i.attr('src'));	
		});
	};
	$.fn.preload.defaults = {
		onComplete	: function(){return false;}
	};
})(jQuery);

$(function() {
	var $tf_bg				= $('#tf_bg'),
		$tf_bg_images		= $tf_bg.find('img'),
		$tf_bg_img			= $tf_bg_images.eq(0),
		$tf_thumbs			= $('#tf_thumbs'),
		total				= $tf_bg_images.length,
		current				= 0,
		$tf_content_wrapper	= $('#tf_content_wrapper'),
		$tf_next			= $('#tf_next'),
		$tf_prev			= $('#tf_prev'),
		$tf_loading			= $('#tf_loading');
		intervalId			= 1;
	
	//preload the images				
	$tf_bg_images.preload({
		onComplete	: function(){
			$tf_loading.hide();
			init();
		}
	});
	
	//shows the first image and initializes events
	function init(){
		//get dimentions for the image, based on the windows size
		var dim	= getImageDim($tf_bg_img);
		//set the returned values and show the image
		$tf_bg_img.css({
			width	: dim.width,
			height	: dim.height,
			left	: dim.left,
			top		: dim.top
		}).fadeIn();
	
		//resizing the window resizes the $tf_bg_img
	$(window).bind('resize',function(){
		var dim	= getImageDim($tf_bg_img);
		$tf_bg_img.css({
			width	: dim.width,
			height	: dim.height,
			left	: dim.left,
			top		: dim.top
		});
	});

	/*
		//expand and fit the image to the screen
		$('#tf_zoom').live('click',
			function(){
			if($tf_bg_img.is(':animated'))
				return false;
	
				var $this	= $(this);
				if($this.hasClass('tf_zoom')){
					resize($tf_bg_img);
					$this.addClass('tf_fullscreen')
						 .removeClass('tf_zoom');
				}
				else{
					var dim	= getImageDim($tf_bg_img);
					$tf_bg_img.animate({
						width	: dim.width,
						height	: dim.height,
						top		: dim.top,
						left	: dim.left
					},350);
					$this.addClass('tf_zoom')
						 .removeClass('tf_fullscreen');	
				}
			}
		);
	*/
		
		//click the arrow down, scrolls down
		$tf_next.bind('click',function(){
			if($tf_bg_img.is(':animated'))
				return false;
				scroll('tb');
		});
		
		//click the arrow up, scrolls up
		$tf_prev.bind('click',function(){
			if($tf_bg_img.is(':animated'))
			return false;
			scroll('bt');
		});
		
		//mousewheel events - down / up button trigger the scroll down / up
		$(document).mousewheel(function(e, delta) {
			if($tf_bg_img.is(':animated'))
				return false;
				
			if(delta > 0)
				scroll('bt');
			else
				scroll('tb');
			return false;
		});
		
		//key events - down / up button trigger the scroll down / up
		$(document).keydown(function(e){
			if($tf_bg_img.is(':animated'))
				return false;
			
			switch(e.which){
				case 38:	
					scroll('bt');
					break;	

				case 40:	
					scroll('tb');
					break;
			}
		});

		jQuery.fx.interval = 50;
		resetInterval();
	}

	function resetInterval() {
		clearInterval(intervalId);
		intervalId = setInterval(function() { scroll('tb'); }, 5000);
	}
	
	//show next / prev image
	function scroll(dir){
		//if dir is "tb" (top -> bottom) increment current, 
		//else if "bt" decrement it
		current	= (dir == 'tb')?current + 1:current - 1;
		
		//we want a circular slideshow, 
		//so we need to check the limits of current
		if(current == total) current = 0;
		else if(current < 0) current = total - 1;

		/*
		//flip the thumb
		$tf_thumbs.flip({
			direction	: dir,
			speed		: 400,
			onBefore	: function(){
				//the new thumb is set here
				var content	= '<span id="tf_zoom" class="tf_zoom"></span>';
				content		+='<img src="' + $tf_bg_images.eq(current).attr('longdesc') + '" alt="Thumb' + (current+1) + '"/>';
				$tf_thumbs.html(content);
		}
		});
		*/

		//we get the next image
		var $tf_bg_img_next	= $tf_bg_images.eq(current),
			//its dimentions
			dim				= getImageDim($tf_bg_img_next),
			//the top should be one that makes the image out of the viewport
			//the image should be positioned up or down depending on the direction
				top	= (dir == 'tb')?$(window).height() + 'px':-parseFloat(dim.height,10) + 'px';
				
		//set the returned values and show the next image	
			$tf_bg_img_next.css({
				width	: dim.width,
				height	: dim.height,
				left	: dim.left,
				top		: top
			}).show();
			
		//now slide it to the viewport
			$tf_bg_img_next.stop().animate({
				top 	: dim.top
			},1000);
			
		//we want the old image to slide in the same direction, out of the viewport
			var slideTo	= (dir == 'tb')?-$tf_bg_img.height() + 'px':$(window).height() + 'px';
			$tf_bg_img.stop().animate({
				top 	: slideTo
			},1000,function(){
			//hide it
				$(this).hide();
			//the $tf_bg_img is now the shown image
				$tf_bg_img	= $tf_bg_img_next;
			//show the description for the new image
				$tf_content_wrapper.children()
								   .eq(current)
							       .show();
		});
		//hide the current description	
			$tf_content_wrapper.children(':visible').hide();

		resetInterval();
	}
	
	//animate the image to fit in the viewport
	function resize($img){
		var w_w	= $(window).width(),
			w_h	= $(window).height(),
			i_w	= $img.width(),
			i_h	= $img.height(),
			r_i	= i_h / i_w,
			new_w,new_h;
		
		if(i_w > i_h){
			new_w	= w_w;
			new_h	= w_w * r_i;
			
			if(new_h > w_h){
				new_h	= w_h;
				new_w	= w_h / r_i;
			}
		}	
		else{
			new_h	= w_w * r_i;
			new_w	= w_w;
		}
		
		$img.animate({
			width	: new_w + 'px',
			height	: new_h + 'px',
			top		: '0px',
			left	: '0px'
		},350);
	}
	
	//get dimentions of the image, 
	//in order to make it full size and centered
	function getImageDim($img){
		var w_w	= $(window).width(),
			w_h	= $(window).height(),
			r_w	= w_h / w_w,
			i_w	= $img.width(),
			i_h	= $img.height(),
			r_i	= i_h / i_w,
			new_w,new_h,
			new_left,new_top;
		
		if(r_w > r_i){
			new_h	= w_h;
			new_w	= w_h / r_i;
		}
		else{
			new_h	= w_w * r_i;
			new_w	= w_w;
		}


		return {
			width	: new_w + 'px',
			height	: new_h + 'px',
			left	: (w_w - new_w) / 2 + 'px',
			top		: (w_h - new_h) / 2 + 'px'
		};
		}
});