/** Plugin Jquery Slidebg.js
* Version : 0.1 - basé sur la version jquery-1.4.2 de Jquery
* Description : permet de lancer un slidewhow d'images en fondu enchainé en arrière plan.
* Auteur : Nathalie Crévenat <postmaster@n-crevenat.com>
* Date de création : 22/08/2010
* Compatibilité : IE6/IE7/IE8/FF/Chrome (les autres navigateurs ne sont pas testés)
*
* Exemple d'appel :
* ====JS===
* var aImages = new Array("/img/bg_01.jpg", "/img/bg_02.jpg");
* $("#bg").slidebg({
*	"interval": "4000", 
*	"duration": "1500",
*	"data" : aImages,
*	"idPauseBtn" : "pauseBtn",
*	"idPlayBtn" : "playBtn"
*	});
* ===CSS===
* #bg {
*	background : 	url(/img/bg_01.jpg) no-repeat top center;
*	height : 	1024px;
*	left :		0;
*	position : 	absolute;
*	top : 		0;
*	width :		100%;
*	z-index : 	-1;
* }
* ===HTML===
* <div id="bg"></div>
* <p><a href="" id="pauseBtn">Pause</a></p>
* <p><a href="" id="playBtn">Play</a></p>
*
*
*/

(function($) {
	$.fn.slidebg = function(params) {
		var defaults = {
			"interval": 5000,
			"duration": 3000,
			"data" : new Array(),
			"idPauseBtn" : "pauseBtn",
			"idPlayBtn" : "playBtn"
		};

		// Fusionne les paramètres par défaut et ceux de l'utilisateur
		params = $.extend( defaults, params);

		if (params.data.length < 2) {
			//alert("Data must contains at least 2 elements");
			return this;
		}
		if (params.duration >= params.interval) {
			params.interval = params.interval+params.duration+100;
		}

		// Crée les deux calques nécessaires pour le slide
		$(this).append('<div></div>');
		$(this).append('<div></div>');
		var div1 = $(this).children(':first');
		var div2 = $(this).children(':last');
		div1.css({
			"background-image" : "url("+params.data[0]+")",
			"background-repeat" : "no-repeat",
			"background-position" : "top center",
			"position" : "absolute",
			"top" : "0",
			"z-index" : "0",
			"zoom" : "1",
			"width" : "100%",
			"height": $(this).css('height')
			});

		div2.css({
			"background-image" :  "url("+params.data[1]+")",
			"background-repeat" : "no-repeat",
			"background-position" : "top center",
			"position" : "absolute",
			"top" : "0",
			"width" : "100%",
			"z-index" : "0",
			"zoom" : "1",
			"opacity" : "0",
			"height": $(this).css('height')
			});

		$(this).css({"background" : "none"});
		var current = 0;
		var next = 1;
		var changeBg = function (){
			current ++;
			if(current == params.data.length) {
				current= 0;
			}
			next ++;
			if(next  == params.data.length) {
				next = 0;
			}
			div1.css({"background-image" : "url(" + params.data[current] + ")", "opacity":"1"});
			div2.css({"background-image" : "url(" + params.data[next] + ")", "opacity":"0"});
		};

		var animateBg = function (){
			div1.animate({"opacity" : "0"}, params.duration);
			div2.animate({"opacity" : "1"}, params.duration, changeBg);
		};

		// pause et play sont optionnels
		if($("#"+params.idPauseBtn)) {
			$($("#"+params.idPauseBtn)).click(function(){
				clearInterval(timer);
				return false;
			});
		}

		if($("#"+params.idPlayBtn)) {
			$($("#"+params.idPlayBtn)).click(function(){
				timer = setInterval(animateBg, params.interval);
				animateBg();
				return false;
			});
		}

		var timer=setInterval(animateBg, params.interval);
		return this;
	};
})(jQuery);