// **************************************************
//
// Client logo slider on /index.php
//
// **************************************************

function clientLogoScroller () {
	// Use a variable so we only get the object once
	var client_logos_img = $('#client_logos_img');
	
	// If the object doesn't exist, don't bother with this function
	if(client_logos_img.length <= 0){
		return false;
	}
	
	// Track whether buttons are clicked to prevent double clicks
	// double clicks fire multiple events and will break the scroller
	var clicked = false;

	// Start with the left arrow disabled
	$('.scroller_left').addClass('disabled');

	// Get the width of the logo scroller area
	var width = $('#client_logos_scroller').width();
	
	// Get the width of the long logo image
	var img_width = client_logos_img.width();
	
	// Clicking left or right
	$('.scroller').click(function(){
		var _t = $(this);
	
		// Click already in progress, don't bother
		if (clicked) {
			return false;
		}
		// If the scroller is disabled, don't bother with this function
		if (_t.hasClass('disabled')) {
			return false;
		}	
		
		// Set click state, this is undone in the animate callback
		clicked = true;
		

		// Remove all disabled classes
		$('.scroller').removeClass('disabled');
		
		// Determine which slider controler is being clicked
		var slideleft = _t.hasClass('scroller_left');
		
		// Get the current position
		var position = parseInt(client_logos_img.position().left);
		
		// Get the position to the Left and Right where we'll move to
		var nextpositionR = parseInt(position) - parseInt(width*2);
		var nextpositionL = parseInt(position) + parseInt(width);
		
		// Increment to move to
		var moveTo = (slideleft ? "+=" : "-=") +width;

		// If sliding left and the moving to a position that is greater than 0 disable 
		if (slideleft && nextpositionL >= 0) {
			_t.addClass('disabled');
		} else if (!slideleft && nextpositionR <= (img_width * -1)) {
			_t.addClass('disabled');
		}
		
		// Slide the logos
		client_logos_img.animate({left:moveTo},1000,null,function(){clicked=false;});		
		
		return false;
	});

}

// **************************************************
//
// View clients /portfolio/index.php
//
// **************************************************

var portfolioViewClients_clicked = false;

// Set the text for the link
var client_view_text = 'Client List'; //View List

function portfolioViewClients () {
	var show_client_filters = $('#show_client_filters');
	if (show_client_filters.length <= 0) {
		return false;
	}
	
	var client_logos_box = $('#client_logos_box');

	// Set the link text
	show_client_filters.text(client_view_text);
	
	// Set the onclick for showing the client filter
	show_client_filters.click(function() {
		if (portfolioViewClients_clicked) {
			return false;
		}
		
		portfolioViewClients_clicked = true;
	
		// Remove all active classes
		//$('.filter_active').removeClass('filter_active');
		
		// If the client box has no height, show it -- if it has height, hide it
		if (client_logos_box.height() == 0) {
			$(this).text('Hide Clients'); //Hide List
			$(this).addClass('closeList');
			client_logos_box.animate({
				height:"635px"
			}, 500,null,function(){portfolioViewClients_clicked=false;});
			/*$('#portfolio_selections').animate({
				height:"0px"															 
			}, 500);*/
		} else {
			portfolioCloseClients($(this),client_logos_box,false);
			$('.closeList').removeClass('closeList');
		}
		
		return false;
	});
}

function portfolioCloseClients (_t,client_logos_box,height_reset) {
	//kamal
	portfolioHeight = $('#portfolio_selections').height();
	//portfolioHeightLocal = $('#portfolio_selections').height();
	//alert(portfolioHeight);
	//$('#portfolio_selections').height(portfolioHeightLocal);
	
	
	_t.text(client_view_text);
	client_logos_box.animate({
		height:"0px"
	}, 500,null,function(){portfolioViewClients_clicked=false;});
	
	$('#portfolio_selections').animate({
		height:portfolioHeight+"px"														 
	}, 500,null,function(){
		// Reset the height to auto after animation
		if (height_reset == true) {
			$(this).css('height','auto');
		}
	});			
	
	// Select the active filter
	//$('.filters li:first').addClass('filter_active');					
	//portfolioFilterToType('all', portfolioHeight);	
}

// **************************************************
//
// Main portfolio filter bar on /portfolio/index.php
//
// **************************************************

