document.observe("dom:loaded", function() {
	
	Cufon.replace('.cf',{hover: true});
	
	var sc = new impressionSwapper();
	
	
		
});
var i= 1;

var impressionSwapper = Class.create({
	initialize: function() {
		
		if(!$("home")) return;
		// create div for inserting imgs
		this.wrapper1 = new Element("div",{id: "impression"});
		this.wrapper2 = new Element("div",{id: "impression2"});
		
		this.activeWrapper = this.wrapper1;
		
		$("maincontainer").insert({bottom:this.wrapper1}).insert({bottom:this.wrapper2});
	
		this.timer			= null;
		this.loader			= null;
		this.first 			= true;
		this.currentImage	= 0;
		this.insertIn		= this.wrapper1;
		this.intervalTime	= 1000;
		this.inited			= false;
		// get the images
		this.imageArray		= this.getImages();

	    Event.observe(window, 'resize', this.resizenow.bind(this));
	},
	resizenow: function(){
		var vpd = document.viewport.getDimensions();
		
		//Gather browser size
		var browserwidth = vpd.width;
		var browserheight = vpd.height;
		var offset;
		
		// img original size
		this.orgWidth 	= this.loadingimg.width;
		this.orgHeight 	= this.loadingimg.height;
		
		this.ratio 			= (this.orgHeight/this.orgWidth).toFixed(2); 
		this.screenRatio 	= browserheight/browserwidth.toFixed(2);
		
		//breedte foto kleiner dan breedte vpd-breedte
		if(this.orgWidth < browserwidth){
			
			// img hoogte > browserheight
			if(this.orgHeight > browserheight){
			//	console.log("hoogte foto > vph");
				
				var nw = browserwidth;
				var nh = browserwidth*this.ratio;
			}
			
			// img hoogte < browserheight = foto naar browserheight
			else{
				
			//	console.log("hoogte foto < vph ratio="+this.screenRatio);
				
				if(this.screenRatio < this.ratio){
					var nh = browserwidth * this.ratio;
					var nw = browserwidth;
				}else{
					var nh = browserheight;
					var nw = browserheight / this.ratio;
				}
				
			}

		}else{
			if(this.orgHeight < browserheight){
				//console.log("hoogte foto < vph");
				
				var nh = browserheight;
				var nw = browserheight/this.ratio;
			}
		}
		
		// update size
		this.activeWrapper.down().setStyle({
			width: nw+"px",
			height: nh+"px"
		});
		
	},	
	getImages: function(){
		new Ajax.Request('pages/impression.php',{
			onComplete: function (resp){
				var imgs 		= resp.responseText;
				this.imgArray 	= imgs.split("||");
				this.maxCount	= this.imgArray.length;
				//preload the image
				this.loadImage();
								
			}.bind(this)
		});
	},
	loadImage: function(){
		
		var imgPreloader = new Image();
		this.currentImage = (this.currentImage == this.maxCount) ? 0 : this.currentImage;
		
		
        imgPreloader.onload = (function(){				
			if(this.first == true){				
				this.currentImage++;
				this.insertImage(imgPreloader);
				this.first = false;
			}else{
				
				this.createInterval(imgPreloader);
			}
       }).bind(this);

       imgPreloader.src = this.imgArray[this.currentImage];	

	this.loadingimg = imgPreloader;

	},
	insertImage: function(imgPreloader){
		var image = '<img src='+imgPreloader.src+' />';
		if(this.insertIn == $('impression') ){
			this.wrapper1.update(image).hide();
			this.fadeOut 	= this.wrapper2;
			this.fadeIn 	= this.wrapper1;
			this.insertIn	= this.wrapper2;
			
			this.activeWrapper = $('impression');
		}else{
			this.wrapper2.update(image).hide();
			this.fadeOut 	= this.wrapper1;
			this.fadeIn 	= this.wrapper2;
			this.insertIn	= this.wrapper1;
			
			this.activeWrapper = $('impression2');
		}
		
		// set size to fit window
		this.resizenow();
		// crossfade images
		this.crossFade();
	},
	crossFade: function(){

		new Effect.Parallel([
			new Effect.Fade(this.fadeOut, { sync: true}), 
			new Effect.Appear(this.fadeIn, { sync: true}) 
		],{ 
			duration: 2.0,
			afterFinish: function(){
				this.loadImage();
				
				//this.createInterval();
			}.bind(this)
		});
		
	},
	createInterval: function(imgPreloader){	
			
		this.timer 	= setTimeout(function(){
			clearInterval(this.timer);
			this.timer = null;
			
			this.currentImage++;
			this.insertImage(imgPreloader);
			
		}.bind(this),this.intervalTime*2.5);
		
	}
});
