var currentHldr = 1,
	totalNumOfBGs = 5,
	BGnum = 1 + Math.round(Math.random() * (totalNumOfBGs - 1)),
	bgFadeSpeed = 2700,
	bgNamePrefix = 'http://static.videostrip.com/img/videostrip_main_bg_';

function kickOff() {
	$('#bgHldr1').fadeIn(bgFadeSpeed);
	setTimeout(loopBGs, 17000);
}

function loopBGs(){
	fadeBGs();
	setTimeout(loopBGs, 17000);
}

function fadeBGs() {
	if (currentHldr == 1) {
		var $active = $("#bgHldr1:visible"),
			$next = $("#bgHldr2");
	}
	if (currentHldr == 2) {
		var $active = $("#bgHldr2:visible"),
			next = $("#bgHldr1");
	}
	$next.show();
	$active.stop(true,true).fadeOut(bgFadeSpeed, function() { 
    	$next.css('z-index', 3);
		$(this).css('z-index', 1).show().attr('src', bgNamePrefix + BGnum + '.jpg');
  	});
	currentHldr = (currentHldr == 1) ? 2 : 1;
	BGnum++;
	if (BGnum > totalNumOfBGs) {BGnum = 1;};
}

$(function() {
	var img1 = new Image(),
		img2 = new Image();
	$(img1).hide().attr({src: bgNamePrefix + BGnum + '.jpg', id: 'bgHldr1'}).css('z-index', 3);
	$(img2).hide().attr({src: bgNamePrefix + (BGnum == totalNumOfBGs ? 1 : ++BGnum) + '.jpg', id: 'bgHldr2'}).css('z-index', 1);
	$('#backgroundwrapper').prepend($(img1), $(img2));
	setTimeout(kickOff, 2700);
})