var portfolioHeight = null;
var LargeportfolioHeight = null;
function portfolioFilterBar () {
	// Grab and set the height of the div so it doesn't jump when things are shown and hidden
	portfolioHeight = $('#portfolio_selections').height();
	//kamal
	LargeportfolioHeight = portfolioHeight;
	$('#portfolio_selections').height(portfolioHeight);

	// Select the active filter
	$('.filters li:first').addClass('filter_active');
	
	// Add click events to each item
	$('.filters li').bind('click', function() {		
		// Get the location of the bar to scroll to it
		$('html,body').css('scrollTop', $('h1').offset().top);				
		
		// Remove all active classes
		$('.filter_active').removeClass('filter_active');
		
		// Set the current active option
		$(this).addClass('filter_active');
		
		// Get the text in the filter
		var type = $(this).text();


		var hide_array = new Array();
		var show_array = new Array();
		var show_parent_array = new Array();
		// Loop through each parent and animate based on the class name
		portfolioFilterToType(type, portfolioHeight, hide_array, show_array, show_parent_array ); 

		for(var i=0; i < hide_array.length;i++){
			var _p = hide_array[i];
			_p.animate({ 
			width: "0",
			opacity: "0"
			}, 0,null,function(){_p.css("display", "none");});
		}
	 
		for(var i=0; i < show_array.length;i++){
			show_array[i].css("display", "block");
			show_parent_array[i].css("display", "block");
			show_parent_array[i].animate({ 
			width: "24em",
			opacity: "100"
			}, 700);
	
		}
		
	});	
				

}

// Function to filter to a specific type 
function portfolioFilterToType(type, portfolioHeight, hide_array, show_array, show_parent_array) {
	$('.portfolio_site_snip').each(function(){
		var _t = $(this);
		var _p = $(this).parent();
		
		// hide client list if clicked here
	
		var lowertype = type.toLowerCase();	//hide all elements
		hide_array.push(_p);
		
		// If the section has the class of the current text, show it
		if (_p.hasClass(lowertype)) {			
			show_array.push(_t);
			show_parent_array.push(_p);
			
		} 

	});
}


// **************************************************
//
// Portfolio Browser on /index.php
//
// **************************************************

function portfolioBrowser() {
	$("#pbrowser").accordion();
	
	$("#pbrowser h3").bind('click',function(){
		var tabindex = $(this).parent().attr('tabindex');
		var count = 0;
		$('.carousels_carousel').each(function(){
			count++;
			if (count == tabindex) {
				$('#carousel'+count).animate({
				 height:"425px"
				 },400);		
			} else {
				$('#carousel'+count).animate({
				 height:"0px"
				 },400);
			}
		});	
	});
}

// **************************************************
//
// "Fun facts" card flipper
//
// **************************************************

function flippyDo () {
	$(".portfolio_site_snip").hover(
		function() {
			$(this).addClass('hover');
		},
		function() {
			$(this).removeClass('hover');
		}
	);
	
	var flippy_clicked = false;
	$(".portfolio_site_snip .flippy").click(function(){
		if (flippy_clicked) {
			return false;
		}
		flippy_clicked = true;
		var _t = $(this);
		var o = _t.parent().parent();
		o.flip({ 
			direction: 'lr', 
			color: '#fff', 
			speed: 350,
			onEnd: function(){
				flippy_clicked = false;
				o.addClass('flipped');
			}
		});
		return false;
	});
	
	var floppy_clicked = false;
	$(".portfolio_site_snip .floppy").click(function(){
		if (floppy_clicked) {
			return false;
		}
		floppy_clicked = true;
		var _t = $(this);
		var o = _t.parent().parent();	
		o.flip({ 
			direction: 'lr', 
			color: '#fff',
			speed: 350,
			onEnd: function(){
				floppy_clicked = false;
				o.removeClass('flipped');
			}
		});
		return false;
	});	
}

// **************************************************
//
// Portfolio snip enlarger on /portfolio/index.php
//
// **************************************************

