var scrollEls = $("scroller").getElementsByClassName("carousel-image");

var scrollCount = scrollEls.length;

function setCarousel() {
	if (scrollCount > 3) {
		// Duplicate carousel to the right

		var lastElNumber = parseInt(getLastElement().substr(1));
		var existingEls = $("scroller").immediateDescendants();
		for (i = 0; i < existingEls.length; i++) {
			newEl = existingEls[i].cloneNode(true);
			lastElNumber++;
			newEl.id = "c" + lastElNumber;
			$("scroller").appendChild(newEl);
		}
		scrollEls = $("scroller").getElementsByClassName("carousel-image");

		var countWidth = (Math.floor(scrollCount / 2) * ($("scroller").immediateDescendants()[0].getWidth()));
		var sLeftMargin = -1 * (countWidth);
    	//console.log(sLeftMargin);
		$("scroller").setStyle({
			marginLeft: sLeftMargin + 'px',
			width: countWidth * lastElNumber + 'px'
		});


		$("carousel").addClassName("scrollcontrols");

		$("left-control").observe("mouseover", function(event) {
			Event.element(event).src =
			"/images/carousel_arrow_left_over.png";
		});

		$("right-control").observe("mouseover", function(event) {
			Event.element(event).src =
			"/images/carousel_arrow_right_over.png";
		});

		$("left-control").observe("mouseout", function(event) {
			Event.element(event).src =
			"/images/carousel_arrow_left.png";
		});

		$("right-control").observe("mouseout", function(event) {
			Event.element(event).src =
			"/images/carousel_arrow_right.png";
		});

		$("right-control").observe("click", function() {
			firstEl = $("scroller").immediateDescendants()[0].id;
			Effect.BlindLeft(firstEl, {
				afterFinish: moveToEnd,
				queue: { position: 'end', scope: 'carouselSlide', limit: 1 }
			});
		});

		$("left-control").observe("click", function() {
			lastEl = getLastElement();
			Effect.BlindRight(lastEl, {
				beforeStart: moveToStart,
				queue: { position: 'end', scope: 'carouselSlide', limit: 1 }
			});
		});
	}
	else {
		$("carousel").addClassName("static");
	}

	setMouseOverWatch();
}

function getLastElement() {
	var childEls = $("scroller").immediateDescendants();
	return childEls[childEls.length - 1].id;
}

function moveToEnd(el) {
	oldEl = $(el.element).remove();
	$("scroller").appendChild(oldEl);
	$(oldEl.id).show();
}

function moveToStart(el) {
	$(el.element).hide();
	oldEl = $(el.element).remove();
	firstEl = $("scroller").immediateDescendants()[0];
	$("scroller").insertBefore(oldEl, firstEl);
}

function setMouseOverWatch() {
	for (var i = 0; i < scrollEls.length; i++) {

		scrollEls[i].onmouseover = function() {
			queueName = "scroller" + this.id;

     		var queue = Effect.Queues.get(queueName);
			queue.each(function(e) { e.cancel() });

			new Effect.Scale(this, 100, {
				duration:  0.5 * (69 + 299 - this.getHeight())/299,
				scaleX: false,
				scaleFrom: 100*(this.getHeight()/299),
				scaleContent: false,
				scaleMode: {originalHeight: 299 },
				queue: { position: 'end', scope: queueName }
			});
		};

		scrollEls[i].onmouseout = function() {
			queueName = "scroller" + this.id;

			/*    var queue = Effect.Queues.get(queueName);
				queue.each(function(e) { e.cancel() });*/

			new Effect.Scale(this, 100, {
				duration: 0.5,
				//transition: Effect.Transitions.reverse,
				scaleX: false,
				scaleFrom: 100*299/69,
				scaleContent: false,
				scaleMode: {originalHeight: 69 },
				queue: { position: 'end', scope: queueName }
			});
		};
	}
}
setCarousel();
