function addHomepagePeople()
{
	// add people from XML
	$.ajax({
		type: "GET",
		url: "/people.xml",
		dataType: "xml",
		success: function(xml) {
			personId = 0;
			$(xml).find('person').each(function(){
				// set vars						
				var firstname = $(this).attr('firstname');
				var lastname = $(this).attr('lastname');
				var jobtitle = $(this).attr('jobtitle');
				var avatar = $(this).attr('avatar');
				var bio = $(this).find('bio').text();
				
				// add div to hero
				$('<div class="person avatar'+avatar+'" id="person_'+personId+'"></div>').appendTo('#hero');
				$('<div class="personBio" id="person_'+personId+'_bio"><div class="avatarclose"></div><span class="avatarname">'+firstname+' '+lastname+'</span><br /><span class="avatarjob">'+jobtitle+'</span><br/><span class="avatarbio">'+bio+'</span></div>').appendTo('#hero');
				
				$('.avatarclose')
					.click(function(){
						$('.personBio:not(#'+$(this).attr("id")+'_bio)').fadeOut(250);
						// set childrenVisible attribute
						$('.person').attr('childrenVisible', 'false');
						// stop sprites
						$('.person').spStop(true);	
					
					})
				;
				
				// interact
				$('#person_'+personId)
					.sprite({fps: 15, no_of_frames: 30})
					.spStop(true)
					.mouseenter(function(){
						// nothing anymore because mobile devices don't have a mouse enter
					})
					.mouseleave(function(){
						// nothing anymore because mobile devices don't have a mouse leave
					})
					.attr('childrenVisible', 'false')
					.click(function(){
						// hide all other information
						$('.personBio:not(#'+$(this).attr("id")+'_bio)').fadeOut(250);
						// set childrenVisible attribute
						$('.person:not(#'+$(this).attr("id")+')').attr('childrenVisible', 'false');
						// stop sprites
						$('.person:not(#'+$(this).attr("id")+')').spStop(true);
						
						// show/hide this information
						if($(this).attr('childrenVisible') == 'true')
						{
							$("#" + $(this).attr("id") + "_bio").fadeOut(250);
							$(this).attr('childrenVisible', 'false');
							$(this).spStop(true);
						}
						else
						{
							var pos = $(this).position();
							if(pos.left>700)
							{
								var posLeft = pos.left - 270;
							}
							else
							{
								var posLeft = pos.left + 50;
							}
							
							var posTop = pos.top - 30;
							$("#" + $(this).attr("id") + "_bio").css('left', posLeft + 'px');
							$("#" + $(this).attr("id") + "_bio").css('top', (posTop + 20) + 'px');
							
							$("#" + $(this).attr("id") + "_bio").fadeIn(250);
							$(this).attr('childrenVisible', 'true');
							$(this).spStart().fps(15);
						}
					})
				;
				
				// increment ID
				personId ++;
			});
		}
	});
}
