/****************************************************************************

Carrousel object for displaying photos and video.

To use this script, the html for the carrousel needs to be complete,
so no element will be created by this script. If for example you need tabs, 
these tabs have to be present in the html. The visuals you want to show have
to be present as well. 
If you choose to use fancybox for displaying popups, the fancybox script and 
stylesheet must be loaded beforehand.
When using video with the jwplayer, also be sure to load the swfobject.js.

jQuery version requirement: 1.4+

****************************************************************************/

function Carrousel(elem, obj){
	var empty = {};

	this.elem = elem;
	this.settings = jQuery.extend(empty, this.defaultSettings, obj);
	this.visuals = this.elem.children('.visuals');
	this.settings.maxItems = this.visuals.children('.visual').length;
	
	if(this.settings.autoPlay == true){
		var startMe = this.startShow();
	}
	
	//this.videoPlayer = elem.children('.videoplayer');
	
	if(this.settings.withControls == true){
		this.controls = this.elem.children(".controls");
		switch(this.settings.controlsType){
			case 'tabs':
				this.elem.children('ul').addClass(this.settings.controlsPosition);
				this.elem.children('ul').show();
				this.initTabs();
			break;
			case 'browse':
				this.initControls();	
			break;
			case 'pages':
				this.initPages();
			break;
		}
	} else {
		this.elem.children('ul').hide();
	}
	
	for(var i = 0; i < this.settings.maxItems; i++){
		var url = this.visuals.children(".visual").eq(i).children("a").attr("href");
		this.urls.push(url);
	}
	
	if(this.settings.withFancybox == true){
		this.initFancybox();
	}	
}

Carrousel.prototype.counter = 0;
Carrousel.prototype.interval;
Carrousel.prototype.visuals;
Carrousel.prototype.controls;
Carrousel.prototype.urls = [];
Carrousel.prototype.options = {};
Carrousel.prototype.flashvars = {};
Carrousel.prototype.flashparams = {allowfullscreen:'true', wmode:'transparent'};
Carrousel.prototype.flashattributes = {};

/* the default settings can be overruled while instantiating the carrousel.
	examples: 
	var mainCarrousel = Carrousel.setup('mainCarrousel', {autoPlay:true , withControls:true, controlsType:'tabs', controlsPosition:'right'});
	var photogallery = Carrousel.setup('photoslider', {autoPlay:true, withControls:true, controlsType:'browse', controlsPosition:'bottom', withFancybox:true});	
*/
Carrousel.prototype.defaultSettings = {
	autoPlay:false,
	withControls:true,
	controlsType:'tabs', /* tabs | browse */
	controlsPosition:'bottom', /* bottom | right */
	withFancybox:false,
	fancyboxSettings:{cyclic:true, transitionIn:'elastic', transitionOut:'elastic', orig:this.elem, type:'image'},
	maxItems:4,
	timeOut:8000,
	fadeLength:1000,
	tabHoverDelay:250,
	direction:'forward' /* forward | back */
};

Carrousel.prototype.initTabs = function(){
	var $this = this;
	var tabAnchor = this.elem.children('ul').find('a');
	var tabdelay;
	var index = 0;
	tabAnchor.bind('mouseover', function(){
		var newIndex = $(this).parents('li').index();
		if(tabdelay) clearTimeout(tabdelay);
		tabdelay = setTimeout(function(){
			if (index === newIndex) {
				return;
			}
			index = newIndex;
			
			if(true === $this.isStarted()){
				var stopMe = $this.stopShow();
			} 
			$this.switchSlide(index);
		}, $this.settings.tabHoverDelay);
	});
	tabAnchor.bind('mouseout', function(){
		clearTimeout(tabdelay);
		$this.counter = $(this).parents('li').index();
		if($this.settings.autoPlay == true)
			var startMe = $this.startShow();
	});
	tabAnchor.bind('click', function(){
		var index = $(this).parents('li').index();
		var visual = $this.visuals.children('.visual').eq(index);
		if(visual.children('a').length > 0)
			document.location = visual.children('a').attr('href');
	});
	
};

Carrousel.prototype.initControls = function(){
	this.elem.find('span.total').text(this.settings.maxItems);
	var $this = this;
	var nextBtn = this.elem.find(".navigationBar").children("a.next");
	var prevBtn = this.elem.find(".navigationBar").children("a.previous");
	
	nextBtn.bind("click", function() { $this.next(); });
	prevBtn.bind("click", function() { $this.previous(); });
	
	nextBtn.bind("mouseout", function(){
		if($this.settings.autoPlay == true)
			$this.startShow();
	});
	
	prevBtn.bind("mouseout", function(){
		if($this.settings.autoPlay == true)
			$this.startShow();
	});
	
	if ($.browser.msie){
		this.elem.overlay.bind("click", function(){
			$this.elements.link[0].click();
			return false;
		});
	}
};

Carrousel.prototype.initPages = function(){
	var $this = this;
	var pageAnchor = this.controls.children('ul').find('a');
	var tabdelay;
	var index = 0;
	pageAnchor.bind('mouseover', function(){
		var newIndex = $(this).parents('li').index();
		if(tabdelay) clearTimeout(tabdelay);
		tabdelay = setTimeout(function(){
			if (index === newIndex) {
				return;
			}
			index = newIndex;
			
			if(true === $this.isStarted()){
				var stopMe = $this.stopShow();
			} 
			$this.switchSlide(index);
		}, $this.settings.tabHoverDelay);
	});
	pageAnchor.bind('mouseout', function(){
		clearTimeout(tabdelay);
		$this.counter = $(this).parents('li').index();
		if($this.settings.autoPlay == true)
			var startMe = $this.startShow();
	});
	pageAnchor.bind('click', function(){
		var index = $(this).parents('li').index();
		var visual = $this.visuals.children('.visual').eq(index);
		if(visual.children('a').length > 0)
			document.location = visual.children('a').attr('href');
	});
};

