/* Can wait, not important to execute on document.ready event */
$(document).ready(function() {
	
	var container = $('div.support');
	var node = container.find('div.scrollbar');
	var team_list = container.find('div.team ul');
	
	/*
	 * Person picture and url
	 */
	var person_pic = container.find('div.person img');
	var person_link = container.find('div.person a');
	var person_name = container.find('div.person p.name');
	var person_position = container.find('div.person p.position');
	var person_message = container.find('div.bubble u');
	
	/*
	 * Team members
	 */
	WidgetSupport = $.extend(WidgetSupport, {
		scrollInView: function (index) {
			var offset = team_nodes.eq(0).outerWidth() * (index - 2);
				offset = Math.max(0, offset);
			
			team_list.animate({
				marginLeft: - offset + 'px'
			}, 'fast');
		},
		
		setCountry: function (country) {
			if (country in this.teamByCountry) {
				//Update list
				this.team = this.teamByCountry[country];
			} else {
				//Update list
				this.team = new Array();
				for (var country in this.teamByCountry)
					for (var key in this.teamByCountry[country]) this.team.push(this.teamByCountry[country][key]);
			}
			
			team_list.html('');
			this.selected = -1;
			
			//Generate html
			var html = '';
			for(var i=0, ii=this.team.length; i<ii; i++) {
				
				html += '<li class="' + (i==0 ? 'selected' : '') + '">\
								<a href="' + this.team[i].url + '"></a><img src="' + this.team[i][(i == 0 ? 'img_medium' : 'img_small')] + '" alt="" />\
						   </li>';
			}
			
			team_list.html(html);
			
			//Show/hide container if more/less that 1 person
			if (this.team.length > 1) {
				team_list.parents('div.team').removeClass('hidden');
			} else {
				team_list.parents('div.team').addClass('hidden');
			}
			
			//Set indexes
			team_nodes = team_list.find('li');
			team_nodes.each(function (index) {
				$(this).data('index', index);
			});
			
			this.select(0);
			

			var amount = team_list.find('li').size();
			if (amount < 5) {
				var offset = (182 - (1 * 51 + (amount-1) * 32)) / 2;
				team_list.css({'margin-left': offset});
			} else team_list.css({'margin-left': 0});
		},
		select: function (index) {
			if (this.selected == index) return;
			this.deselect(this.selected);
			
			team_nodes.eq(index).addClass('selected');
			team_nodes.eq(index).find('img').get(0).src = WidgetSupport.team[index]['img_medium'];
			
			person_pic.get(0).src = WidgetSupport.team[index]['img_large'];
			person_link.attr('href', WidgetSupport.team[index]['url']);
			person_name.html(WidgetSupport.team[index]['name']);
			person_position.html(WidgetSupport.team[index]['position']);
			person_message.html(WidgetSupport.team[index]['message'].replace(/&nbsp;/g, ' '));
			
			this.selected = index;
			
			
			var first = team_list.find('li:first');
			var last = team_list.find('li:last');
			
			var first2 = team_list.find('li:first').next();
			var last2 = team_list.find('li:last').prev();
			

			var amount = team_list.find('li').size(); 
			if (amount > 5) {
			for (var i = 0; i < 5; i++) if (team_list.find('li').eq(i).hasClass('selected')) break;
			
			if (i < 2) {
				last.insertBefore(first);
				if (i == 0) last2.insertBefore(last);
			} else {
				first.insertAfter(last);
				if (i == 4) first2.insertAfter(first);
			}
			}
			//this.scrollInView(this.selected);
			

		},
		deselect: function (index) {
			if (index >= 0) {
				team_nodes.eq(index).removeClass('selected');
				team_nodes.eq(index).find('img').get(0).src = WidgetSupport.team[index]['img_small'];
			}
		}
	});
	
	var team_nodes = team_list.find('li');
	team_nodes.each(function (index) {
		$(this).data('index', index);
	});
	
	team_list.delegate('li', 'click', function (evt) {
		var index = $(this).data('index');
		WidgetSupport.select(index);
		
		evt.preventDefault();
	});
	
	var amount = team_list.find('li').size();
	if (amount < 5) {
		var offset = (182 - (1 * 51 + (amount-1) * 32)) / 2;
		team_list.css({'margin-left': offset});
	} else team_list.css({'margin-left': 0});
});

var WidgetSupport = {
	team: {},
	teamByCountry: {},
	selected: 2
};