// Sets up the clicks to zoom in on a particular card
function portfolioCards () {
	$('.project_link').click(function(){
		var _t = $(this).parent().parent().parent();
		if (_t.attr('target') == undefined){
		 	_t = $(this);	
		}
//flip cards back here
		$('.flipped').css('background-color', '#FFF');
		$('.flipped').removeClass('flipped');
		
		portfolioZoomIn(_t);
		return false;		
	});
}

function portfolioZoomIn (_t) {
	$.ajax({
	  url: "ajax_get_portfolio_site.php",
	  data: "page="+_t.attr('target'),
	  cache: false,
	  success: function(html){
	  
		$('#portfolio_bigtime').html(html);
		$('#portfolio_bigtime').fadeIn("slow", function (){
					 $('.picmeta').show("slide", {direction:"down"}, 1000);
														 });	
		
		$('.active_portfolio_site').removeClass('active_portfolio_site');
		$('#portfolio_selections').css('height','auto').addClass('has_active_site');
		
		_t.addClass('active_portfolio_site');
	  
		$('.portfolio_site_snip').parent().each(function(){
			$(this).animate({
				//need to set to pixels for chrome, which wasn't handling % well
				fontSize:"3px"
		
			},600);
		});
		
		hovers();
		carousel();	
		
		$('html,body').css('scrollTop', $('#content').offset().top);
	  }
	});	
}

// Zooms out of an enlarged card
function portfolioZoomOut () {
		
	$("#carousel").remove();
	$('.active_portfolio_site').removeClass('active_portfolio_site');
	$('#portfolio_selections').removeClass('has_active_site').css('height',portfolioHeight+'px');		
	$('.portfolio_site_snip').parent().each(function(){
		$(this).animate({
			fontSize:"100%"
		},400);
	});	

	$('#portfolio_bigtime').fadeOut().html();	
	//kamal
	portfolioHeight = LargeportfolioHeight;
	//alert(portfolioHeight);
	$('#portfolio_selections').height(portfolioHeight);
	
}

function portfolioClientLink () {
	$('.client_link').click(function(){
		portfolioCloseClients($('#show_client_filters'),$('#client_logos_box'),true);
		var _t = $(this);
		portfolioZoomIn($('#'+_t.attr('target').replace(/.php/,'')));
		return false;		
	});
}

// **************************************************
//
// Carousel on a portfolio case study page /portfolio/yahoo.php
//
// **************************************************

function carousel () {
	carousel_clicks($('a.carousel-prev'),1, 0);

	// Build the carousel for portfolio viewers
	$("#carousel").jcarousel({
		scroll: 1,
		initCallback: carousel_initCallback,		
		buttonNextHTML: null,
		buttonPrevHTML: null
	});	
	//add selected dot to first image
	$("#image_dot_1").addClass("selected");
}


function carousel_initCallback(carousel) {

    $('a.carousel-next').click(function() {
		if(!$(this).hasClass('disabled')){ 
			carousel.next();
			//move selected image dot
			moveImageDot("forward");
		}
		carousel_clicks($(this), carousel.first, 1);		
        return false;
    });
    $('a.carousel-prev').click(function() {			
			if(!$(this).hasClass('disabled')){ 
				carousel.prev();
				//move selected image dot
				moveImageDot("backward");
			}
			carousel_clicks($(this), carousel.first, 0);

        return false;
    });
	
}

function carousel_clicks(_t, pos, is_next) {
	$('.disabled').removeClass('disabled');
	
	var total = $("#carousel li").size();
	//alert(total);
	//alert(pos);
	//disable chrome since next/previous is not currently working for that browser
	if(total == 1 || navigator.userAgent.toLowerCase().indexOf('chrome') > -1 || navigator.userAgent.toLowerCase().indexOf('safari') > -1){
		$("#portfolio_image_browser").hide();
	}
	if (!is_next && (pos - 1) < 1) {
		_t.addClass('disabled');
		return false;
	}
	
	if (is_next && (pos) >= total) {
		_t.addClass('disabled');
		return false;
	}
	
}

function moveImageDot(direction){
			
	var current_image_dot_id = $("#image_dots .selected").attr("id");
	var current_image_dot_num = current_image_dot_id.slice(-1);
	
	$("#" + current_image_dot_id).removeClass("selected");
	
	if(direction == "forward"){
		current_image_dot_num++;
	}else{
		current_image_dot_num--;
	}
	var new_image_dot_id = "image_dot_" + current_image_dot_num;
	$("#" + new_image_dot_id).addClass("selected");
	
}
// **************************************************
//
// Looks for any hover notes and sets them up
//
// **************************************************

