/*************************************************************
* Page: logo_preview.js v 1.0  
* Description: functions to create and destroy logo elements
* 
* Hospitality Recruitment - Online Strategies
* Copyright (C) 2005 Online Strategies, All rights reserved
* Email  info@hospitalityonline.co.uk
* 
*************************************************************/
// Function to create the logo element
// path - the path of the image
function create_image(path)
{
	// Check for DOM support
	if (document.getElementById && document.createTextNode)
	{
		// Element that we are to append to
		var append_to = document.getElementById('preview_logo');
	
		//Create the image element and set some attributes
		var new_img   = document.createElement('img');
		new_img.setAttribute('id','image_preview');
		new_img.setAttribute('class','img_border');
		new_img.setAttribute('src',path);
		
		// Create the image inside the assigned div
		append_to.appendChild(new_img);
		append_to.style.display = 'block';
	}
}

//------------------------------------------------------------------
// Function to remove the image we have created
function remove_preview()
{
	// Check for DOM support
	if ( document.getElementById && document.createTextNode ){
		
		// lets set some variables
		var remove_from =  document.getElementById('preview_logo');// find the element where the image sits
		var remove = document.getElementById('image_preview');// find the image you want to remove
		
		
		if ( remove_from ) // If the image can be located, then remove it
		{
			// remove the image
			remove_from.removeChild( remove );
		}
		// If the image cant be found issue and alert
		else 
		{
			alert('ERROR: Cannot remove DOM removeChild(remove)');
		}
	}
}

//------------------------------------------------------------------
// Fucntion to set the class of the preview logo div
// We are not using this at current, but when we want to use it, we will have to 
// get around the IE className and FF class Issue.
function set_class(class_name)
{
	if (document.getElementById && document.createTextNode)
	{
		var div = document.getElementById('preview_logo');
		(class_name)?div.setAttribute('className', class_name):div.removeAttribute('className');
	}

}

//------------------------------------------------------------------
// Function to hide / show the upload box and that there
// select_element - the element that you are triggering the function from.
function display_logo_preview ( select_element )
{
	// Check for DOM support
	if ( document.getElementById && document.createTextNode )
	{
		// lets set some variables
		var sel   		= document.getElementById( select_element ); // find the select tag that we are firing the event from
		var count 		= ( sel.getElementsByTagName('option').length -1 ); // to select the last option in the dropdown
		var image 		= document.getElementById('image_preview'); // div that we need to add the image into
		var selected 	= document.getElementById( select_element ).selectedIndex; // find out the selected index so we can add the path
		var src		 	= document.getElementById( select_element ).getElementsByTagName('option')[selected].getAttribute('value'); // create the src for the image
		var prev		= document.getElementById('preview_logo');
		if (sel.selectedIndex == 0)
		{
			// Check hidden rows and hide or show the inside divs of those
			// If there is an image then we must remove it
			if ( image ) { remove_preview(); }
			create_image('/logos/no_preview.gif'); // Create the image
			hide_elements('lbl_1','lbl_2','logo','label');
			
		}
		else if (sel.selectedIndex == count)
		{
			// If there is an image, then we must remove it
			if ( image ) { image.style.display = 'none';remove_preview(); }
			prev.style.display = 'none';
			show_elements('lbl_1','lbl_2','logo','label');
		}
		else
		{
			if ( image ) { remove_preview(); }
			create_image('/logos/'+src); // Create the image
			hide_elements('lbl_1','lbl_2','logo','label'); // Check hidden rows and hide or show the inside divs of those
		}
	}
}