Carrousel.prototype.switchSlide = function(nextIndex){
	var li;
	if(this.settings.withControls == true){
		if(this.settings.controlsType == 'tabs'){
			var nextTab = this.elem.children('ul').children('li').eq(nextIndex).children('a');
			li = $(nextTab).parents('li');
			this.elem.children('ul').find('li.active').removeClass('active');
			$(li).addClass('active');
		} else if(this.settings.controlsType == 'browse'){
			this.elem.find("span.index").text(String(nextIndex+1));
		} else if(this.settings.controlsType == 'pages'){
			var nextPage = this.controls.find('li').eq(nextIndex);
			li = $(nextPage);
			this.controls.find('li.active').removeClass('active');
			$(li).addClass('active');
		}
	}
	var slides = this.visuals.children('.visual');	
	var nextSlide = $(slides).eq(nextIndex);
	var active = this.visuals.children('.activeVisual');
	var $this = this;
	active.addClass('lastActive');
	
	if((nextIndex > 0 && this.settings.direction == 'forward') || (nextIndex == this.settings.maxItems - 1 && this.settings.direction == 'back')){
		$(slides).eq(nextIndex).css({opacity:0.0})
			.addClass('activeVisual')
			.animate({opacity: 1.0}, $this.settings.fadeLength, function(){
				active.removeClass('activeVisual lastActive');
		});
	} else if(nextIndex == 0 || this.settings.direction == 'back'){
		$(slides).eq(nextIndex).addClass('activeVisual')
			.animate({opacity: 1.0}, 0, function(){
				active.animate({opacity:0.0}, $this.settings.fadeLength, function(){
					active.removeClass('activeVisual lastActive');
				});
			});
	}
	
	/*var videoData = nextSlide.metadata();
	
	if(videoData.src){
		nextSlide.children('img').add('.sticker').addClass('hide');
		try{
			this.flashattributes = {name:this.settings.flvPlayerID, id:this.settings.flvPlayerID};
			if(this.flashvars){
				this.flashvars['file'] = videoData.src;
				this.flashvars['image'] = videoData.image;
				this.flashvars['controlbar'] = 'over';
				if(this.settings.logo){
					this.flashvars['logo'] = this.settings.logo;
				}
				swfobject.embedSWF("/static/basis/swf/player-licensed.swf", this.settings.flvPlayerID, "430", "258", "9.0.98", false, this.flashvars, this.flashparams, this.flashattributes);
				this.videoPlayer.addClass('active');
			} 
		} catch(err) {  }
	} else {
		this.videoPlayer.removeClass('active');
	}*/
};

Carrousel.prototype.next = function(){
	var stopMe = this.stopShow();
	this.counter = (this.counter+1)%this.settings.maxItems;
	if(this.settings.direction == 'back'){
		this.settings.direction = 'forward';
	}
	this.switchSlide(this.counter);
};

Carrousel.prototype.gotoNextSlide = function(){
	this.counter = (this.counter+1)%this.settings.maxItems;
	this.switchSlide(this.counter);
};

Carrousel.prototype.previous = function(){
	var stopMe = this.stopShow();
	this.counter = (this.counter + this.settings.maxItems - 1) % this.settings.maxItems;
	if(this.settings.direction == 'forward'){
		this.settings.direction = 'back';
	}
	this.switchSlide(this.counter);
};


Carrousel.prototype.startShow = function(){
	if (false === this.isStarted()){
		var $this = this;
		this.settings.direction = 'forward';
		this.interval = null;
		this.interval = setInterval(function() { $this.gotoNextSlide(); }, $this.settings.timeOut);
		return true;
	}
	return false;
};

Carrousel.prototype.stopShow = function(){
	if(true === this.isStarted()){
		clearInterval(this.interval);
		this.interval = null;
		return true;
	}
	return false;
};

Carrousel.prototype.initFancybox = function(){
	// initialize click on zoombutton
	var zoom = this.elem.children("a.zoom");
	var $this = this;
	zoom.click(function(){
		var urls =  [];
		for(var i = 0; i < $this.settings.maxItems; i++){
			var u = $this.visuals.children(".visual").eq(i).children("a").attr("href");
			urls.push(u);
		}
		$this.settings.fancyboxSettings.index = $this.counter;
		$.fancybox(urls, $this.settings.fancyboxSettings);
	});
	// initialize click on photo
	this.visuals.children(".visual").children("a").fancybox(this.settings.fancyboxSettings);
};

Carrousel.prototype.isStarted = function(){
	return this.interval != null;
};

//====================================================================================
// jw-player specific functions for stopping the carrousel when activating the player:
/*function playerReady(obj) {
	player = document.getElementById(obj.id);
	// This line adds the listener.
	player.addModelListener("STATE","pauseCarrousel");
}

function pauseCarrousel(obj) {
	var player = document.getElementById(obj.id);
	var carrouselID = $(player).parents('div.carrousel').attr('id');
	var carrousel = Carrousel.instances[carrouselID];
	// if the state is changed to "PLAYING"
	if(obj.newstate == "PLAYING") {
		carrousel.stopShow();
	}
	if(obj.newstate == "COMPLETED"){
		carrousel.videoPlayer.removeClass('active');
		$("#"+carrouselID).children('.activeVisual').children('.hide').removeClass('hide');
	}
}*/
//====================================================================================


Carrousel.instances = [];
Carrousel.setup = function(id, settings) {
	var elem = $("#" + id);
	if (elem.length !== 1) {
		return null;
	}
	
	var carrousel = new Carrousel(elem, settings);
	Carrousel.instances[id] = carrousel;
	return carrousel;
}