$(document).ready(function()
{
	banniere = new Banner();
	solution = new OurSolution();
	
	
	banniere.loadComplete = function()
	{
		//console.log("loadComplete");
		banniere.slideInt( 0 );
		// events //
		banniere.racine.hover(function()
			{ banniere.pause = true; }, 
		function()
			{ banniere.pause = false; })
		/*.bind( 'mousewheel', function( e, sens )
			{
				clearInterval( banniere.timer );
				if( sens > 0 )
					{ banniere.maj( banniere.actif-1 , 'CLIC' ); }
				else
					{ banniere.maj( banniere.actif+1 , 'CLIC' ); }
				banniere.timeOut();
				return false;
			})
		*/	
		banniere.puceArea.children('.puce').click(function()
		{
			var id = parseInt( $(this).attr('id').replace('puce', '' ) );
			clearInterval( banniere.timer );
			banniere.maj( id, 'CLIC' );
			banniere.timeOut();
			return false;
			//console.log( id );
		})
			
			
		banniere.timeOut();
	}
	solution.loadComplete = function()
	{
		//solution.racine.css('left', -solution.racine.width() );
		
		
		//console.log('solution logComplete');
		solution.items.hover(function()
		{
			solution.survol( $(this) );
		}, function()
		{
			solution.survolOut( $(this) );
		});
		solution.items.click(function()
		{
			var retour = solution.gestion( $(this) );
			return retour;
		})
		solution.racine.hover(function()
		{
			solution.isUseModule = true;
		}, function()
		{
			solution.isUseModule = false;
		})
		if( solution.mode == 'mode1' )
		{
			solution.prev.click(function()
			{
				solution.move( solution.m[solution.mode].width_ferme + solution.m[solution.mode].marge_right, 'prev' )
				return false;
			})
			solution.next.click(function()
			{
				solution.move( solution.m[solution.mode].width_ferme + solution.m[solution.mode].marge_right, 'next' )
				return false;
			})
		}
		solution.initModule();
		if( solution.isIE == undefined )
		{
			solution.flecheOuverture.hover(function()
			{
				solution.ouvrirModule();
			});
			setInterval( function()
			{ 
				if( !solution.isUseModule )
				{
				solution.fermerModule();
				}
			}, 5000);
		}
		else
		{
			solution.ouvrirModule();
		}
		solution.gestionFleche();
	}
	
	
	banniere.init();
	solution.init();
});
/************************************************
*		:: OurSolution ::
*
*	_description :
************************************************/
OurSolution = function() 
{
	o = this;
	this.isExecute = false; // bool savoir si le module doit s'éxécuter 
	this.mode = 'mode1'; // type de mode pour l'affichage du module
	this.racine; // racine du DOM du module
	this.items; // div contenant les solutions
	this.data; // données du DOM
	this.next; // obj btn next 
	this.prev; // obj btn previous 
	this.flecheOuverture; 
	this.nbrSolution; // nombre d'items solution
	this.ease_open = 'linear'; // easing utilisé pour l'ouverture des items
	this.ease_time = 500; // temps de l'animation
	this.move_time = 1000; // temps d'animation du déplacement
	this.actif = 0; // id actif 
	this.limit_prev = 0;
	this.limit_next = 0;
	this.width_item;
	this.width_item_last;
	this.isUseModule = false;
	this.isIE = $.browser.msie;
	this.lienOuverture = 'راهکار ها';
	this.m = new Object();
	this.m['mode1'] = new Object();
	this.m['mode1'].width_ouvert = 225; // longueur de la solutions ouverte
	this.m['mode1'].marge_right = 11; // margin-right des solutions
	this.m['mode1'].width_ferme = 107; // longueur de la solution fermée
	this.m['mode2'] = new Object();
	this.m['mode2'].moduleFerme; // longueur de la solutions ouverte
	
	/************************************************
	*		:: this.initModule ::
	*
	*	_description :
	************************************************/
	this.initModule = function() 
	{
		if( this.mode == 'mode1' )
		{
			this.racine.css('left', -this.racine.width() );
			this.racine.css('left', -this.racine.width() + this.flecheOuverture.width() + 7 );
			this.racine.children(':not(#ouverture)').hide();
		}
		else if( this.mode == "mode2" )
		{
			this.m[this.mode].moduleFerme = - this.racine.height() + this.flecheOuverture.height() + 7;
			this.racine.css('bottom', this.m[this.mode].moduleFerme  );
		}
	}
	/************************************************
	*		:: this.ouvrirModule ::
	*
	*	_description :
	************************************************/
	this.ouvrirModule = function() 
	{
		if( this.mode == 'mode1' )
		{
			o.racine.children(':not(#ouverture)').show();
			o.racine.children('#ouverture').hide();
			o.racine.show().animate(
			{
				left: 0
			}, o.move_time)
			if( $.browser.msie && $.browser.version == '7.0')
				{ o.racine.css('left', 0);}
		}
		else if( this.mode == 'mode2' )
		{
			var pos = parseInt( this.racine.css('bottom').replace('px', '') );
			if( pos < 0 )
			{
				
				if(this.isIE)
				{
					this.racine.css('bottom', 0)
				}
				else
				{
					this.racine.animate(
					{
						bottom:0
					}, 1000);
				}
			}
			else
			{
				this.fermerModule();
			}
		}
	}
	/************************************************
	*		:: this.fermerModule ::
	*
	*	_description :
	************************************************/
	this.fermerModule = function() 
	{
		if( this.mode == 'mode1' )
		{
			if( this.racine.children('#ouverture').css('display') == 'none' )
			{
				this.racine.animate(
				{
					left: -this.racine.width()
				}, this.move_time, 'swing', function()
					{
						o.racine.children(':not(#ouverture)').hide();
						o.racine.children('#ouverture').show();
						o.racine.animate(
						{
							left: -o.racine.width() + o.flecheOuverture.width() + 7
						}, o.ease_time)
					});
			}
		}
		else if( this.mode == 'mode2' )
		{
			if( this.isIE )
			{
				this.racine.css('bottom', o.m[this.mode].moduleFerme )
			}
			else
			{
				this.racine.animate(
				{
					bottom: o.m[this.mode].moduleFerme
				}, o.ease_time)
			}
		}
	}
	/************************************************
	*		:: moveNext ::
	*
	*	_description :
	************************************************/
	this.move = function( pos, sens ) 
	{
		//$("#info").append('actif : '+actif+'<br />')
		var marge = 0;
		this.move.anime = function()
		{
			switch( sens )
			{
				case 'prev':
					if( o.actif != o.limit_prev)
					{
						o.actif++;
						marge = o.actif * pos ;
					}
					break;
				case 'next':
					if( o.actif > o.limit_next )
					{
						o.actif--;
						marge = o.actif * pos ;
					}
					else if( o.actif == o.limit_next )
					{
						o.actif = o.limit_next;
						marge = o.actif * pos ;
					}
					break;
				default :
					marge = o.actif * pos ;
					break;
			};
			//console.log('actif '+o.actif+'  '+o.limit_next+'  '+marge);
			o.racine.children('#items_content').stop().animate(
			{
				marginLeft : marge
			}, o.move_time );
			o.gestionFleche();
		}


		if( this.items.hasClass('ouvert'))
		{
			this.fermeture( this.racine.find('.ouvert') );
			setTimeout(function() 
			{
				solution.move.anime()
			}, 1000);
		}
		else
		{
			this.move.anime();
		}
	}
	/************************************************
	*		:: getId ::
	*
	*	_description :
	************************************************/
	this.getId = function( item ) 
	{
		return parseInt(item.attr('id').replace('solution_', ''));
	}
	
	/************************************************
	*		:: fermetureSolution ::
	*
	*	_description :
	************************************************/
	this.fermeture = function( item ) 
	{
		item.children('img').fadeOut('normal', function()
		{
			item.animate(
			{
				width : o.m[o.mode].width_ferme
			}, o.ease_time, o.ease_open, function()
			{
				o.survolOut( item , true );
				item.removeClass('ouvert');
				//console.log(o.actif+'  '+o.limit_next)
				if( o.actif < o.limit_next )
				{
					o.actif = o.limit_next - 1;
					o.move( o.m[o.mode].width_ferme + o.m[o.mode].marge_right, 'prev' )
				}
			}, o.ease_time, o.ease_open);
		});
	}
	/************************************************
	*		:: ouvertureSolution ::
	*
	*	_description :
	************************************************/
	this.ouverture = function( item ) 
	{
		this.ouverture.anime = function()
		{
			item.animate(
			{
				width : o.m[o.mode].width_ouvert
			}, o.ease_time, o.ease_open, function()
			{
				item.addClass('ouvert')
				item.children('img').hide().fadeIn()
				//gestionFleche()
			});
		};

		pos  = this.getId( item ) + this.actif;
		//console.log(pos+'  '+this.actif)
		//$("#info").append( 'item : '+getId( item )+' | actif : '+actif+' | pos : '+pos+'<br />'  )
		if( pos == 4 )
		{
			this.actif = this.actif - 1;
			this.move( this.m[this.mode].width_ferme + this.m[this.mode].marge_right, 'prev' );
			setTimeout(function() {solution.ouverture.anime()}, this.move_time);
		}
		else if( pos == 5 )
		{
			this.actif = this.actif - 2;
			this.move( this.m[this.mode].width_ferme + this.m[this.mode].marge_right, 'prev' );
			setTimeout(function() {solution.ouverture.anime()}, this.move_time);
		}
		else
			{ this.ouverture.anime(); }
	}
	
	/************************************************
	*		:: reouvertureSolution ::
	*
	*	_description :
	************************************************/
	this.reouverture = function( item, itemOuvert) 
	{
		////console.log('reouverture '+itemOuvert.attr('id'))
		item.addClass('ouvert');
		itemOuvert.children('img').fadeOut('normal', function()
		{
			o.survolOut( itemOuvert , true );
			itemOuvert.animate(
			{
				width : o.m[o.mode].width_ferme
			}, o.ease_time, o.ease_open, function()
			{
				itemOuvert.removeClass('ouvert')
				o.ouverture( item )
			})
		})
	}
	/************************************************
	*		:: gestionSolution ::
	*
	*	_description :
	************************************************/
	this.gestion = function( item ) 
	{
		var retour;
		if( this.mode == 'mode2' )
			{ retour = true; }
		else if( item.hasClass('ouvert'))
			{ this.fermeture( item ); retour = true; }
		else if( this.items.hasClass('ouvert')) // si un item est ouvert
			{ this.reouverture( item, this.racine.find('.ouvert') ); retour = false; }
		else
			{ this.ouverture( item ); retour = false; }
		this.gestionFleche();
		return retour;
	};
	/************************************************
	*		:: solutionHover ::
	*
	*	_description :
	************************************************/
	this.survol = function( item ) 
	{
		if( !item.hasClass( 'ouvert' ) && this.mode == 'mode1' )
		{
			var marge = 10
			item.children('.titre').stop().animate(
			{
				marginTop : marge
			}, 200);
			item.children('.fleche').stop().animate(
			{
				opacity : 1
			}, 200);
		}
	};
	/************************************************
	*		:: solutionOut ::
	*
	*	_description :
	************************************************/
	this.survolOut = function( item, val ) 
	{
		//console.log('out '+val)
		if( !item.hasClass( 'ouvert' ) && this.mode == 'mode1' || val != undefined )
		{
			var marge = 22
			item.children('.titre').stop().animate(
			{
				marginTop : marge
			}, 200);
			item.children('.fleche').stop().animate(
			{
				opacity : 0
			}, 200);
		}
	};
	/************************************************
	*		:: getFriseWidth ::
	*
	*	_description : récupération de la longueur 
	*		max de toutes les solutions à la suite
	*		des une des autres
	*
	*	@nbr : nombre d'item
	*	@long : longueur d'un item ouvert
	*	@long2 : longueur d'un item fermé
	*	@marge : margin-right d'un item
	************************************************/
	this.getFriseWidth = function(nbr, long, long2, marge ) 
	{
		return (( long2 + marge + 2 ) * nbr ) + ( long - long2 );
	}
	/************************************************
	*		:: gestionFleche ::
	*
	*	_description :
	************************************************/
	this.gestionFleche = function() 
	{
	/*	if( this.mode == 'mode1' )
		{
			this.gestionFleche.opac = function( fleche, opacite )
			{
				fleche.animate(
					{
						opacity : opacite
					}, 500)
			}
			//$("#info").append('pos : '+pos+' | actif : '+actif+' | limit : '+limit_next+' | ouvert : '+solutions.hasClass('ouvert')+'<br />')
			if( this.actif >= this.limit_prev )
				{ this.gestionFleche.opac( this.prev, 0); }
			else
				{ this.gestionFleche.opac( this.prev, 1); }
			if( this.actif < this.limit_next && this.items.hasClass('ouvert') && this.pos == 5 )
				{ this.gestionFleche.opac( suivant, 0); }
			else if( this.actif <= this.limit_next && this.items.hasClass('ouvert') )
				{ this.gestionFleche.opac( this.next, 1); }
			else if( this.actif == this.limit_next )
				{ this.gestionFleche.opac( this.next, 0); }
			else
				{ this.gestionFleche.opac( this.next, 1);}
		}*/
	}
	/************************************************
	*		:: this.init ::
	*
	*	_description :
	************************************************/
	this.init = function() 
	{
		// on vérifie l'existance des info du DOM //
		if( $('#our_solutions a').length > 0 )
		{
			this.racine = $('#our_solutions');
			this.isExecute = true;
			this.mode = this.racine.attr('class');
			if( this.mode != 'mode2' )
				{ this.mode = 'mode1'; }
			var content = this.racine.html();
			this.racine.remove();
			
			banniere.racine.append('<div id="our_solutions" class="'+this.mode+'"><div id="items_content">'+content+'</div></div>');
			this.racine = $('#our_solutions');
			this.items =  this.racine.children('#items_content').children('a');
			var ii = 0;
			this.items.each(function()
			{
				$(this).children('.titre').after('<span class="fleche"></span>');
				$(this).children('.fleche').css('opacity', 0)
				$(this).attr('id', 'solution_'+ii);
				ii++;
			})
			this.nbrSolution = this.items.length;
			this.limit_next = 6 - this.nbrSolution;
			
			
			
			switch( this.mode )
			{
				case 'mode1':
					var width_frise = this.getFriseWidth( this.nbrSolution, this.m[this.mode].width_ouvert, this.m[this.mode].width_ferme, this.m[this.mode].marge_right )
					this.racine.children('#items_content').width(width_frise)
					//console.log( 'taille de la frise :: '+width_frise );
				
					this.racine.prepend('<a href="#" id="prev"></a>');
					this.racine.append('<a href="#" id="next"></a>');
					this.racine.append('<a href="#" id="ouverture">'+this.lienOuverture+'</a>');
					this.next = $("#next");
					this.prev = $("#prev");
					this.flecheOuverture = $("#ouverture");
					//console.log('mode1')
					break;
				case 'mode2':	
					this.width_item = ( this.racine.width() / this.nbrSolution ) - parseInt( this.items.css('margin-right').replace('px', ''));
					this.width_item_last = this.racine.width() / this.nbrSolution;
					//alert(this.width_item+' '+this.width_item_last)
					//console.log( width_item )
					if( this.isIE && $.browser.version > 6 || this.isIE == undefined )
					{
						this.items.css('width', this.width_item );
						this.items.last().css('margin-right', 0).css('width', this.width_item_last );
					}
					this.racine.prepend('<a href="#" id="ouverture">'+this.lienOuverture+'</a>');
					this.flecheOuverture = $("#ouverture");
					//console.log('mode2')
					break;
			}
			solution.loadComplete();
		}
	}
}
/************************************************
*		:: Banner ::
*
*	_description :
************************************************/
Banner = function() 
{
	b = this;
	this.racine = $("#banner"); // objet conteneur 
	this.txtArea; // objet contenant les infos de la slide
	this.puceArea; // objet contenant les puces des slides
	this.slideNbr = 0; // nombre de slides
	this.delayt = 10000;
	this.duree = 1000;
	this.durationTxt = 500;
	this.data; // données des slide
	this.actif; // slides active
	this.marge; // heuteur de la parge pour les déplacement
	this.pause = false;
	this.timer; // conteneur du setInterval 
	/************************************************
	*		:: this.refresh ::
	*
	*	_description :
	************************************************/
	this.maj = function( newActif, mode ) 
	{
		////console.log(mode)
		if( mode == 'CLIC' || this.pause == false )
		{
			this.actif = newActif;
			if( this.actif == this.slideNbr )
			{
				this.actif = 0;
				this.txtArea.hide();
			}
			else if( this.actif < 0 )
			{
				this.actif = this.slideNbr - 1;
			}
			if( mode == 'CLIC' )
			{
				this.txtArea.hide();
			}
			
			// changement de puce
			this.puceChange( this.actif );
			
			// animation de la zone de texte
			this.txtArea.stop().animate(
			{
				top : b.txtAreaStop
			}, b.duree );
			
			// animation du fond //
			this.data[0].obj.stop().animate(
			{
				marginTop : b.goTo( b.actif )
			}, b.duree, 'swing',
				function()
				{
					// changement des info de la zone de text
					b.txtAreaChange( b.actif );
					b.txtArea.show().css('opacity', 0).css('top', b.txtAreaStart).stop().animate(
					{
						opacity: 0.9
					}, b.durationTxt );
				} );
			
		}
	}
	/************************************************
	*		:: this.intervalInit ::
	*
	*	_description :
	************************************************/
	this.timeOut = function() 
	{
		this.timer = setInterval(function()
			{ b.maj( b.actif + 1 ); }, b.delayt );
	}
	/************************************************
	*		:: this.puceChange ::
	*
	*	_description :
	************************************************/
	this.puceChange = function( id ) 
	{
		this.puceArea.children('.puce').removeClass('actif');
		this.puceArea.children('#puce'+id).addClass('actif');
	}
	/************************************************
	*		:: this.txtAreaChange ::
	*
	*	_description :
	************************************************/
	this.txtAreaChange = function( id ) 
	{
		this.txtArea.children('h1').html( this.data[id].titre );
		this.txtArea.children('p').text( this.data[id].desc );
		this.txtArea.children('.lien').html( this.data[id].lien );
	}
	/************************************************
	*		:: goTo ::
	*
	*	_description :
	************************************************/
	this.goTo = function( id ) 
	{
		////console.log( "nouvelle id :: "+id+' || nouvelle marge ::  '+-this.marge * id)
		return -this.marge * id;
	}
	/************************************************
	*		:: this.slideInt ::
	*
	*	_description :
	************************************************/
	this.slideInt = function( start ) 
	{
		this.actif = start;
		this.txtAreaChange( start );
		this.data[0].obj.css("margin-top", this.goTo( this.actif ))
		this.data[this.actif].obj.fadeIn();
		this.puceChange( this.actif );
		setTimeout(function() { b.txtArea.fadeIn() }, 100);
	}
	/************************************************
	*		:: this.init() ::
	*
	*	_description :
	************************************************/
	this.init = function() 
	{
		// init du contenu du banniere ...
		// ajout des éléments, des id ...
		var puce = '';
		this.racine.children('.slide').each(function()
		{
			$(this).attr('id', 'slide'+b.slideNbr );
			puce += '<a href="#" id="puce'+b.slideNbr+'" class="puce"></a>';
			b.slideNbr++;
		});
		// ajout des élémnts //
		this.racine.append('<div id="txtArea"><h1>titre</h1><p>para</p><div class="lien"><a href="#">link1</a><a href="#">link2</a></div></div>');
		this.racine.append('<div id="puceArea">'+puce+'</div>')
		this.racine.append('<div id="degrader"></div>');
		this.txtArea = $('#txtArea');
		this.puceArea = $('#puceArea');
		
		
		// enregsitrement de la marge //
		this.marge = 348;
		this.racine.css("height", this.marge)
		//alert( $("#banner").css('height'))
		////console.log('hauteur :: '+this.marge)
		// enregistrements de positions du txtArea
		this.txtAreaStart = parseInt( this.txtArea.css('top').replace('px', '') )
		this.txtAreaStop = this.txtAreaStart - this.marge;
		////console.log('hauteur :: '+this.txtAreaStart+ ' stop :: '+ this.txtAreaStop )
		
		// enregistrement des données //
		this.data = new Object();
		var ii = 0;
		this.racine.children('.slide').each(function()
		{
			var slide = $(this);
			var txt = slide.children('.txt');
		
			b.data[ii] = new Object();
			b.data[ii].id = slide.attr('id');
			b.data[ii].obj = slide;
			b.data[ii].titre = txt.children('.titre').text();
			b.data[ii].desc = txt.children('.description').text();
			b.data[ii].lien = txt.children('.lien').html();
			////console.log( 'id :: '+b.data[ii].id+' || titre ::'+b.data[ii].titre+' || description :: '+b.data[ii].desc )
			txt.remove();
			ii++;
		});
		banniere.loadComplete();
	}
};