
/* -- Homepage: Cycle banners -- */

// Get the current banner image source
var iSrc = $('#home-banner img').attr('src');

// Append more banners:
var op = '';

// For each of the banners to be appended:
var i, n;
var now = new Date();
if((now.getMonth() == 11 && now.getDate() > 10) || (now.getMonth() == 0 && now.getDate() < 10)) {
	for(i = 1, n = 4; i < n; i ++) {
		op += '<div class="banner" id="home-xmas-banner-'+ i +'"><!-- --></div>';
	}
} else {
	for(i = 1, n = 6; i < n; i ++) {
		op += '<div class="banner" id="home-banner-'+ i +'"><!-- --></div>';
	}
}

// Append the banners
$('#home-banner').html('').append(op);

// Overlay image for banners
$('#home-banner').css({ 
	backgroundImage: 'url('+ jQueryBaseHrefWithoutPrefix +'/application/modules/text/resources/images/home/banner-overlay-bg.png)'
});

// Build Previous/Next buttons for jQuery Cycle Plugin
$('<div id="home-banner-nav"><a href="javascript:return false;" id="home-banner-previous">Vorige</a><a href="javascript:return false;" id="home-banner-next">Next</a></div>').insertAfter('#home-banner');
function onAfterCycle(curr, next, opts) {
	// Show/Hide previous and next button
    var index = opts.currSlide;
    $('#home-banner-previous')[index == 0 ? 'hide' : 'fadeIn']();
    $('#home-banner-next')[index == opts.slideCount - 1 ? 'hide' : 'fadeIn']();
    
    // Animate the current slide
    // $(curr).animate({backgroundPosition:"(0px -100px)"}, {duration:20000});
}

// Cycle through the banners
$('#home-banner').cycle({
	fx : 'fade',
	timeout: 5000,
	speedIn:  800, 
	speedOut: 300,
	prev:   '#home-banner-previous',
	next:   '#home-banner-next',
	after : onAfterCycle,
	before : function(curr, next, opts) {
		
	},
	nowrap : 0
});

// Animation of banners
function animateBanners() {
	// For each of the banners
	$('#home-banner').children(':visible').each(function() {
		var t = $(this).css('backgroundPosition');
		if(t == '' || typeof t == 'undefined') {
			t = '';
		}
		var p = t.split(' ');
		if(p.length == 1) {
			p[1] = '0';
		}
		var x = parseInt(p[0].replace(/%/, '').replace(/px/, ''));
		var y = parseInt(p[1].replace(/%/, '').replace(/px/, ''));
		
		if($(this).data('yDir') != 'down') {
			y --;
		} else {
			y ++;
		}
		
		if(y < -170) {
			y = -170;
			$(this).data('yDir', 'down');
		} else {
			if(y > 0) {
				y = 0;
				$(this).data('yDir', 'up');
			}
		}
		
		$(this).css({
			backgroundPosition : '0px ' + y.toString() + 'px'
		});
	});
	
	// Next animation frame
	setTimeout('animateBanners()', 75);
}

// Start animation of banners
animateBanners();
