/*****************************welcome banner by POPRON************************************************************/

var popronJsBannerImages = new Array();
var popronJsBannerIndexActive = 1;
var popronJsBannerAutoScrollTimer = 6; // In secs - after this time next banner will be displayed
var popronJsBannerAutoScrollTimeout;
var popronJsBannerPauseTimer = 15; // In secs - after this time continue with autoScroll
var popronJsBannerPauseTimeout;
var popronJsBannerUserClickDisabled = false;

var popronJsBannerPauseAutoScroll = function () {
	if (popronJsBannerAutoScrollTimeout != undefined) window.clearTimeout(popronJsBannerAutoScrollTimeout);
	if (popronJsBannerPauseTimeout != undefined) clearTimeout(popronJsBannerPauseTimeout);
	popronJsBannerPauseTimeout = window.setTimeout(popronJsBannerPauseFinished, popronJsBannerPauseTimer * 1000);
} // End of pauseAutoScroll

var popronJsBannerPauseFinished = function () {
	popronJsBannerAutoScroll();
} // End of pauseFinished

var popronJsBannerAutoScroll = function () {
	popronJsBannerScroll(jQuery('#popron-js-banner #preview-banner-' + popronJsBannerIndexActive).next().attr('id').replace('preview-banner-', ''), false);
	popronJsBannerAutoScrollTimeout = window.setTimeout(popronJsBannerAutoScroll, popronJsBannerAutoScrollTimer * 1000);
}  // End of autoScroll

function popronJsBannerImage() {
	this.preview = new Image();
	this.big = new Image();
	this.href = '';
	this.alt = '';
	this.id = '';
	this.btn = '';
	this.btna = '';
} // End of popronJsBannerImages

