$(document).ready(function()
	{				
		var media_id = $('#current_media').val();
		var media_image_path = $('#' + media_id + '_image_path').val();

		setMediaClass(media_id);
		
		$('li').each(function()
			{
				var id = $(this).attr('id');
				
				if (id.indexOf("media_") >= 0) {
					$(this).bind('mouseover', 
						function() {							
							$(this).css({cursor: 'pointer'});							
							$('#' + id).attr('class', 'on');							
						}
					);
					
					$(this).bind('mouseout', 
							function() {	
								var current_media = $('#current_media').val();
								if (current_media == id) {
									$('#' + id).attr('class', 'on');
								} else {
									$('#' + id).attr('class', 'off');
								}
							}
						);
					
					$(this).bind('click',
						function() {	
							var image_path = $('#' + id + '_image_path').val();
							
							setMediaClass(id);
														
							$('#current_media').val(id);
							loadMediaContent(id, image_path);														
						}
					)
				}
			}
		);
		
	}
);


function loadMediaContent(category, image_path) {		
	$('#media_content').load(	
		'_media_prg.jsp',
		{category: category, image_path: image_path},
		function(data)
		{			
			var rtn = $.trim(data);
			$('#media_content').html(rtn);			
		}
	)
}

function setMediaClass(id) {
	if (id == "media_rec") {
		$('#media_hot').attr('class', 'off');
		$('#media_latest').attr('class', 'off');
		$('#' + id).attr('class', 'on');
	} else if (id == "media_hot") {
		$('#media_rec').attr('class', 'off');
		$('#media_latest').attr('class', 'off');
		$('#' + id).attr('class', 'on');
	} else if (id == "media_latest") {
		$('#media_hot').attr('class', 'off');
		$('#media_rec').attr('class', 'off');
		$('#' + id).attr('class', 'on');
	}
}