/* ************************************************************************************* *\
 * The MIT License
 * Copyright (c) 2007 Fabio Zendhi Nagao - http://zend.lojcomm.com.br
 * Adapted by Matthias von Deetzen
 * 
 * Permission is hereby granted, free of charge, to any person obtaining a copy of this
 * software and associated documentation files (the "Software"), to deal in the Software
 * without restriction, including without limitation the rights to use, copy, modify,
 * merge, publish, distribute, sublicense, and/or sell copies of the Software, and to
 * permit persons to whom the Software is furnished to do so, subject to the following
 * conditions:
 * 
 * The above copyright notice and this permission notice shall be included in all copies
 * or substantial portions of the Software.
 * 
 * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED,
 * INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A
 * PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
 * HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
 * OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE
 * SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
 * 
\* ************************************************************************************* */

/*****
* 
* iCarousel Script
* 
* Description:	adaption for iCarousel script for COPS
* Author:		Matthias von Deetzen
* Copyright:	CeWe Color AG & Co OhG
* 
*****/

var iCarousel = new Class({
	options: {
		animation: {
			type: "fadeNscroll",// fadeNscroll, scroll, fade
			direction: "left",// if type = scroll, set: top || left
			amount: 1,// if type = scroll, set the amount to scroll
			transition: Fx.Transitions.Cubic.easeInOut,
			duration: 500,
			rotate: {
				type: "manual",// auto || manual
				interval: 5000,// if type = auto, set the interval (ms)
				onMouseOver: "stop",// if type = auto, set the onmouseover behavior: stop || proceed
				oneTime: true,// if type = auto, rotate only once
				onClickButton: "stop"//if type = auto, set the onclick behavior: stop auto scroll || proceed auto scroll
			}
		},

		item: {
			klass: "icarusel_item",
			size: 970
		},

		idPrevious: "previous",
		idNext: "next",
		idToggle: "toggle",

		onClickPrevious: function() {this.options.animation.rotate.type = "manual";},
		onClickNext: function() {this.options.animation.rotate.type = "manual";},
		onPrevious: Class.empty,
		onNext: Class.empty,
		onGoTo: Class.empty
	},

	initialize: function(container, options) {

		this.setOptions(options);
		this.container = $(container);
		this.aItems = $A($$('.'+ this.options.item.klass));
		this.aItemCount = this.aItems.length;
		this.isMouseOver = false;
		this.counter = 0;
		this.lastActive = 0;

		this.options.item.size = document.getElementsByClassName(this.options.item.klass)[0].offsetWidth;

		if(this.options.idPrevious != "undefined" && $(this.options.idPrevious)) {
			$(this.options.idPrevious).addEvent("click", function(event) {
				if (this.options.animation.rotate.onClickButton == "stop") {
					this.options.animation.rotate.type = "manual";
					this.timer = $clear(this.timer);
				}
				new Event(event).stop();
				$(this.options.idPrevious).blur();
				this._previous();
				this.fireEvent("onClickPrevious", this, 20);
			}.bind(this));// check if value is not "undefined" before start search the dom with $()
			$(this.options.idPrevious).addEvents({
				"mouseenter": function() {
					this.isMouseOver = true;
				}.bind(this),
				"mouseleave": function() {
					this.isMouseOver = false;
				}.bind(this)
			});// stop the animation on mouse over button
		}
		if(this.options.idNext != "undefined" && $(this.options.idNext)) {
			$(this.options.idNext).addEvent("click", function(event) {
				if (this.options.animation.rotate.onClickButton == "stop") {
					this.options.animation.rotate.type = "manual";
					this.timer = $clear(this.timer);
				}
				new Event(event).stop();
				$(this.options.idNext).blur();
				this._next();
				this.fireEvent("onClickNext", this, 20);
			}.bind(this));
			$(this.options.idNext).addEvents({
				"mouseenter": function() {
					this.isMouseOver = true;
				}.bind(this),
				"mouseleave": function() {
					this.isMouseOver = false;
				}.bind(this)
			});// stop the animation on mouse over button
		}
		if(this.options.idToggle != "undefined" && $(this.options.idToggle))
			$(this.options.idToggle).addEvent("click", function(event) {new Event(event).stop(); this._toggle()}.bind(this));

		var oAn = this.options.animation; // short hand
		if (RedDotMode)
		{
		    this.options.animation.type = 'fade';
		    duration = 1;
		    oAn.duration = 1; 
		}
		switch(this.options.animation.type.toLowerCase()) {
			case "fade":
				this.aItems.each(function(item) {
					item.fx = item.effect("opacity", {duration: oAn.duration, transition: oAn.transition});
					item.setStyle("opacity", 0);
					item.addEvents({
						"mouseenter": function() {
							this.isMouseOver = true;
							if(this.options.animation.rotate.type == "auto") this.timer = $clear(this.timer);
						}.bind(this),
						"mouseleave": function() {
							this.isMouseOver = false;
							if(this.options.animation.rotate.type == "auto") this.timer = this._autoRotate.periodical(this.options.animation.rotate.interval, this);
						}.bind(this)
					});
				}.bind(this));
				this.height = this.container.getStyle("height").toInt();
				this.atScreen = 0;
				this._animate(this.atScreen);
				break;

			default:
				(2).times(function() {
					this.aItems.each(function(item) {
						item.clone().injectInside(this.container);
					}.bind(this));
				}.bind(this));
				this.aItems = $A($$('.'+ this.options.item.klass));
				this.aItems.each(function(item) {
					item.addEvents({
						"mouseenter": function() {
							this.isMouseOver = true;
							if(this.options.animation.rotate.type == "auto") this.timer = $clear(this.timer);
						}.bind(this),
						"mouseleave": function() {
							this.isMouseOver = false;
							if(this.options.animation.rotate.type == "auto") this.timer = this._autoRotate.periodical(this.options.animation.rotate.interval, this);
						}.bind(this)
					});
				}.bind(this));
				this.fx = this.container.effects({duration: oAn.duration, transition: oAn.transition, wait: false});
				this.atScreen = this.aItems.length / 3;
				this.container.setStyle(oAn.direction, - this.atScreen * this.options.item.size);
				break;
		}

		if(this.options.animation.rotate.type == "auto") {
			if (this.options.animation.rotate.onlyOnce) {
				this._autoRotate(this.options.animation.rotate.interval, this);
				this.options.animation.rotate.type = "manual";
			}
			else {
				this.timer = this._autoRotate.periodical(this.options.animation.rotate.interval, this);
			}
		}
		this.iCarouselSetLink(0);
		this.iCarouselSetNavTitle(0);

		if (RedDotMode)
		{
			if (readCookie('RedDotPageGuid') != RedDotPageGuid)
			{
				writeCookie('RedDotPageGuid', RedDotPageGuid);
				writeCookie('icarousel_current_item', 0);
			}
			else {
				if (readCookie('icarousel_current_item') == null) {
					writeCookie('icarousel_current_item', 0);
				}
				else {
					this.goTo(readCookie('icarousel_current_item'));
					this.options.animation.rotate.type = "manual";
					this.timer = $clear(this.timer);
				}
			}
		}
	},

	goTo: function(n) {
		switch(this.options.animation.type.toLowerCase()) {
			case "fade":
				var lastIndex = this.atScreen;
				this.atScreen = Math.abs(n % (this.aItems.length / 3));
				this._animate(this.atScreen, lastIndex);
				break;

			default:
				this.atScreen = Math.abs(n % (this.aItems.length / 3));
				this.atScreen += this.aItems.length / 3;
				this._animate(this.atScreen);

				break;
		}

		if(this.options.animation.rotate.type == "auto"){this.timer = $clear(this.timer);}
		if(this.options.animation.rotate.type == "auto"){this.timer = this._autoRotate.periodical(this.options.animation.rotate.interval, this)};

		this.fireEvent("onGoTo", this, 20);
		this.linkSetActive(n);
		this.iCarouselSetLink(n);
		this.iCarouselSetNavTitle(n);
	},

	iCarouselSetLink: function(id)
	{
		if (this.options.item.klass == 'icarusel_item')
		{
			if (document.getElementById('icarousel_link'))
			{
				var iLink = $('icarousel_link');

				if (icarousel_link[id] && icarousel_link[id]['link'] && icarousel_link[id]['text']) {

					iLink.style.display = 'block';
					iLink.href = icarousel_link[id]['link'];
					iLink.childNodes[0].innerHTML = icarousel_link[id]['text'];

					iLink.addEvents({
						"mouseenter": function() {
							this.isMouseOver = true;
						}.bind(this),
						"mouseleave": function() {
							this.isMouseOver = false;
						}.bind(this)
					});
				}
				else if (iLink.childNodes[0].innerHTML != " ") { }
				else {
					iLink.style.display = 'none';
				}

				var plugin = false;
				if (typeof(PluginDetection) != 'undefined') {
					plugin = new PluginDetection();
				}
				setOrderLinks(plugin);
			}
		}
	},

	iCarouselSetNavTitle: function(id)
	{
		if (this.options.item.klass == 'icarusel_item')
		{
			if ($('icarousel_buttons_title') && $('icarousel_title_' + (id + 1))) {
				$('icarousel_buttons_title').innerHTML = $('icarousel_title_' + (id + 1)).innerHTML;
			}
			else {
				$('icarousel_buttons_title').innerHTML = '';
			}
		}
	},

	linkSetActive: function(id)
	{
		for (i = 0; i <= 20; i++)
		{
			if (obj = document.getElementById('thumb' + i))
			{
				obj.className = '';
			}
			if (obj = document.getElementById('lightbox_menu' + i))
			{
				obj.className = '';
			}
		}

		if (document.getElementById('thumb' + id))
		{
			document.getElementById('thumb' + id).className = 'active';
			document.getElementById('thumb' + id).blur();
		}
		if (document.getElementById('lightbox_menu' + id))
		{
			document.getElementById('lightbox_menu' + id).className = 'active';
			document.getElementById('lightbox_menu' + id).blur();
		}
	},

	_previous: function() {
		switch(this.options.animation.type.toLowerCase()) {
			case "fade":
				var lastIndex = this.atScreen;
				this.atScreen -= this.options.animation.amount;
				if(this.atScreen < 0) this.atScreen = (this.aItems.length - 1);
				this._animate(this.atScreen, lastIndex);
				break;

			default:
				this.atScreen -= this.options.animation.amount;
				if(this.atScreen < this.aItems.length / 3) {
					this.container.setStyle(this.options.animation.direction, - this.options.item.size * this.aItems.length * 2 / 3);
					this.atScreen = this.aItems.length * 2 / 3 - this.options.animation.amount;
				}
				this._animate(this.atScreen);
				break;
		}

		var index = this.atScreen - (this.aItems.length / 3) == (this.aItems.length / 3) ? 0 : this.atScreen - (this.aItems.length / 3);
		this.linkSetActive(index);
		this.iCarouselSetLink(index);
		this.iCarouselSetNavTitle(index);

		this.aItems[this.lastActive].id = '';
		this.aItems[this.atScreen].id = 'icarousel_active';
		this.lastActive = this.atScreen;

		this.fireEvent("onPrevious", this, 20);
		if (RedDotMode)
		{
			writeCookie('icarousel_current_item', index);
		}
	},

	_next: function() {
		switch(this.options.animation.type.toLowerCase()) {
			case "fade":
				var lastIndex = this.atScreen;
				this.atScreen += this.options.animation.amount;
				if(this.atScreen >= this.aItems.length) this.atScreen = 0;
				this._animate(this.atScreen, lastIndex);
				break;

			default:
				this.atScreen += this.options.animation.amount;
				if(this.atScreen > this.aItems.length * 2 / 3) {
					this.container.setStyle(this.options.animation.direction, - this.options.item.size * this.aItems.length / 3);
					this.atScreen = this.aItems.length / 3 + this.options.animation.amount;
				}
				this._animate(this.atScreen);
				break;
		}

		var index = this.atScreen - (this.aItems.length / 3) == (this.aItems.length / 3) ? 0 : this.atScreen - (this.aItems.length / 3);
		this.linkSetActive(index);
		this.iCarouselSetLink(index);
		this.iCarouselSetNavTitle(index);

		this.aItems[this.lastActive].id = '';
		this.aItems[this.atScreen].id = 'icarousel_active';
		this.lastActive = this.atScreen;

		this.fireEvent("onNext", this, 20);
		if (RedDotMode)
		{
			writeCookie('icarousel_current_item', index);
		}
	},

	_toggle: function() {
		(this.container.getStyle("height").toInt() == 0) ?
			this.container.effect("height", { duration:1000, transition: Fx.Transitions.Sine.easeInOut }).start(this.height):
			this.container.effect("height", { duration:1000, transition: Fx.Transitions.Sine.easeInOut }).start(0);
	},

	_autoRotate: function() {
		if (this.counter < this.aItemCount || !this.options.animation.rotate.oneTime) {
			if(this.options.animation.rotate.onMouseOver == "stop" && !this.isMouseOver) this._next();
			this.counter++;
		}
	},

	_animate: function(a, b) {
		switch(this.options.animation.type) {
			case "fade":
				if($defined(b)) {
					this.aItems[b].fx.start(0).chain(function() {
					this.aItems[a].fx.start(1);}.bind(this));
				} else {
					this.aItems[a].fx.start(1);
				}
				break;

			case "scroll":
				var that = this;
				if(that.options.animation.direction == "top") {
					that.fx.start({"top" : - a * that.options.item.size});
				} else if (that.options.animation.direction == "bottom") {
					that.fx.start({"left" : a * that.options.item.size});
				} else {
					that.fx.start({"left" : - a * that.options.item.size});
				}
				break;

			case "fadeNscroll":
				var that = this;
				if(that.options.animation.direction == "top") {
					that.fx.start({"opacity":0.75}).chain(function() {
						that.fx.start({"top" : - a * that.options.item.size}).chain(function() {
							that.fx.start({"opacity": 1});
						});
					});
				} else {
					that.fx.start({"opacity":0.75}).chain(function() {
						that.fx.start({"left" : - a * that.options.item.size}).chain(function() {
							that.fx.start({"opacity": 1});
						});
					});
				}
				break;
		}
	}
});
iCarousel.implement(new Events); // Implements addEvent(type, fn), fireEvent(type, [args], delay) and removeEvent(type, fn)
iCarousel.implement(new Options);// Implements setOptions(defaults, options)