$(document).ready(function() {

	var $test = $('#theteam_content p a#test');
	
	$test.click(function() {
			$("#theteam_content").load('http://metapixel.com.ph/wp-content/themes/metapixel/the-team #theteam_content');
	});

	$('.portfolio_media_menu_box_image h1').after('<div class="icon-glass"><!-- --></div>');
	$('.portfolio_media_menu_box_image h1').after('<div class="icon-flash"><!-- --></div>');
	$('.portfolio_media_menu_box_image h1').before('<div class="icon-selected"><!-- --></div>');
	
	$('.icon-glass').css({left: -175});
	$('.icon-flash').css({opacity: 0});
	$('.icon-selected').css({opacity: 0});
	
	var $iconGlass = $('.icon-glass');
	var $iconFlash = $('.icon-flash');
	
	$('.portfolio_media_menu_box_image').hover(
		function () {
			$(this).children('.icon-flash').stop().animate({opacity: "1"}, 40).animate({opacity: "0"}, 200);
			$(this).children('.icon-glass').stop().animate({
				left: '80px'
			}, {
				duration: 200,
				easing: 'easeOutQuint'
			});
		},
		function () {
			$(this).children('.icon-glass').stop().animate({
				left: '-175px'
			}, {
				duration: 200,
				easing: 'easeInQuint'
			});
		}
	);
	
	$('#portfolio_media_menu_container a:first').addClass('menuIconSelected').find('.icon-selected').stop().fadeTo(200, 0.4);
	
	$('#portfolio_media_menu_container a').click(function selectIcon() {
		$(this).parents('#portfolio_media_menu_container:first').find('.menuIconSelected').find('.icon-selected').stop().fadeTo(200, 0);
		$(this).parents('#portfolio_media_menu_container:first').find('a').removeClass('menuIconSelected');
		$(this).addClass('menuIconSelected');
		$(this).find('.icon-selected').stop().fadeTo(200, 0.4);
	});

	
	var $menuPanels = $('#portfolio_media_menu_scroll .portfolio_media_menu_box_panel');
	var $menuContainer = $('#portfolio_media_menu_scroll #portfolio_media_menu_container');
	var $menuScroll = $('#portfolio_media_menu_scroll').css('overflow', 'hidden');
	
	$menuScroll
  		.before('<img class="portfolio_menu_scrollButtons left" src="http://metapixel.com.ph/wp-content/themes/metapixel/portfolio/menu-left.png" />')
  		.after('<img class="portfolio_menu_scrollButtons right" src="http://metapixel.com.ph/wp-content/themes/metapixel/portfolio/menu-right.png" />');

	var menuScrollOptions = {
		target: $menuScroll,
		items: $menuPanels,
		prev: 'img.left',
		next: 'img.right',
		axis: 'xy',
		duration: 1600,
		constant: false,
		easing: 'easeInOutQuint',
		lock: false,
		offset: {top:0, left:-250},
		queue: true,
		stop: true
	};

	
	$('#portfolio_media_menu').serialScroll(menuScrollOptions);
	
	// animation for left and right buttons on mouse click
	$('.portfolio_menu_scrollButtons.left').mousedown(function() {
		$(this).stop().animate({
			left: '27px'
		}, 100);
	});
	$('.portfolio_menu_scrollButtons.left').mouseup(function() {
		$(this).stop().animate({
			left: '32px'
		}, 100);
	});	
	$('.portfolio_menu_scrollButtons.right').mousedown(function() {
		$(this).stop().animate({
			left: '869px'
		}, 100);
	});
	$('.portfolio_menu_scrollButtons.right').mouseup(function() {
		$(this).stop().animate({
			left: '864px'
		}, 100);
	});
	
	
	
	var $sliderPanels = $('#portfolio_slider_mid_scroll .portfolio_slider_mid_panel');
	var $sliderContainer = $('#portfolio_slider_mid_scroll #portfolio_slider_mid_container');
	var $sliderScroll = $('#portfolio_slider_mid_scroll').css('overflow', 'hidden');
	var sliderHorizontal = true;
	
	if (sliderHorizontal) {
	  // calculate a new width for the container (so it holds all panels)
	  $sliderContainer.css('width', $sliderPanels[0].offsetWidth * $sliderPanels.length);
	}
	
	var sliderScrollOptions = {
		target: $sliderScroll,
		items: $sliderPanels,
		axis: 'xy',
		duration: 1600,
		constant: false,
		easing: 'easeInOutQuint',
		lock: false,
		queue: true,
		stop: true
	};
	
	$('#portfolio_media_menu_container').localScroll(sliderScrollOptions);

});