//
// Loads a thumbnail of the specified filename into the image_gallery space. 
// Used when showing form errors and when an image has been successfully uploaded.
//
function loadThumbnail( fileName, topDocument ){
	var galleryContainer = topDocument.getElementById( "image_gallery" );

	// Create all the tags
	//////////
	var imageContainer = topDocument.createElement('div');
	var imageTag = topDocument.createElement('img');
	var brTag = topDocument.createElement('br');
	var removeLink = topDocument.createElement('a');
	var removeText = topDocument.createTextNode("remove");

	// Style the tags
	//////////
	imageContainer.style.width = "100px";
	imageContainer.style.margin = "10px";
	imageContainer.style.textAlign = "center";
	imageContainer.id = fileName;

	imageTag.src = fileName;

	removeLink.href = "javascript:smoothRemove( '" + fileName + "' );";

	// Link the tags together
	//////////
	removeLink.appendChild( removeText );

	imageContainer.appendChild( imageTag );
	imageContainer.appendChild( brTag );
	imageContainer.appendChild( removeLink );

	galleryContainer.appendChild( imageContainer );
}

function smoothRemove( id ){
	var myNode = document.getElementById( id );
	var strWidth  = myNode.style.width;
	var width = strWidth.substring(0, strWidth.length - 2);

	if( width > 10 ){
		myNode.style.overflow = "hidden";
		myNode.style.width = (width - 10) + "px";
		setTimeout("smoothRemove( '" + id + "' );", 25); // .1 sec
	}
	else{
		removeGalleryImage( id )
	}
}

function removeGalleryImage( id ){
	myNode = document.getElementById( id );
	myParentNode = myNode.parentNode;
	myParentNode.removeChild( myNode );
	
	document.getElementById("deleteImages").value += id + "|";
}