<!--
// depends upon mootools.js and cnet.moo.extensions.js

// this array can be generated in php in a js container in the header of the page		
/*var arrImg = ['media/folio1.jpg',
'media/folio2.jpg',
'media/baktapur.jpg',
'media/folio3.jpg',
'media/folio4.jpg',
'media/folio5.jpg',
'media/baktapur.jpg',
'media/folio6.jpg',
'media/folio7.jpg',
'media/folio8.jpg',
'media/folio9.jpg'];*/
		
var bkfoo = {
	makeBfkSlideShows: function() {
		new bfkSlideShow({
		  startIndex: 0,
		  imgUrls: arrImg,
		  progressContainer: 'imgNow',
		  maxContainer: 'imgMax',
		  nextLink: 'suivant',
		  prevLink: 'precedent',
		  imgContainer : ['photodiv1','photodiv2','photodiv3'], //array of the 3 divs containing the images
		  currentImgContainerIndex: 0, //0, 1 ou 2 en boucle
		  currentImageIndex : 0,
		  wrap: false 		  
		});
	},	
	init: function(){
		this.makeBfkSlideShows();
	}
};
/*	window.onDomReady will call my guide.init on page load, but the "this" will be the window, so
		I bind the guide to the function call explicitly. I wouldn't have this problem if I wrote it this way:

window.onDomReady(function(){
	bkfoo.init();
});*/
window.onDomReady(bkfoo.init.bind(bkfoo));


