// JavaScript Document

// 实现flash效果的可选的百叶窗图片链接

/*
 * 一般的调用方法有两种：
 *   (1) 直接在需要显示的区域中调用的方式：
 *          MyImg.disp(img, imglink, imgalt, w, h, time);
 *   (2) 控制某个元素（如div，其id为"divId"）的内部HTML实现方法的调用方式：
 *          MyImg.disp(img, imglink, imgalt, w, h, time, 'divId');
 * 参数说明：
 *   img :     图像路径 数组，如：['images/1.jpg','images/2.jpg','images/3.jpg']
 *   imglink : 目标链接 数组，如：['http://www.baidu.com','index.html','images/3.jpg']
 *   imgalt :  图像说明 数组，如：['百度一下，你就知道','首页','大图']
 *   w :       该图像区域的宽，单位：像素，如：400 （默认值：400）
 *   h :       该图像区域的高，单位：像素，如：300 （默认值：300）
 *   time :    图像切换的时间间隔，单位：毫秒，如：5000 （默认值：5000，即5秒）
 *
 * 适用浏览器： IE6/7 , Firefox3（在Firefox下不呈现百叶窗效果，但仍可以自动切换）
 *
 * ********************
 * **  Author : lzf  **
 * ********************
 *
 *   Version : 1.1
 */
var MyImg = {
	
	img : [],
	imglink : [],
	imgalt : [],
	
	num : 1,
	 
	
	$ : function(id) {
		return document.getElementById(id);
	},
	init : function(img, imglink, imgalt, time) {
		this.img = img;
		this.imglink = '#';
		this.imgalt = imgalt;
		if(time && time != 0 && time != '0') this.time = time;
	},
	show : function(idx) {
		if(document.all) {
			myimgRotator.filters.revealTrans.Transition = Math.floor(Math.random() * 20);
			myimgRotator.filters.revealTrans.apply();
		}
		document.images.myimgRotator.src = this.img[idx];
		document.images.myimgRotator.alt = this.imgalt[idx];
		if(document.all) myimgRotator.filters.revealTrans.play();
		for(var i=0;i<this.img.length;i++) {
			var o = this.$('myimg_a_' + i);
			if(i == idx) {
				o.style.backgroundColor = 'red';
				o.innerHTML = '&nbsp;<font color=#ffffff>' + (i+1) + '</font>&nbsp;';
			} else {
				o.style.backgroundColor = '';
				o.innerHTML = '&nbsp;' + (i+1) + '&nbsp;';
			}
		}
		 
	},
	next : function() {
		this.num++;
		if(this.num >= this.img.length) this.num = 0;
		this.show(this.num);
		setTimeout("MyImg.next()", this.time);
	},
	slct : function(idx) {
		this.num = idx - 1;
		var tmp = this.time;
		this.time = 1000000;
		this.show(idx);
		this.time = tmp;
	},
	linkURL : function() {
		var url = (this.imglink && this.imglink[this.num]) ? this.imglink[this.num] : this.img[this.num];
		window.open(url);
	},
	getHTML : function(img, imglink, imgalt, w, h, time) {
		this.init(img, imglink, imgalt, time);
		w = (w) ? w : 400;
		h = (h) ? h : 300;
		var aa = '';
		for(var i=0;i<this.img.length;i++) {
			aa += '<a id=myimg_a_' + i + ' onclick="MyImg.slct(' + i + ');" style="color:#000;cursor:pointer;" title="' + this.imgalt[i] + '">&nbsp;' + (i+1) + '&nbsp;</a>';
		}
		return '<table boder=0 width=' + w + ' height=' + h + '><tr><td><img style="FILTER:revealTrans(duration=2,transition=20,border:1px solid #000000" src="' + this.img[0] + '" width=' + w + ' height=' + h + ' border=0 name="myimgRotator" alt=""><div style="font-size:13px;"><table border=0 width=' + w + ' bgcolor="#FFFFFF" style="display:none"><tr><td width=50%><div id=myimgalt></div></td><td width=50% align=right>' + aa + '</td></tr></table></div></td></tr></table>';
	},
	
	// ************** 通用调用函数 ******************
	disp : function(img, imglink, imgalt, w, h, time, id) {
		var html = this.getHTML(img, imglink, imgalt, w, h, time);
		if(id) this.$(id).innerHTML = html;
		else document.write(html);
		this.next();
	}
};