var popronJsBannerScroll = function (indexNew, userClick) {

	// If click disabled return
	if (popronJsBannerUserClickDisabled) return;
	popronJsBannerUserClickDisabled = true;

	var time = (userClick) ? 300 : 600;

	// Immediate scroll at start
	if (userClick == undefined) {
		userClick = false; // Don't pause autoscroll
		time = 0; // Immediate scroll
	}

	// Pause only if clicked by user
	if (userClick) {
		popronJsBannerPauseAutoScroll();
	}

	var indexActive = popronJsBannerIndexActive;

	var previewBannersContainer = jQuery('#popron-js-banner .preview-banners-container');
	var previewBannerActive = jQuery('#popron-js-banner #preview-banner-' + indexActive);
	var previewBannerNew = jQuery('#popron-js-banner #preview-banner-' + indexNew);

	var scrollDown = (previewBannerNew.index() > previewBannerActive.index()) ? true : false;

	// Make operations on preview
	var stepCount = (scrollDown) ? (previewBannerNew.index() - previewBannerActive.index()) : (previewBannerActive.index() - previewBannerNew.index());
	var stepHeight = previewBannersContainer.children(':first').outerHeight();
	var previewBannerStep = previewBannerActive;
	var indexGet = (scrollDown) ? previewBannersContainer.children(':first').index() : previewBannersContainer.children(':last').index();
	for (var i = 0; i <= stepCount; i++) {
		previewBannerStep = (scrollDown) ? previewBannerStep.next() : previewBannerStep.prev();
		if (previewBannerStep.index() == -1) {
			// Step banner not found - copy/clone one
			//var mustClone = (scrollDown)
			if (scrollDown) {
				previewBannersContainer.append(previewBannersContainer.children().get(indexGet));
				previewBannersContainer.css('top', previewBannersContainer.position().top + stepHeight);
			} else {
				previewBannersContainer.css('top', previewBannersContainer.position().top - stepHeight);
				previewBannersContainer.prepend(previewBannersContainer.children().get(indexGet));
			}
		}
	}
	var previewScrollValue = ((scrollDown) ? '-=' : '+=') + (stepCount * stepHeight);

	// Make operations on center
	var centerBannersContainer = jQuery('#popron-js-banner .center-banners-container');
	var centerBannerActive = previewBannerActive.clone();
	var centerBannerNew = previewBannerNew.clone();
	centerBannersContainer.css('top', 0);
	centerBannerActive.attr('id', '');
	centerBannerActive.removeClass('clickable');
	centerBannerActive.addClass('absolute');
	centerBannerNew.attr('id', '');
	centerBannerNew.removeClass('clickable');
	centerBannerNew.addClass('absolute transparent');
	centerBannersContainer.empty();
	var centerScrollValue = 0;
	if (scrollDown) {
		centerBannerActive.css('top', 0);
		centerBannersContainer.append(centerBannerActive);
		centerBannerNew.css('top', stepHeight);
		centerBannersContainer.append(centerBannerNew);
		centerScrollValue = '-=' + stepHeight;
		//centerScrollValue = stepHeight * -1;
	} else {
		centerBannerNew.css('top', stepHeight * -1);
		centerBannersContainer.append(centerBannerNew);
		centerBannerActive.css('top', 0);
		centerBannersContainer.append(centerBannerActive);
		centerScrollValue = '+=' + stepHeight;
		//centerScrollValue = stepHeight;
	}

	// Make operations on big
	var bigBannersContainer = jQuery('#popron-js-banner .big-banners-container');
	var bigBannerActive = jQuery('#popron-js-banner #big-banner-' + indexActive);
	var bigBannerNew = jQuery('#popron-js-banner #big-banner-' + indexNew);
	bigBannerNew.addClass('transparent');
	bigBannerNew.removeClass('hidden');
	bigBannersContainer.prepend(bigBannerNew);
	bigBannersContainer.prepend(bigBannerActive);

	// Make operations on numbers
	var numberActive = jQuery('#popron-js-banner #number-' + indexActive).children('.number:not(.clickable)');
	var numberNew = jQuery('#popron-js-banner #number-' + indexNew).children('.number.hidden');
	numberNew.addClass('transparent');
	numberNew.removeClass('hidden');

	//alert('scrollDown=' + scrollDown + '; index:' + indexActive + ' -> ' + indexNew + '; previewScrollValue=' + previewScrollValue);

	// Scroll preview banners
	previewBannersContainer.stop(false, true).animate({
		top: previewScrollValue
	}, time, function () { });

	// Scroll center banners
	centerBannersContainer.stop(false, true).animate({
		top: [centerScrollValue]
		//scrollTop: centerScrollValue
	}, time, function () { });
	centerBannerActive.stop(false, true).animate({
		opacity: 0
	}, time, function () { });
	centerBannerNew.stop(false, true).animate({
		opacity: 1
	}, time, function () { });

	// Scroll big banners
	bigBannerNew.stop(false, true).animate({
		opacity: 1
	}, time, function () { });

	// Scroll numbers
	numberActive.stop(false, true).animate({
		opacity: 0
	}, time, function () { });
	numberNew.stop(false, true).animate({
		opacity: 1
	}, time, function () { });

	// Wait until all animations are completed
	var wait = setInterval(function () {
		if (!previewBannersContainer.is(":animated")
			&& !centerBannersContainer.is(":animated")
			&& !centerBannerActive.is(":animated")
		  && !centerBannerNew.is(":animated")
			&& !bigBannerNew.is(":animated")
			&& !numberActive.is(":animated")
			&& !numberNew.is(":animated")) {
			clearInterval(wait);
			// This piece of code will be executed after all elements animations are completed
			popronJsBannerUserClickDisabled = false;

			bigBannerActive.addClass('hidden');
			bigBannerNew.removeClass('transparent');
			//bigBannerNew.css('opacity', '');
			//bigBannerNew.css('filter', '');
			//bigBannerNew.attr('style', '');
			bigBannerNew.removeAttr('style');

			numberActive.addClass('hidden');
			numberNew.removeClass('transparent');
			numberNew.css('opacity', '');
			numberNew.addClass('active');

			// Set new index as active
			popronJsBannerIndexActive = parseInt(indexNew);
		}
	}, 50);

}    // End of popronJsBannerScroll

var setSizeOfNumberBackground = function () {
	var numbersContainer = jQuery('#popron-js-banner .numbers-container');
	var numbersBackground = jQuery('#popron-js-banner .numbers-background');
	numbersBackground.width(numbersContainer.outerWidth());
	numbersBackground.height(numbersContainer.outerHeight());
}