var hover_timeout = null;
function hovers() {
	/*
	// home page (_SITE_DIR/index.php)
	$('.hover_note').parent().parent().hover(function () {	
		clearTimeout(hover_timeout);
		$(this).addClass('hover_note_parent');
		$('.hover_note_parent .hover_note').fadeIn("slow");
		$('.big_portfolio_image_src').animate({opacity:.8}, 500 );
    },function () {
    	hover_timeout = setTimeout(function(){
			$('.hover_note_parent .hover_note').fadeOut("slow");    	
    		$(this).removeClass('hover_note_parent');
    	}, 500);
		$('.big_portfolio_image_src').animate({opacity:1}, 500 );
	});
*/

	// home page, portfolio project pages
	$('.hover_note, .hover_note_arrow_top, .hover_note_arrow_bottom, .hover_note_arrow_left, .hover_note_arrow_right, .hover_note_arrow_bottom_right,.hover_note_arrow_top_left').parent().parent().hover(function () {
		clearTimeout(hover_timeout);
		$(this).addClass('hover_note_parent');
		$('.hover_note_parent .hover_note, .hover_note_arrow_top, .hover_note_arrow_bottom, .hover_note_arrow_left, .hover_note_arrow_right, .hover_note_arrow_bottom_right,.hover_note_arrow_top_left').fadeIn('slow');
		$('.big_portfolio_image_src').animate({opacity:.8}, 500);
	}, function () {
		hover_timeout = setTimeout(function() {
			$('.hover_note_parent .hover_note, .hover_note_arrow_top, .hover_note_arrow_bottom, .hover_note_arrow_left, .hover_note_arrow_right, .hover_note_arrow_bottom_right,.hover_note_arrow_top_left').fadeOut('slow');
			$(this).removeClass('hover_note_parent');
		}, 500);
		$('.big_portfolio_image_src').animate({opacity:1}, 500);
	});
}

// **************************************************
//
// About Us Page
//
// **************************************************

function closeTextBox(text_id){
	$(text_id).hide("blind");

	$('.people_select').animate({height:"226px"}, 400, null, function (){
			$(text_id).removeClass('text_open');
	});
	$('.people_select').removeClass('hide');
	
			
	//make none of the selector tabs selected
	$('.people_select_current').removeClass('people_select_current');
	
}

function setUpAboutUsCloseButton() {
	//set up close buttons in people text
	$('.close_button').bind('click',function(event,ui){
		var close_text = "#" + $(event.target).parent().attr('id');
		closeTextBox(close_text);
	
	});
}

function setUpAboutUsCloseLink() {
	//sets up close link when going to see more info about the job post
	$('.close_link').bind('click',function(event,ui){
		var close_text = "#" + $(event.target).parent().attr('id');
		closeTextBox(close_text);
	
	});
}

function setUpAboutUsPeopleSelect() {
	//set up behavior when people select boxes are clicked
	$('.people_select').bind('click', function(event,ui){
		var select_id = "#" + this.id;
		var text_id ="#" + this.id + "_text";	

		//make none of the selector tabs selected
		$('.people_select_current').removeClass('people_select_current');		
		
		if($(".text_open").length>0){
			//if currently selected id is already open, close it and make name boxes big again
			if($(text_id).hasClass('text_open')){	
				closeTextBox(text_id);
				
			} else{
			//close the current open text box
				$('.text_open').animate({opacity:0},200, null, function(){
					$('.text_open').hide();
					$('.text_open').removeClass('text_open');
					//open the currently selected text box and make the name boxes small
					$(text_id).css("opacity",0);
					$(text_id).show();
					$(text_id).addClass('text_open');
					$(text_id).animate({opacity:1},200, null, function(){});
					});
					$('.people_select').animate({height:"50px"}, 200);
					//make the current tab selected
					$(select_id).addClass('people_select_current');
					
			}
		}else{
			//just open a box
			$(text_id).addClass('text_open');
			$('.people_select').addClass('hide');
			//$(text_id).css('opacity',0);
			$('.people_select').animate({height:"50px"}, 200);
			$(text_id).show("blind", null, null, function(){
		    	$(text_id).animate({opacity:1},100);
		    });
			//make the current tab selected
			$(select_id).addClass('people_select_current');
			
		}
	});
}

