var ImageRotate = {
	init: function() {
	
		this.images = this.images.map(function(img) {
			
			var a = $(img);
			a.himg.setOpacity = ImageRotate.setOpacity;
			Event.observe(a,'mouseover',ImageRotate.resetImgTimer.bind(ImageRotate));
			return a;
			
		});

		this.resetImgTimer();
		
		Event.observe(window,'load',this.rotateImages.bind(this));
	},
	setOpacity: function(val) {
	
		this.style.filter = "alpha(opacity=" + (val * 100) + ")";
		this.style['-moz-opacity'] = val;
		this.style['-khtml-opacity'] = val;
		this.style.opacity = val;
		
	},
	resetImgTimer: function() {
		if(this.imgTimer)
			this.imgTimer.stop();
		
		if(this.imgRot)
			this.imgRot.stop();
		
		this.hideImageAtIndex(this.curIndex-1);
		
		this.curIndex = 0;
			
		this.imgTimer = new PeriodicalExecuter(this.rotateImages.bind(this),60);
	},
	rotateImages: function() {
		this.imgRot = new PeriodicalExecuter(this.nextImageIter.bind(this),0.5);
	},
	positionImage: function(elem) {
		
		var imX = elem.offsetLeft + elem.offsetWidth / 2;
		var imY = elem.offsetTop + elem.offsetHeight / 2;
		
		elem.himg.style.top = (imY + elem.yoff - elem.himg.offsetHeight / 2) + 'px';
		elem.himg.style.left = (imX + elem.xoff - elem.himg.offsetWidth / 2) + 'px';
		
	},
	showImageAtIndex: function(index) {

		if(this.images[index]) {
		
			this.images[index].himg.setOpacity(0);
			this.images[index].himg.show();
			this.positionImage(this.images[index]);
			this.images[index].himg.setOpacity(1);
		}
	},
	hideImageAtIndex: function(index) {
		if(this.images[index] && !this.images[index].vis)
			this.images[index].himg.hide();
	},
	nextImageIter: function() {

		this.hideImageAtIndex(this.curIndex-1);
		this.showImageAtIndex(this.curIndex);
		
		this.curIndex++;
		
		if(this.curIndex > this.images.length) {
			this.curIndex = 0;
			this.imgRot.stop();
		}		
		
	},
	images: ['vancouver','honolulu','sydney','shanghai','newdelhi','moscow','cairo','paris','rio','toronto'],
	curIndex: 0

};


ImageRotate.init();