var hasFocus = true;
var rotateSpeed = 6000;
$(document).ready(function(){

	$(window)
		.bind('focus', function(){ hasFocus = true })
		.bind('blur', function(){ hasFocus = false })

	setTimeout( "getimage()", rotateSpeed )
});

function getimage()
{
	if ( hasFocus && $('#main-image:in-viewport div').length > 0 ) {

		var s = $('#main-image div').css('background-image')
		s = s.substring(4, s.length-1)
		if( s.charAt(0) == '"') s = s.substring(1, s.length-1)
		s = s.substring(0, s.indexOf('&t=') )
		if ( $('#main-image div img').length == 0 )
			$('#main-image div').append('<img onload="rotateimage(this)" />')
		$('#main-image div img').attr('src', '' + s + '&t=' + Date.parse(Date().toString()))

	}
	else
		setTimeout( "getimage()", rotateSpeed )
}

function rotateimage(img)
{
    $(img).fadeIn(1000, function(){
        $(this).parent().css("background-image", 'url(' + $(img).attr("src") + ')')
        $(this).fadeOut(1000, function(){setTimeout( "getimage()", rotateSpeed )})
    })
}