function setUpAboutUs(){
	setUpAboutUsCloseButton();
	setUpAboutUsCloseLink();
	setUpAboutUsPeopleSelect();
}

// **************************************************
//
// Newsletter show / hide available on every page
//
// **************************************************

function newsletter () {
	$('#header #newsletter a').click(function(){
		$(this).fadeOut();
		$('#newsletter_form').animate({
			height:"6em"
		},200);
		return false;
	});
	
	$('#newsletter_form #newsletter_close').click(function(){
		$('#newsletter a').fadeIn();
		$('#newsletter_form').animate({
			height:"0"
		},200);
		return false;
	});
}

// **************************************************
//
// Select the active page in the nav
//
// **************************************************

function navSelectActive () {
	var bodyClass = $('body').attr('class');
	$('#menu .'+bodyClass).addClass('selected');
}

// **************************************************
//
// Call all the functions on page load
//
// **************************************************


$(document).ready(function() {

	// Pages: /about/index.php
	//fullbioLinks();
	setUpAboutUs();

	
	// Pages: /portfolio/index.php, /portfolio/yahoo.php
	portfolioClientLink();
	portfolioCards();
	portfolioFilterBar();
	portfolioViewClients();
	portfolioBrowser();
	flippyDo();
	carousel();
	
	// Pages: /index.php
	clientLogoScroller();
	/*carousel*/
	jQuery('#mycarousel').jcarousel({
        visible: 3
    });
	
	/*equal column heights - home*/
	var highestCol = Math.max($('#blog .colTwo').height(),$('.colThree').height());
	$('.elements').height(highestCol);
	
	/*equal column heights - services*/
	var highestCol = Math.max($('.row .miniCol').height());
	$('.mini').height(highestCol);

	// Pages: / *
	newsletter();
	hovers();	
	navSelectActive();
	
	
	//Infinite Scroller for Home Page Client Logos
	//move the last list item before the first item. The purpose of this is if the user clicks to slide left he will be able to see the last item.
	$('#carousel_ul li:first').before($('#carousel_ul li:last')); 
	
	
	//when user clicks the image for sliding right        
	$('#right_scroll img').click(function(){
	
		//get the width of the items ( i like making the jquery part dynamic, so if you change the width in the css you won't have to change it here too ) '
		var item_width = $('#carousel_ul li').outerWidth() + 10;
		
		//calculate the new left indent of the unordered list
		var left_indent = parseInt($('#carousel_ul').css('left')) - item_width;
		
		//make the sliding effect using jquery's anumate function '
		$('#carousel_ul:not(:animated)').animate({'left' : left_indent},500,function(){    
			
			//get the first list item and put it after the last list item (that's how the infinite effects is made) '
			$('#carousel_ul li:last').after($('#carousel_ul li:first')); 
			
			//and get the left indent to the default -210px
			$('#carousel_ul').css({'left' : '-210px'});
		}); 
	});
	
	//when user clicks the image for sliding left
	$('#left_scroll img').click(function(){
		
		var item_width = $('#carousel_ul li').outerWidth() + 10;
		
		// same as for sliding right except that it's current left indent + the item width (for the sliding right it's - item_width)
		var left_indent = parseInt($('#carousel_ul').css('left')) + item_width;
		
		$('#carousel_ul:not(:animated)').animate({'left' : left_indent},500,function(){    
		
		// when sliding to left we are moving the last item before the first list item
		$('#carousel_ul li:first').before($('#carousel_ul li:last')); 
		
		// and again, when we make that change we are setting the left indent of our unordered list to the default -210px
		$('#carousel_ul').css({'left' : '-210px'});
		});
		
		
	});
	
	// FIXME:  Damon testing alternative solution
	/*
	$(function() {
		$('.jcarousellite_homepage').jCarouselLite({
			// circular by default
			btnNext: '.jcarousellite_next',
	        btnPrev: '.jcarousellite_prev',
			scroll: 3,
			speed: 800
		});
	});
	*/
});


