/************************************
 * gleaming div object.
 * ==================================
 * NOTE:
 * 	before create this object, 
 * 	you must set element style:
 * 	FILTER: alpha(opacity=100); in IE
 * 
 */
var gleam = function(el, cover){
	if(typeof el == 'string'){
		this.el = document.getElementById(el);
	}else{
		this.el = el;
	}
	
	// set cover
	if(cover && typeof cover == "string"){
		this.cover = document.getElementById(cover);
	}else if(cover && typeof cover != "undefined"){
		this.cover = cover;
	}else{
		this.cover = null;
	}
	
	this.frequency = 1;
	this.step = 10;
	/**
	 * This property make sure current show page on the top z-index
	 */
	this.currentOnTop = true;
}

gleam.prototype = {
	disapear : function(){
		this.showCover();
		var self = this;
		var step = this.step;
		var timer = window.setInterval(function(){
			if(self.display(-step)){
				window.clearInterval(timer);
				if(self.currentOnTop){
					self.el.style.zIndex="-1";
				}
				self.hiddeCover();
			}
		}, this.frequency);
	},
	
	show : function(){
		this.showCover();
		var self = this;
		var step = this.step;
		var timer = window.setInterval(function(){
			if(self.display(step)){
				window.clearInterval(timer);
				if(self.currentOnTop){
					self.el.style.zIndex="0";
				}
				self.hiddeCover();
			}
		}, this.frequency);
	},
	
	display : function(step){
		var isTransparent = false;
		var el = this.el;
		var opacity;
		if(el.filters){
			if(el.filters.alpha){
				opacity = el.filters.alpha.opacity;
			}else{
				opacity = step>0?0:100;
			}
			if( (opacity <= 0 && step < 0) || (opacity >= 100 && step > 0) ){
				isTransparent = true;
			}else{
				el.filters.alpha.opacity = opacity + step;
			}
		}else{
			opacity = parseFloat(el.style.MozOpacity);
			opacity = isNaN(opacity)?(step>0?0:1):opacity;
			if( (opacity <= 0 && step < 0) || (opacity >= 1 && step > 0) ){
				isTransparent = true;
			}else{
				el.style.MozOpacity=opacity + step/100;
			}
		}
		return isTransparent;
	},
	
	showCover : function(){
		if(this.cover){
			this.cover.style.display = "block";
		}
	},
	
	hiddeCover : function(){
		if(this.cover){
			this.cover.style.display = "none";
		}
	}
}

var gleamManager = function(idArr, cover){
	this.loop = 0;
	this.frequency = 5000;
	this.gleamNumber = 3;

	var gleamArr = [];
	for(var i = 0; i < idArr.length; i++){
		gleamArr[i] = new gleam(idArr[i], cover);
	}
	var gleamNumber = this.gleamNumber;
	var self = this;
	this.gleamTimer = window.setInterval(function(){
		var loop = self.loop;
		var index = loop;
		var dis = gleamArr[index];
		dis.disapear();
		
		var show;
		if(index+1 < idArr.length){
			show = gleamArr[index+1];
		}else{
			show = gleamArr[0];
		}
		self.loop = (loop+1>=idArr.length)?0:(loop+1);
		show.show();
	}, this.frequency);
}

gleamManager.prototype={
	stop : function(){
		window.clearInterval(this.gleamTimer);
	}
}