function contactSheet(xmlDoc)
{
	var width = 3;
	var table = document.createElement('table');
	table.className = 'contactSheet';
	$(table).attr('cellspacing' , '0');
	
	function nextRow(table)
	{
		var newRow = document.createElement('tr');
		table.appendChild(newRow);
		return newRow;
	}
	
	var row; // this will get assigned during the for-loop
	
	var thumbs = $(xmlDoc).find("thumbpath").attr("dir")
	var images = $(xmlDoc).find("image")
	
	for(var index = 0 ; index < images.length ; index++)
	{
		if(index % width == 0) row = nextRow(table);
		var iRef = images[index];
		var link = document.createElement('a');
		
		var img = new Image();
		img.src = thumbs + $(iRef).find('source').text();
		img.alt = $(iRef).find('name').text();
		img.title = img.alt;
		
		// now comes the fun part - hiding the description & detail views
		var desc = createDescription(img.alt , $(iRef).find('description').text());
		
		$(link).click( function() { display(this); } ).append(img).append(desc);
		$(row).append($(document.createElement('td')).append(link));
		var details = iRef.getElementsByTagName('detail');
		
		if(!details.length) continue;
		
		var detail_list = document.createElement('ul');
		$(detail_list).addClass('details');
		
		for(var detail_index = 0 ; detail_index < details.length ; detail_index++)
		{
			var li = document.createElement('li');
			var detail = document.createElement('a');
			var src_span = document.createElement('span');
			$(src_span).addClass('invisible');
			$(detail).text(details[detail_index].getAttribute("name")).addClass('detail').append($(src_span).text(detail_index == 0 ? $(iRef).find('source').text() : $(details[detail_index]).text()))
			$(detail).click(function(event) { showDetail(event.target); })
			$(detail_list).append($(li).append(detail))
		}
		
		$(desc).append(detail_list);
	}
	
	return table;
}