/*************************************************************************************************/
	var bfkSlideShow = new Class({
		options: {
			startIndex: 0, //what image to start on; zero is the first
			slides: [], //array of images
			imgContainer : [], //array of the 3 divs containing the images
			currentImgContainerIndex: 0, //0, 1 ou 2 en boucle
			progressContainer: false,
			maxContainer: false,
			
			currentImageIndex: 0,
			nextLink: false, //here are two links or images to be used to cycle to the next slide and previous slidee
			prevLink: false,
			wrap: true, //an option to let the user go 1,2,3 and then back to 1 when there are no more slides
			disabledLinkClass: 'disabled', 
			onNext: Class.create(),
			onPrev: Class.create(),
			onSlideClick: Class.create(),
			/*	This object is just a placeholder for options to pass to Fx.Style */
			crossFadeOptions: {fps: 25, duration: 600, transition: Fx.Transitions.Quart.easeInOut}
		},
		
		initialize: function(options){
			this.setOptions(options);
			this.setCounters();
			this.setUpNav();
			
			$(this.options.imgContainer[0]).setStyle ('background','transparent url("'+ arrImg[0]  +'") no-repeat center');
			$(this.options.imgContainer[0]).effect('opacity', this.options.crossFadeOptions).start(1);
			
			$(this.options.imgContainer[1]).setStyles ({'background':'transparent url("'+ arrImg[1]  +'") no-repeat center','visibility':'hidden','opacity':'0'});
			//$(this.options.imgContainer[1]).effect('opacity', this.options.crossFadeOptions).start(0);
			$(this.options.imgContainer[2]).effect('opacity', this.options.crossFadeOptions).start(0);
			$('precedent').effect('opacity', this.options.crossFadeOptions).start(0.3);
			$('suivant').setStyle ('cursor','pointer');

		},
		/*	this function just updates the placeholders for the numbers of the images. i.e.: viewing 3 of 7 */
		setCounters: function(){
			//alert(this.options.currentImgContainerIndex);
			if($(this.options.progressContainer))$(this.options.progressContainer).setHTML(this.options.currentImageIndex + 1);
			if($(this.options.maxContainer))$(this.options.maxContainer).setHTML(arrImg.length);
		},
		setUpNav: function(){	
			/*	next calls .cycleForward	*/
			if($(this.options.nextLink)) $(this.options.nextLink).addEvent('click', function(){
					this.cycleForward();
				}.bind(this));
			/*	prev calls .cycleBack	*/
			if($(this.options.prevLink)) $(this.options.prevLink).addEvent('click', function(){
					this.cycleBack();
				}.bind(this));
		},
/*		11 01 32     boulogne */
/*	Property: cycleForward Shows the next slide. */
		cycleForward: function(){
		//on boucle sur 3
			if (this.options.currentImageIndex < arrImg.length - 1){
				if(this.options.currentImgContainerIndex == 2 ){
					this.options.nextImgContainerIndex = 0 ;
					this.options.futureImgContainerIndex = 1 ;
				} else {
					if(this.options.currentImgContainerIndex == 1 ){
						this.options.futureImgContainerIndex = 0 ;
					} else {
						this.options.futureImgContainerIndex = 2 ;
					}
					this.options.nextImgContainerIndex = this.options.currentImgContainerIndex + 1 ;
				}
				$(this.options.imgContainer[this.options.currentImgContainerIndex]).effect('opacity', this.options.crossFadeOptions).start(0);
				$(this.options.imgContainer[this.options.nextImgContainerIndex]).effect('opacity', this.options.crossFadeOptions).start(1);
				$(this.options.imgContainer[this.options.futureImgContainerIndex]).setStyle ('background','transparent url("'+ arrImg[this.options.currentImageIndex + 2]  +'") no-repeat center');
				
				this.options.currentImgContainerIndex = this.options.nextImgContainerIndex;
				this.options.currentImageIndex++ ;
				this.setCounters();
				
				if (this.options.currentImageIndex == 1){
					$(this.options.prevLink).setStyles ({'cursor':'pointer','color':'#bbb'});
					$(this.options.prevLink).effect('opacity', this.options.crossFadeOptions).start(1);			
				}
				if (this.options.currentImageIndex == ( arrImg.length - 1)){
					$(this.options.nextLink).setStyles ({'cursor':'default','color':'#333'});
					$(this.options.nextLink).effect('opacity', this.options.crossFadeOptions).start(0.3);										
				}				
				
			}
		},
/*	Property: cycleBack 	*/
		cycleBack: function(){
			if(this.options.currentImageIndex > 0){
				if(this.options.currentImgContainerIndex == 0 ){
					this.options.nextImgContainerIndex = 2 ;
					this.options.futureImgContainerIndex = 1 ;
				} else {
					if(this.options.currentImgContainerIndex == 1 ){
						this.options.futureImgContainerIndex = 2 ;
					} else {
						this.options.futureImgContainerIndex = 0 ;
					}
					this.options.nextImgContainerIndex = this.options.currentImgContainerIndex - 1 ;
				}
				$(this.options.imgContainer[this.options.currentImgContainerIndex]).effect('opacity', this.options.crossFadeOptions).start(0);
				$(this.options.imgContainer[this.options.nextImgContainerIndex]).effect('opacity', this.options.crossFadeOptions).start(1);
				$(this.options.imgContainer[this.options.futureImgContainerIndex]).setStyle ('background','transparent url("'+ arrImg[this.options.currentImageIndex - 2]  +'") no-repeat center');
				
				//this.fireEvent('onPrev');
				
				this.options.currentImgContainerIndex = this.options.nextImgContainerIndex;
				this.options.currentImageIndex-- ;
				this.setCounters();
					
				if (this.options.currentImageIndex == 0){
					$(this.options.prevLink).setStyles ({'cursor':'default','color':'#333'});
					$(this.options.prevLink).effect('opacity', this.options.crossFadeOptions).start(0.3);
				}		
				if (this.options.currentImageIndex == ( arrImg.length - 2)){
					$(this.options.nextLink).setStyles ({'cursor':'pointer','color':'#bbb'});
					$(this.options.nextLink).effect('opacity', this.options.crossFadeOptions).start(1);
				}	
			}
		},
		slideClick: function(){
			this.fireEvent('onSlideClick', [this.slides[this.now], this.now]);
		}
	});
bfkSlideShow.implement(new Events);
bfkSlideShow.implement(new Options);


//-->