var thumbSelector = '.tokvir img';
var mainImageSelector = '#mainImage img';
var mainImageContainerSelector = '#mainImage .center';
var prefixSrc = 'thumb_';
var prefixDest = '';
var fadeInTime = 300;
var fadeOutTime = 300;
var current;

$(document).ready(init);

function init()
{
	
	
	$(thumbSelector).bind('mouseover', function(e){
		$(this).parent().css({ background:'#dd5f00'});
		return switchPrimary(e, this);
	});

	$(thumbSelector).bind('mouseout', function(e){
		$(this).parent().css({ background:'#F5A200'});
	});
	current = $(mainImageSelector).get(0);	
}


function switchPrimary(event, el)
{	
	var src = el.src;
	
	src = src.replace(prefixSrc,prefixDest);
	// do the transition only if the image differs
	
	if(current.src != src)
	{						
		var nova = document.createElement('img');		
		nova.setAttribute('src', src);
		
		nova.setAttribute('height', 230);
		
		$(nova).css({ position:'absolute',display:'none'});
		
		primar = $(mainImageContainerSelector).get(0);		
		
		$(primar).append(nova);
		$(nova).fadeIn(fadeInTime);
		$(current).fadeOut(fadeOutTime, _removeImage);
		current = nova;
	}
}

function _removeImage( obj ) {
	$(this).remove();		
}