var Class = {
  create: function() {
    return function() {
      this.initialize.apply(this, arguments);
    }
  }
}

var LabelImage = Class.create();
LabelImage.prototype = {
	imageSrc : "",
	clickImageSrc : "",
	overImageSrc : "",
	outImageSrc : "",
	visible : false,
	initialize: function() {
	},
	setVisible: function(status) {
		this.visible = status;
	},
	getOverName: function(status) {
		if(this.visible) {
			return this.clickImageSrc;
		} else {
			return this.overImageSrc;
		}
	},
	getOutName: function(status) {
		if(this.visible) {
			return this.clickImageSrc;
		} else {
			return this.outImageSrc;
		}
	},
	getClickName: function(status) {
		if(this.visible) {
			return this.clickImageSrc;
		} else {
			return this.imageSrc;
		}
	}
}


var LabelSwitch = Class.create();
LabelSwitch.prototype = {
	
	initialize: function() {
		this.currentPicture = 0;
		this.timer1 = null;
		this.timer2 = null;
		this.opacity = 100;
		this.imgs = new Array();
		this.msDivs = new Array();
		this.msButtons = new Array();
		//霧化效果使用
		this.msWrap = null;
	},
	add: function(json) {
		var button = document.getElementById(json.imageButtonID);
		var label = document.getElementById(json.labelID);
		var labelImage = new LabelImage(json);
		var thisObj = this;
		if(json.imageSrc) {
			labelImage.imageSrc = json.imageSrc;
			Browser.attachEventListener(button, 'click', function(event) { thisObj.doNumber(event); }, false);
		}
		if(json.clickImageSrc) {
			labelImage.clickImageSrc = json.clickImageSrc;
		}
		if(json.overImageSrc) {
			labelImage.overImageSrc = json.overImageSrc;
			Browser.attachEventListener(button, 'mouseover', function(event) { thisObj.mouseOver(event); }, false);
		}
		if(json.outImageSrc) {
			labelImage.outImageSrc = json.outImageSrc;
			Browser.attachEventListener(button, 'mouseout', function(event) { thisObj.mouseOut(event); }, false);
		}
		this.imgs[this.imgs.length] = labelImage;
		this.msButtons[this.msButtons.length] = button;
		this.msDivs[this.msDivs.length] = label;
	},
	run: function(json) {
		if(json && json.fade) {
			var thisObj = this;
			this.timer1 = setTimeout(function () { thisObj.interval(); },3000);
		}
		
	},
	interval: function() {
		if (this.currentPicture < (this.msDivs.length-1)){
			this.currentPicture++;
			var thisObj = this;
			this.timer1 = setTimeout(function () { thisObj.interval(); },3000);
			this.change(this.currentPicture, 1);
		}else{
			this.currentPicture=0;
			clearTimeout(this.timer1);
			this.change(this.currentPicture,1);
		}
	},
	change: function(num, step) {
		if (step == 1) {
			this.opacity -= 10;
			if (this.opacity > 0) {
				this.fader(this.opacity);
				var thisObj = this;
				this.timer2 = setTimeout(function () { thisObj.change(num, 1); },50);
			} else {
				this.change(num, 2);
			}
		} else if (step == 2) {
			this.currentPicture = num;
			for(i=0;i<this.msDivs.length;i++) {
				if(num == i) {
					this.msDivs[i].style.display = "block";
					this.imgs[i].setVisible(true);
				} else {
					this.msDivs[i].style.display = "none";
					this.imgs[i].setVisible(false);
				}
				this.msButtons[i].src = this.imgs[i].getClickName();
			}
			
			this.change(num, 3);
		} else if (step == 3) {
			this.opacity += 10;
			if (this.opacity <= 100) {
				this.fader(this.opacity);
				var thisObj = this;
				this.timer2 = setTimeout(function () { thisObj.change(num, 3); },50);
			}
		}
	},
	fader: function(opac) {
		
		if (this.msWrap.style.MozOpacity!=null) {
			/* Mozilla's pre-CSS3 proprietary rule */
			this.msWrap.style.MozOpacity = (opac/100) - .001;
		} else if (this.msWrap.style.opac!=null) {
			/* CSS3 compatible */
			this.msWrap.style.opacity = (opac/100) - .001;
		} else if (this.msWrap.style.filter!=null) {
			
			/* IE's proprietary filter */
			if (this.opac==100){
				this.msWrap.style.filter = "none;";
			} else {
				this.msWrap.style.filter = "alpha(opacity="+opac+");";
			}
		}
	},
	mouseOut: function(event) {
		//動作沒有this的指向
		var eventSource;
		if(typeof event.target != 'undefined') {
			eventSource = event.target;
		} else {
			eventSource = window.event.srcElement;
		}
		var pic = eventSource.id;
		pic = eventSource.id.substring(pic.length-1,pic.length);
		eventSource.src = this.imgs[pic-1].getOutName();
	},
	mouseOver: function(event) {
		//動作沒有this的指向
		var eventSource;
		if(typeof event.target != 'undefined') {
			eventSource = event.target;
		} else {
			eventSource = window.event.srcElement;
		}
		var pic = eventSource.id;
		pic = eventSource.id.substring(pic.length-1,pic.length);
		eventSource.src = this.imgs[pic-1].getOverName();
	},
	doNumber: function(event) {
		
		//動作沒有this的指向
		var eventSource;
		if(typeof event.target != 'undefined') {
			eventSource = event.target;
		} else {
			eventSource = window.event.srcElement;
		}
		var pic = eventSource.id;
		pic = eventSource.id.substring(pic.length-1,pic.length);
		this.currentPicture = pic - 1;
		clearTimeout(this.timer1);
		clearTimeout(this.timer2);
		this.change(this.currentPicture, 1);
	},
	empty: function() {

	}
};