var Carousel = {
	timer: null,
	picturesContainer: null,
	shortcutsContainer: null,
	pictures: {},
	shortcuts: {},
	width: 0,
	current_position: 0,
	step: 0,

	// déclenche le carousel 
	start: function(picture_paths, container)
	{
		this.width = container.offsetWidth;
		this.step = Math.floor(this.width/100);
		
		// creation du mask
		var mask = document.createElement('div');
		mask.className = 'mask';
		// ajout du mask au conteneur global
		container.appendChild(mask);
		
		
		// creation du conteneur d'images
		this.picturesContainer = document.createElement('div');
		this.picturesContainer.className = 'pictures';
		// ajout des images
		for( j in picture_paths )
		{
			picture = document.createElement('img');
			picture.src = picture_paths[j];
			picture.setAttribute('id_picture', j);
			this.picturesContainer.appendChild(picture);
		}
		// ajout du conteneur d'images au conteneur global
		container.appendChild(this.picturesContainer);
		

		// creation du conteneur de raccourci
		this.shortcutsContainer = document.createElement('div');
		this.shortcutsContainer.className = 'shortcut';
		// creation des raccourcis
		for( j in picture_paths )
		{
			shortcut = document.createElement('a');
			shortcut.href = '#';
			shortcut.setAttribute('id_picture', j);
			shortcut.carousel = this;
			shortcut.onclick = function(){
				Carousel.goToPicture(this.getAttribute('id_picture'));
				return false;
			};
			this.shortcutsContainer.appendChild(shortcut);

			this.shortcuts[j] = shortcut;	
		}
		// ajout du conteneur de raccourci au conteneur global
		container.appendChild(this.shortcutsContainer);
		
		// premiere initialisation du tablea d'image 
		this.initPictures();		
		this.loadTimer(4000);
	},

	// Permet de lancer le timer
	loadTimer: function(time)
	{
		this.timer = window.setTimeout("Carousel.change()", time); 
	},

	// s'occupe du changement de photo
	change: function()
	{
		var time = 20;

		this.current_position += this.step;

		// déplace les images
		this.movePictures();
		
		if( this.current_position+this.step >= this.width )
		{
			// reinitialise la position
			this.current_position = 0;
			this.movePictures();
			
			// deplace la premiere photo en derniere position
			this.picturesContainer.appendChild(this.pictures[0]);
			this.initPictures();
														
			time = 4000;
		}

		// relace le timer
		this.loadTimer(time);
	},

	// deplace la photo en cours
	movePictures: function()
	{
		this.pictures[0].style.marginLeft = '-' + this.current_position + 'px';
	},

	// passe directement a une photo donnée
	goToPicture: function(id_picture)
	{
		var found = false;
		
		// on arrete le timer
		window.clearTimeout(this.timer);

		// reinitialise les positions
		this.current_position = 0;
		this.movePictures();

		// on parcours les images et on les passe a la fin tant que ce n'est pas celle attendue
		for( i in this.pictures )
		{
			if( !found && this.pictures[i].getAttribute('id_picture') != id_picture )
				this.pictures[i].parentNode.appendChild(this.pictures[i]);
			else if( this.pictures[i].getAttribute('id_picture') == id_picture )
				found = true;
		}
		this.initPictures();
		
		this.loadTimer(4000);
	},

	// crée le tableau des photo et positionne les raccourci correctement
	initPictures: function()
	{
		var pictures = this.picturesContainer.getElementsByTagName('img'),
			current_id = 0;
		this.pictures = {};

		for(var i=0; i<pictures.length; i++)
			this.pictures[i] = pictures[i];

		current_id = this.pictures[0].getAttribute('id_picture');

		for( id_picture in this.shortcuts )
		{
			if(id_picture == current_id)
				this.shortcuts[id_picture].className = 'current';
			else
				this.shortcuts[id_picture].className = '';
		}
	}
};
