/*
* @desc Create the cross-over image effect
* @auth CT
* @date April 26, 2010
*/

/*[[ Extend the $.browser object to include the Chrome detection ]]*/
var userAgent = navigator.userAgent.toLowerCase();
$.browser.chrome = /chrome/.test( userAgent );


/*[[ hook up the click event for IE 7 ]]*/
var _baseUrl = 'http://www.startonight.ro/';
if ($.browser.msie && ($.browser.version.indexOf('7') != -1) )
{
	$(function()
	{
		$('a.cross').each(function()
		{
			$(this)
				.css('cursor','pointer')
				.click(function()
				{
					var _href = $(this).attr('href');
					if (_href.indexOf('javascript:')!=-1) { eval($(this).attr('href')); return false; }
					window.location.href = _baseUrl+_href;
					return true;
				});
		});
	});
}


(function ($)
{
	$.fn.cross = function (options)
	{
    	return this.each(function()
		{
			var  $$ = $(this) /*[[ img.fade ]]*/
				,$parent = $$.parent() /*[[ parent link tag ]]*/
				,$parentWidth = $parent.width()
				,fadeBg = $$.css('background-image').replace(/^url|[\(\)'"]/g, '');

// Check to see if the image has the associated text (must be found in .link_text)
var  linkText = $parent.next('.link_text');
if (linkText)
{
// wrap the images in a new span
	$$.wrap('<span class="wrap"></span>');
	
	linkText.css({
		 width: $parentWidth
		,padding: '0 0 2px 0'
	});

	$parent.find('span.wrap').css({
		margin: 0
		,padding: 0
	});

	$parent.children(':first-child').prepend('<img class="temp" src="'+fadeBg+'" />');
}
else
{
// else, don't breake the design...(Chrome c**p....)
// just insert the new image above the existent one
// no need for the wrapping span
	$parent.prepend('<img class="temp" src="'+fadeBg+'" />');
}
	$parent.css({
		display:'block'
	});

	// set up a reference to the first image; .temp
	$img = $parent.find('img:first-child');


			if ($.browser.msie)
			{
				$parent.find('span.wrap').css({
					 float: 'left'
					,display: 'block'
					,position: 'relative'
					,margin: 0
					,padding: 0
				});
				$$.css({
					 position : 'absolute'
					,'z-index': 200
					,left : 0
					,top : 0
					,background : ''
					,display: 'block'
				});
				$img.css({
					  background: ''
					 ,float: 'left'
					 ,display: 'block'
					 ,'z-index': 2
					 ,left: 0
					 ,top: 0
					 ,border: 'solid 2px #ccc'
				});
			}
			else if ($.browser.chrome)
			{
				$parent.find('span.wrap').css({
					 float: 'left'
					,display: 'block'
					,position: 'relative'
					,overflow: 'hidden'
					,margin: 0
					,padding: 0
				});
				$$.css({
					'position' : 'absolute',
					'z-index': 200,
					float: 'left',
					'display': 'block',
					'left' : 0,
					'top' : 0,
					'background' : ''
				});
				$img.css({
					 background: ''
					 ,float: 'left'
					 ,'z-index': 2
					 ,left: 0, top: 0
				});
			}
			else if ($.browser.mozilla)
			{
				if (linkText) {
					linkText.css({
						'padding-top': '5px'
					});
				}
				$parent.find('span.wrap').css({
					 float: 'left'
					,display: 'block'
					,position: 'relative'
					,overflow: 'hidden'
					,margin: 0
					,padding: 0
				});
				$$.css({
					'position' : 'absolute',
					'z-index': 200,
					float: 'left',
					'display': 'block',
					'left' : 0,
					'top' : 0,
					'background' : ''
				});
				$img.css({
					 background: ''
					 ,float: 'left'
					 ,'z-index': 2
					 ,left: 0, top: 0
				});
			}
			else if ($.browser.opera && $.browser.version < 9.5)
			{
				$$.css({
					'position' : 'absolute', 
					'left' : 0,
					'background' : '',
					'top' : "0"
				});
				// TODO
			}
			else
			{ // Safari
				$$.css({
					'position' : 'absolute', 
					'left' : 0,
					'top': 0,
					'background' : ''
				});
				// TODO
			}

			$parent.hover(
				function () { $$.stop().animate({opacity: 0}, 250); }
				,
				function () { $$.stop().animate({opacity: 1}, 250);
			});
			
		}); /* end return */
	};
})(jQuery);


jQuery(function()
{
	jQuery('img.fade').cross();
});