$j(document).ready(function () {
	$j.ajax({
		type: "GET",
		url: "/files/bannerJS/SK/settings.xml",
		dataType: "xml",
		success: function (xml) {

			//var jsContainer = jQuery('#popron-js-banner .js-container');
			//jsContainer.removeClass("hidden");

			// Read xml settings file and fill array with banners objects
			var previewPath = $j(xml).find('images').attr('previewPath');
			if (previewPath[previewPath.length-1] != '/') previewPath += '/';
			var bigPath = $j(xml).find('images').attr('bigPath');
			if (bigPath[bigPath.length-1] != '/') bigPath += '/';
			var imgPath = $j(xml).find('images').attr('imgPath');
			if (imgPath[imgPath.length-1] != '/') imgPath += '/';

			$j(xml).find('image').each(function () {
				var img = new popronJsBannerImage();
				img.preview.id = $j(this).find('preview').text();
				img.preview.src = previewPath + $j(this).find('preview').text();
				img.big.id = $j(this).find('big').text();
				img.big.src =  bigPath + $j(this).find('big').text();
				img.href = $j(this).find('href').text();
				img.alt = $j(this).find('alt').text();
				//img.id = img.big.id.substring(0, img.big.id.lastIndexOf('.'));
				img.btn =  imgPath + 'btn' + popronJsBannerImages.length + '.png';
				img.btna = imgPath + 'btn' + popronJsBannerImages.length + 'a.png';
				popronJsBannerImages[popronJsBannerImages.length] = img;
			});

			var bigBannersContainer = $j('#popron-js-banner .big-banners-container');
			var previewBannersContainer = $j('#popron-js-banner .preview-banners-container');
			var numbersContainer = $j('#popron-js-banner .numbers-container');
			for (var i = 1; i <= popronJsBannerImages.length; i++) {
				// Prepare big banner
				bigBannersContainer.append(getBigBannerHtml(i));
				// Prepare preview banner
				previewBannersContainer.append(getPreviewBannerHtml(i));
				// Prepare big banner numbers
				numbersContainer.append(getNumberHtml(i));
			}

			// Make numbers-background same width and height as number-container
			setTimeout(setSizeOfNumberBackground);

			// Set starting position
			popronJsBannerScroll(0);

			// Remove class hidden from js-container and fade in whole banner
			var jsContainer = $j('#popron-js-banner .js-container');
			jsContainer.removeClass("hidden");
			jsContainer.animate({
				opacity: 1
			}, 600, function () {
				// Animation complete
				jsContainer.removeClass("transparent");
			});

			// Hook number click
			$j('#popron-js-banner .number.clickable').live('click', function (event, auto) {
				var numberElement = $j(this).parent();
				var index = numberElement.attr('id').replace('number-', '');
				popronJsBannerScroll(index, true);
			});

			// Hook arrow up click
			$j('#popron-js-banner .preview-up').live('click', function (event, userClick) {
				popronJsBannerScroll($j('#popron-js-banner #preview-banner-' + popronJsBannerIndexActive).prev().attr('id').replace('preview-banner-', ''), true);
			});

			// Hook arrow down click
			$j('#popron-js-banner .preview-down').live('click', function (event, userClick) {
				popronJsBannerScroll($j('#popron-js-banner #preview-banner-' + popronJsBannerIndexActive).next().attr('id').replace('preview-banner-', ''), true);
			});

			/*
			jQuery('.preview-banner').live('click', function (event, auto) {
				event.preventDefault();
				// If banner not marked as clickable is clicked return
				if (!jQuery(this).hasClass("clickable")) return;
				// Scroll to clicked banner
				popronJsBannerScroll(jQuery(this).attr('id').replace('preview-banner-', ''), true);
			});
			*/

			// Start autoscrolling
			popronJsBannerAutoScrollTimeout = window.setTimeout(popronJsBannerAutoScroll, popronJsBannerAutoScrollTimer * 1000);

		} // End success xml reading
	}); // End ajax

});       // End document.ready

function getPreviewBannerHtml(index) {
	var img = popronJsBannerImages[index - 1];
	var code = ''
	+ '<div id="preview-banner-' + (index - 1) + '" class="preview-banner clickable" title="' + img.alt + '">'
	+ ' <a href="' + img.href + '" target="_self" alt="' + img.alt + '">'
	+ '  <img src="' + img.preview.src + '" border="0" width="188" height="97" alt="' + img.alt + '" />'
	+ ' </a>'
	+ '</div>';
	return code;
};

function getBigBannerHtml(index) {
	var img = popronJsBannerImages[index - 1];
	var code = ''
	+ '<div id="big-banner-' + (index - 1) + '" class="big-banner clickable hidden" title="' + img.alt + '">'
	+ ' <a href="' + img.href + '" target="_self" alt="' + img.alt + '">'
	+ '  <img src="' + img.big.src + '" border="0" width="751" height="334" alt="' + img.alt + '" />'
	+ ' </a>'
	+ '</div>';
	return code;
};

function getNumberHtml(index) {
	var img = popronJsBannerImages[index - 1];
	var code = ''
	+ '<div id="number-' + (index-1) + '" class="number-container">'
	+ ' <div class="number clickable" title="' + img.alt + '">'
	+ '  <img src="' + img.btn + '" border="0" width="24" height="23" alt="' + img.alt + '"/>'
	+ ' </div>'
	+ ' <div class="number hidden">'
	+ '  <img src="' + img.btna + '" border="0" width="24" height="23" alt="' + img.alt + '"/>'
	+ ' </div>'
	+ '</div>';
	return code;
};

/*****************************end welcome banner by POPRON************************************************************/