var newProductTimer;
var newProductCounter = 0;

document.observe("dom:loaded", function() {
	
	// Activate the quick search box
	var elem = $('quick_search_box');
	if (elem) { elem.activate().clear(); }
	
	// Initialize the New Product box
	var elem = $('newProducts');	
	if (elem) {
		elem = elem.down('.content');
		if (elem) {			
			var productWrapper = new Element('div', { id:'productWrapper' });
			elem.update(productWrapper.update(elem.innerHTML));
			
			var leftArrow = $(new Element('div'));
			leftArrow.setStyle({ cursor:'pointer', height:'100%', position:'absolute', top:'0%', width:'36px' });
			leftArrow.setOpacity(0.5);
			var rightArrow = leftArrow.cloneNode(false);
			leftArrow.setStyle({ background:"#EEE url('/images/arrows.gif') no-repeat 12px center", left:'0%' });			
			rightArrow.setStyle({ background:"#EEE url('/images/arrows.gif') no-repeat -12px center", right:'0%' });

			$(leftArrow, rightArrow).each(function(elem) {
				elem.observe('mouseover', function(event) {
					event.stop();
					Effect.Queues.get(elem.identify()).invoke('cancel');
					new Effect.Opacity(elem, {
						from: 0.5,
						to: 1.0,
						duration: 0.2,
						queue: elem.identify()
					});
				});
				elem.observe('mouseout', function(event) {
					event.stop();
					Effect.Queues.get(elem.identify()).invoke('cancel');
					new Effect.Opacity(elem, {
						from: 1.0,
						to: 0.5,
						duration: 0.2,
						queue: elem.identify()
					});
				});
			});
			
			leftArrow.observe('click', function(event) {
				clearTimeout(newProductTimer);
				transitionNewProducts(-1);
				newProductTimer = showNextProduct.delay(8);
			});
			elem.insert({ top: leftArrow });			
			
			rightArrow.observe('click', function(event) {
				clearTimeout(newProductTimer);
				transitionNewProducts(1);	
				newProductTimer = showNextProduct.delay(8);			
			});
			elem.insert({ bottom: rightArrow });						
			
			transitionNewProducts(0, true);
			newProductTimer = showNextProduct.delay(8);
		}
	}
		
	rotateCusServBanners.delay(8);
});

function showNextProduct() {
	transitionNewProducts(1);
	newProductTimer = showNextProduct.delay(8);
}

function transitionNewProducts(direction, noTrans) {
	var fx = $A();
	var productArray = $$('#productWrapper .product');
	numProd = productArray.length;
	newProductCounter += direction;
	if (newProductCounter < 0) newProductCounter = numProd - 1;
	if (newProductCounter >= numProd) newProductCounter = 0;
	var tmpStr = '';
	productArray.each(function(elem, i) {		
		var newLeft = i - newProductCounter;
		if (newLeft <= 0 - Math.round(numProd / 2)) newLeft += numProd;
		if (newLeft > Math.round(numProd / 2)) newLeft -= numProd;
		if (newLeft >= -1 && newLeft <= 2 && !noTrans) {
			fx.push(new Effect.Morph(elem, {
				sync: true,
				style: { left: newLeft * 50 + '%' }
			}));
		} else {
			elem.setStyle({ left: newLeft * 50 + '%' });
		}
	});
	Effect.Queues.get('transitionNewProducts').invoke('cancel');
	new Effect.Parallel(fx, {
		duration: 0.5,
		queue: 'transitionNewProducts'
	});
}

function rotateCusServBanners() {	
	var elem = $('customerService');
	if (elem) {
		elem = elem.down('.content');
		if (elem) {
			if (!elem.getStyle('backgroundPosition')) elem.setStyle({'backgroundPosition':'0px 0px'});
			var newLeft = (elem.getStyle('backgroundPosition').split(' ')[0] || '0').replace('px','') - 628 + 'px';		
			new Effect.Morph(elem, {
				style: { 'backgroundPosition': newLeft + ' 0' },
				duration: 0.5,
				afterFinish: function() {
					rotateCusServBanners.delay(8);
					var xPos = (elem.getStyle('backgroundPosition').split(' ')[0] || '0').replace('px','');
					if ( xPos == -1884 || xPos % 628 != 0) { 
						elem.setStyle({'backgroundPosition': '0px 0px'});
					}
				}
			});
		}
	}
}