// JavaScript Document
var percent_change = 10;
var transition_length = 500; //miliseconds

var image_settings = new Array;
var in_animation = false;

var wait_animate_from = null;
var wait_animate_element;
var wait_animate = null;

function set_waiting_timeout(element) {
	if(element != null) {
		wait_animate_element = element;
	}
	
	if(wait_animate_from == null) {
		enlarge_image(wait_animate_element);
		if(wait_animate != null) {
			clearTimeout(wait_animate);
			wait_animate = null;
		}
	} else {
		wait_animate = setTimeout("set_waiting_timeout()", 10);
	}
}

function start_demographics() {
//	$('.people_top a').animate({opacity: 0}, 0);
	$('.people a').each(function() {
		var element = $(this);
		var id = element.attr('id');
		image_attr = new Array;
		image_attr['max_width'] = $('img', element).width();
		image_attr['max_height'] = $('img', element).height();
		image_attr['min_width'] = shrink_image_pct(image_attr['max_width']);
		image_attr['min_height'] = shrink_image_pct(image_attr['max_height']);
		image_attr['src_bw'] = $('img', element).attr('src');
		image_attr['src_color'] = get_image_src_color(image_attr['src_bw'], id);
		image_settings[id] = image_attr;
		element.addClass('active');
		shrink_image(element, true);
	});
	
	enlarge_image(null, true);
}

function enlarge_image(element, no_animation) {
	if(no_animation == null) no_animation = false;
	
	shrink_active_images(element);
	
	if(element == null) element = select_first_element();
	
	if(element.hasClass('active') == false) {
		var id = element.attr('id');
		var img = $('img', element);
		var info = $('#info_' + id);
		var title = $('#title_' + id);
		var top = $('#top_' + id);
		var img_attr = new Array;
		img_attr['width'] = img.width();
		img_attr['height'] = img.height();
		
		if(img_attr['width'] < image_settings[id]['max_width'] && img_attr['height'] < image_settings[id]['max_height'] && in_animation==false) {
			if(no_animation == true) {
				custom_transition_length = 0;
			} else {
				custom_transition_length = transition_length;
			}
			in_animation = true;
			wait_animate_from = id;
			element.animate({width: image_settings[id]['max_width'], height: image_settings[id]['max_height']}, custom_transition_length);
			top.animate({width: image_settings[id]['max_width'], height: image_settings[id]['max_height']}, custom_transition_length);
			img.attr('src', image_settings[id]['src_color']).animate({width: image_settings[id]['max_width'], height: image_settings[id]['max_height']}, custom_transition_length, function() {
				in_animation = false;
				wait_animate_from = null;
			});
			element.addClass('active');
			info.fadeIn(custom_transition_length);
			title.fadeIn(custom_transition_length);
		}
	}
}

function shrink_image(element, no_animation) {
	if(no_animation == null) no_animation = false;
	
	if(element.hasClass('active') == true) {
		var id = element.attr('id');
		var img = $('img', element);
		var info = $('#info_' + id);
		var title = $('#title_' + id);
		var top = $('#top_' + id);
		var img_attr = new Array;
		img_attr['width'] = img.width();
		img_attr['height'] = img.height();
		
		if(img_attr['width'] > image_settings[id]['min_width'] && img_attr['height'] > image_settings[id]['min_height']) {
			if(no_animation == true) {
				custom_transition_length = 0;
			} else {
				custom_transition_length = transition_length;
			}
//			in_animation = true;
			element.animate({width: image_settings[id]['min_width'], height: image_settings[id]['min_height']}, custom_transition_length);
			top.animate({width: image_settings[id]['min_width'], height: image_settings[id]['min_height']}, custom_transition_length);
			img.attr('src', image_settings[id]['src_bw']).animate({width: image_settings[id]['min_width'], height: image_settings[id]['min_height']}, custom_transition_length, function() {
				in_animation = false;
			});
			element.removeClass('active');
			info.fadeOut(custom_transition_length);
			title.fadeOut(custom_transition_length);
		}
	}
}

function shrink_active_images(element) {
	if(element == null) {
		ignore_id = null;
	} else {
		ignore_id = element.attr('id');
	}
	$('.people a.active').each(function() {
		var this_id = $(this).attr('id');
		if(this_id != ignore_id) {
			shrink_image($(this));
		}
	});
}

function enlarge_image_pct(dim) {
	dim = parseInt(dim);
	dim = dim * (100 / (100 - percent_change));
	return Math.round(dim);
}

function shrink_image_pct(dim) {
	dim = parseInt(dim);
	dim = dim * ((100 - percent_change) / 100);
	return Math.round(dim);
}

function select_first_element() {
	return $('.people > a:first');
}

function get_image_src_color(src_bw, id) {
	var file_name = id + '_bw';
	return src_color = src_bw.replace(file_name, id);
}

$(document).ready(function() {
	$('.people_top a').mouseover(function() {
		var id = $(this).attr('id').substring(4);
		var element = $('#' + id);
		set_waiting_timeout(element);
	});
	
	start_demographics();
});