// ----------------------- 循环显示信息记录的类 -------------------
/* 调用方法:
   首先包含这个文件: <script type="text/javascript" language="javascript" src="javascript/LoopInfo.js"></script>
   <script type="text/javascript" language="javascript">
   var 变量名称 = new LoopInfo();

   变量名称.属性 = 值
   重复上面的语句设置需要的属性值(属性可以参考下面的说明)

   变量名称.Add(图片地址, ...)
   重复上面的语句添加多个图片

   变量名称.Show()
*/

/* 定义一个循环显示信息的类
   如果应用转换效果的元素是 div 或 span, 其 style 属性必须包含 height, width 或者 position(absolute or relative) 之一
*/
function LoopInfo()
{
	this.Image = null;			// 图片元素的 id
	this.ImageWidth = null;		// 图片的宽度
	this.ImageHeight = null;	// 图片的高度
	this.Title = null;			// 标题元素的 id (可选)
	this.Link = null;			// 连接元素的 id 或者 name (可选)
	this.Content = null;		// 文本元素的 id 或者 name (可选)
	this.Navigator = null		// 包含导航按钮的元素 id, 此元素下应该只包含导航按钮, 否则会出错
	this.NavMouseOverShow = true		// 鼠标悬停时切换导航, 否则 Click 切换
	this.Interval = 6000;		// 两幅图片转化间隔的时间(毫秒), 默认为 6000, 小于等于 0 表示不自动转换 (可选)
	this.TransTime = 1;			// 转换图片使用的时间(秒), 默认为 1 (可选) - 此时间包含在 Interval 中
	this.TransType = null;		// 转换图片方式的名称, 详细资料请查阅相关资料, 默认随机转换, 空字符串表示不应用转换效果 (可选)
	this.TransParam = null;		// 指定转换方式时, 附加的转换参数. 参数格式: 属性名称1=属性值1,属性名称2=属性值2, ... (可选)
	this.ShowIndex = false;		// 是否显示索引按钮
	this.ShowIndexTitle = false;// 是否显示索引按钮的 title
	this.MouseOverStop = true;	// 鼠标悬停在图片上时是否停止循环显示
	this.ImageTransEffect = true;	// Image 元素是否应用转换效果
	this.TitleTransEffect = true;	// Title 元素是否应用转换效果
	this.ContentTransEffect = true;	// Content 元素是否应用转换效果

	// 导航栏默认 class
	this.NavigatorNormalClass = "";
	this.NavigatorHighlightClass = "";
	this.NavigatorSelectedClass = "";

	// 索引栏风格
	this.IndexWidth = "20px";
	this.IndexHeight = "15px";
	this.IndexColor = "#fff";
	this.IndexBackgroundColor = "#000";
	this.IndexHightlightColor = "#fff";
	this.IndexHighlightBackgroundColor = "#FF840C";
	this.IndexSeparator = "1px #fff solid";
	this.IndexFont = "bold 11px sans-serif";
	this.IndexOpacity = 50;

	this.lastIndex = 0;
	this.infoCount = 0;
	this.loopInfoTimer = null;
	this.ie = document.all ? true : false;
	this.images = new Array();	// 储存图片地址的数组
	this.titles = new Array();	// 储存图片标题的数组
	this.links = new Array();	// 储存图片链接地址的数组
	this.contents = new Array();// 储存文本信息的数组
	this.navNormalClasses = new Array();	//储存栏目正常时的 class
	this.navHighlightClasses = new Array();	//储存栏目高亮时的 class
	this.navSelectedClasses = new Array();	//储存栏目被选时的 class
	this.cacheImages = null;	// 缓存图像
}

/*
 添加一条记录
 imgSrc -> 图片地址
 title -> 图片标题 (可选)
 href -> 标题连接地址, 空字符串或忽略表示没有链接 (可选)
 contentText -> 文本信息
 navNormalClass -> 当前项对应的导航栏目的正常 class
 navHighlightClass -> 当前项对应的导航栏目的高亮 class
 navSelectedClass -> 当前项对应的导航栏目被选时的 class, 忽略则取 navHighlightClass
*/
LoopInfo.prototype.Add = function(imgSrc, titleHtml, href, contentHtml, navNormalClass, navHighlightClass, navSelectedClass)
{
	if (typeof(imgSrc) == "undefined") var imgSrc = "";
	if (typeof(titleHtml) == "undefined") var titleHtml = "";
	if (typeof(href) == "undefined") var href = "";
	if (typeof(contentHtml) == "undefined") var contentHtml = "";
	if (typeof(navNormalClass) == "undefined") var navNormalClass = "";
	if (typeof(navHighlightClass) == "undefined") var navHighlightClass = "";
	if (typeof(navSelectedClass) == "undefined") var navSelectedClass = navHighlightClass;
	with(this)
	{
		images[infoCount] = imgSrc;
		titles[infoCount] = titleHtml;
		links[infoCount] = href;
		contents[infoCount] = contentHtml;
		navNormalClasses[infoCount] = navNormalClass;
		navHighlightClasses[infoCount] = navHighlightClass;
		navSelectedClasses[infoCount] = navSelectedClass;
		infoCount++;
	}
}


/*
 随机取出 v1 到 v2 之间(包括 v1 和 v2)的一个整数
 v1 -> 正整数
 v2 -> 正整数, 可省略, 默认为 0
 */
LoopInfo.prototype._Random = function(v1, v2)
{
	var ok = true;
	if (arguments.length == 1)
		if (typeof(v1) != "number" || v1 < 0) ok = false;
	else if (arguments.length == 2)
		if (typeof(v1) != "number" || v1 < 0 || typeof(v2) != "number" || v2 < 0) ok = false;
	else
		ok = false
	if (!ok)
	{
		alert("_Random 函数需要一个或两个正整数参数");
		return false;
	}
	if (arguments.length == 1)
	{
		var v2 = v1;
		v1 = 0;
	}
	else
	{
		var temp = Math.max(v1, v2);
		v1 = Math.min(v1, v2);
		v2 = temp;
	}
	return Math.floor(Math.random() * (Math.floor(v2 - v1) + 1)) + v1;
}

/*
 预先载入图象文件
*/
LoopInfo.prototype._PreLoadImages = function()
{
	this.cacheImages = new Array();
	for (i = 0; i < this.infoCount; i++)
	{
		this.cacheImages[i] = new Image();
		this.cacheImages[i].src = this.images[i];
	}
}

/*
 停止循环显示
*/
LoopInfo.prototype._StopShow = function()
{
	clearTimeout(this.loopInfoTimer);
}

/*
 显示指定索引的下一条信息
*/
LoopInfo.prototype._ShowNext = function(index)
{
	if (this.Interval > 0)
	{
		var tmpLoopInfo = this;
		this.loopInfoTimer = setTimeout(function(){tmpLoopInfo._Show(index + 1); tmpLoopInfo = null;}, this.Interval);
	}
}


/*
 显示指定索引信息记录
 index -> 被显示信息记录的索引值 (可选参数)
*/
LoopInfo.prototype.Show = function(index)
{
	var tmpLoopInfo = this;
	with(this)
	{
		// 图像
		if (Image)
		{
			var eImage = document.getElementById(Image);
			if (eImage)
			{
				_PreLoadImages();

				if (MouseOverStop)
				{
					if (ie)
					{
						eImage.attachEvent("onmouseover", function() {tmpLoopInfo._StopShow();});
						eImage.attachEvent("onmouseout", function() {tmpLoopInfo._ShowNext(tmpLoopInfo.lastIndex);});
					}
					else
					{
						eImage.addEventListener("mouseover", function() {tmpLoopInfo._StopShow();}, true);
						eImage.addEventListener("mouseout", function() {tmpLoopInfo._ShowNext(tmpLoopInfo.lastIndex);}, true);
					}
				}

				// 显示索引栏
				if (ShowIndex)
				{
					var eImageParent = eImage.parentNode;
					// 实现索引按钮, 图象必须用 style 指定容器的高度.
					var width = eImage.style.width;
					var height = eImage.style.height;
					if (width =="" || height == "")
					{
						alert("要显示索引按钮, 必须用 style 指定 图象 的宽度和高度.");
						return false;
					}

					var eContainer = document.createElement('<span style="width:' + width + '; height:' + height + '; overflow:hidden;">');
					var eIndex = document.createElement('<span style="float:right; position:relative; height:' + IndexHeight + '; top:-' + IndexHeight + ';">');
					for (var i = infoCount - 1; i >= 0; i--)
					{
						var spanHtml =  '<span style="float:right; height:' + IndexHeight + '; width:' + IndexWidth +
										'; text-align:center; font:' + IndexFont +
										'; color: ' + IndexColor + '; background-color:' + IndexBackgroundColor +
										'; border-left:' + IndexSeparator + '; overflow:hidden; cursor: hand' +
										'; FILTER:ALPHA(opacity=' + IndexOpacity + ');"' +
										(ShowIndexTitle && titles[i] ? ' title="' + titles[i] + '"' : "") +
										' onmouseover="this.setAttribute(\'indexIsMouseOver\', 1); if (!this.getAttribute(\'LoopInfoIsCurrent\')) {this.style.color=\'' + IndexHightlightColor + '\'; this.style.backgroundColor=\'' + IndexHighlightBackgroundColor + '\';}"' +
										' onmouseout="this.setAttribute(\'indexIsMouseOver\', \'\'); if (!this.getAttribute(\'LoopInfoIsCurrent\')) {this.style.color=\'' + IndexColor + '\'; this.style.backgroundColor=\'' + IndexBackgroundColor + '\';}">';
						var eSpan = document.createElement(spanHtml);
						if (ie)
							eval( 'eSpan.attachEvent("onclick", function() {tmpLoopInfo._Show(' + i + ');});' );
						else
							eval('eSpan.addEventListener("click", function() {tmpLoopInfo._Show(' + i + ');}, true);');
						eSpan.innerText = i + 1;
						eIndex.appendChild(eSpan);
					}

					eImage = eImageParent.removeChild(eImage);
					eImageParent.appendChild(eContainer);
					eContainer.appendChild(eImage);
					eContainer.appendChild(eIndex);
				}
			}
		}

		// 导航栏
		if (Navigator)
		{
			var eNavsParent = document.getElementById(Navigator);
			if (eNavsParent)
			{
				var eChildNodes = eNavsParent.childNodes;
				var eNavs = new Array();
				for (var i = 0, ilen = eChildNodes.length; i < ilen; i++)
					if (eChildNodes[i].nodeType == 1) eNavs[eNavs.length] = eChildNodes[i];
				if (eNavs.length == 0) eNavs = null;
			}
			if (eNavs)
			{
				for (var i = 0, ilen = eNavs.length; i < ilen; i++)
				{
					if (!navNormalClasses[i]) navNormalClasses[i] = NavigatorNormalClass;
					if (!navHighlightClasses[i]) navHighlightClasses[i] = NavigatorHighlightClass;
					if (!navSelectedClasses[i]) navSelectedClasses[i] = navHighlightClasses[i];
					if (ie)
					{
						eval('eNavs[i].attachEvent("onmouseover", function(){ var e = eNavs[' + i + ']; e.setAttribute(\'navIsMouseOver\', 1); if (!e.getAttribute(\'LoopInfoIsCurrent\')) {e.className = "' + navHighlightClasses[i] + '"; if (tmpLoopInfo.NavMouseOverShow) {tmpLoopInfo._Show(' + i + ');}} });');
						eval('eNavs[i].attachEvent("onmouseout", function(){ var e = eNavs[' + i + ']; e.setAttribute(\'navIsMouseOver\', \'\'); if (!e.getAttribute(\'LoopInfoIsCurrent\')) {e.className = "' + navNormalClasses[i] + '";} });');
						if (!NavMouseOverShow) eval('eNavs[i].attachEvent("onclick", function(){ tmpLoopInfo._Show(' + i + '); });');
					}
					else
					{
						eval('eNavs[i].addEventListener("mouseover", function(){ var e = eNavs[' + i + ']; e.setAttribute(\'navIsMouseOver\', 1); if (!e.getAttribute(\'LoopInfoIsCurrent\')) {e.className = "' + navHighlightClasses[i] + '"; if (tmpLoopInfo.NavMouseOverShow) {tmpLoopInfo._Show(' + i + ');}} }, true);');
						eval('eNavs[i].addEventListener("mouseout", function(){var e = eNavs[' + i + ']; e.setAttribute(\'navIsMouseOver\', \'\'); if (!e.getAttribute(\'LoopInfoIsCurrent\')) {e.className = "' + navNormalClasses[i] + '";} }, true);');
						if (!NavMouseOverShow) eval('eNavs[i].addEventListener("click", function(){ tmpLoopInfo._Show(' + i + '); }, true);');
					}
				}
			}
		}

		// 标题栏
		if (Title)
		{
			var eTitle = document.getElementById(Title);
			if (eTitle)
			{
				if (MouseOverStop)
				{
					if (ie)
					{
						eTitle.attachEvent("onmouseover", function() {tmpLoopInfo._StopShow();});
						eTitle.attachEvent("onmouseout", function() {tmpLoopInfo._ShowNext(tmpLoopInfo.lastIndex);});
					}
					else
					{
						eTitle.addEventListener("mouseover", function() {tmpLoopInfo._StopShow();}, true);
						eTitle.addEventListener("mouseout", function() {tmpLoopInfo._ShowNext(tmpLoopInfo.lastIndex);}, true);
					}
				}
			}
		}

		// 内容栏
		if (Content)
		{
			var eContent = document.getElementById(Content);
			if (eContent)
			{
				if (MouseOverStop)
				{
					if (ie)
					{
						eContent.attachEvent("onmouseover", function() {tmpLoopInfo._StopShow();});
						eContent.attachEvent("onmouseout", function() {tmpLoopInfo._ShowNext(tmpLoopInfo.lastIndex);});
					}
					else
					{
						eContent.addEventListener("mouseover", function() {tmpLoopInfo._StopShow();}, true);
						eContent.addEventListener("mouseout", function() {tmpLoopInfo._ShowNext(tmpLoopInfo.lastIndex);}, true);
					}
				}
			}
		}

		_Show();
	}	// end with(this)
}

LoopInfo.prototype._Show = function(index)
{
	with(this)
	{
		clearTimeout(loopInfoTimer);
		var eNavsParent = document.getElementById(Navigator);
		if (eNavsParent)
		{
			var eChildNodes = eNavsParent.childNodes;
			var eNavs = new Array();
			for (var i = 0, ilen = eChildNodes.length; i < ilen; i++)
				if (eChildNodes[i].nodeType == 1) eNavs[eNavs.length] = eChildNodes[i];
			if (eNavs.length == 0) eNavs = null;
		}
		var eImage = document.getElementById(Image);
		var eTitle = document.getElementById(Title);
		var eContent = document.getElementById(Content);
		var eLink = document.getElementsByName(Link);
		if (!eLink) eLink[0] = document.getElementById(Link);
		if (eImage && ShowIndex) var eIndex = eImage.nextSibling;
		if (typeof(index) == "undefined" || index >= infoCount) var index = 0;

		if (ie && TransType != "")
		{
			var type = TransType;
			var params = TransParam;
			var filterStr = "Barn|BlendTrans|Blinds|CheckerBoard|Fade|GradientWipe|Inset|Iris|" +
							"Pixelate|RadialWipe|RandomBars|RandomDissolve|RevealTrans|" +
							"Slide|Spiral|Stretch|Strips|Wheel|Zigzag";	// 有效的滤镜
			// 检查转换滤镜名称是否有效, 名称无效则随机选取一种, 并忽略 TransParam 参数
			if (filterStr.indexOf(type) == -1)
			{
				var filters = filterStr.split("|");
				type = new Array();
				for (var i = 0; i < filters.length; i++)
					type[type.length] = filters[i];
				// 添加 "RevealTrans" 转换效果的几率
				//for (var i = 0; i < 22; i++) type[type.length] = "RevealTrans";
				// 随机选择一个转换效果
				type = type[_Random(type.length - 1)];
			}
			// 名称有效, 取得转换参数
			else
			{
				if (typeof(TransParam) == "string")
				{
					params = {};
					var temp = TransParam.split(",");
					for (var i = 0; i < temp.length; i++)
					{
						var tmp = temp[i].split("=");
						if (tmp.length != 2)
						{
							alert("转换滤镜的参数不正确");
							return false;
						}
						params[tmp[0].substr(0, 1).toUpperCase() + tmp[0].substr(1).toLowerCase()] = isNaN(parseInt(tmp[1])) ? tmp[1] : parseInt(tmp[1]);
					}
				}
				// 储存参数, 以便下次直接使用
				TransParam = params;
			}
			var enabled = type != "Pixelate" ? "true" : "false";	// Pixelate 滤镜必须先把 enabled 属性设为 false
			var typeName = type != "BlendTrans" && type != "RevealTrans" ? "DXImageTransform.Microsoft." + type : type;

			// 如果没有指明转换参数, 则设置每种滤镜的默认转换参数
			if (params == null)
			{
				params = {};
				switch (type)
				{
					case "Barn" :
						params.Motion = _Random(1) == 0 ? "in" : "out";	// 从外显示还是从内显示
						params.Orientation = _Random(1) == 0 ? "vertical" : "horizontal";	// 横向显示还是纵向显示
						break;
					case "Blinds" :
						params.Bands = _Random(1, 20);	// 百叶窗的窗格条数, 最大 100
						var direction = ["down", "up", "right", "left"];
						params.Direction = direction[_Random(direction.length - 1)];	// 百叶窗开关的方向
						break;
					case "CheckerBoard" :
						params.SquaresX = _Random(2, 24);	// 横向条数, 大于等于 2
						params.SquaresY = _Random(2, 20);	// 纵向条数, 大于等于 2
						var direction = ["down", "up", "right", "left"];
						params.Direction = direction[_Random(direction.length - 1)];	// 网格推拉的方向
						break;
					case "Fade" :
						params.Overlap = _Random(10) / 10;	// 转换进程中源内容和目标内容都被显示的比例, 0 - 1.0
						break;
					case "GradientWipe" :
						params.GradientSize = _Random(10) / 10;	// 图像内容被梯度渐隐条覆盖的百分比, 0 - 1.0
						params.Motion = _Random(1) ? "forward" : "reverse";	// 图像出现方向是依据 WipeStyle 特性的设定, 还是取反
						params.WipeStyle = _Random(1);	// 渐隐滚动条的方向
						break;
					case "Iris" :
						var style = ["PLUS", "DIAMOND", "CIRCLE", "CROSS", "SQUARE", "STAR"];
						params.IrisStyle = style[_Random(style.length - 1)];	// 剪切轮廓的外形
						params.Motion = _Random(1) == 0 ? "in" : "out";	// 从外显示还是从内显示
						break;
					case "Pixelate" :
						params.MaxSquare = _Random(2, 50);	// 矩形色块的最大宽度, 2 - 50
						break;
					case "RadialWipe" :
						var style = ["CLOCK", "WEDGE", "RADIAL"];
						params.WipeStyle = style[_Random(style.length - 1)];	// 擦除方式
						break;
					case "_RandomBars" :
						params.Orientation = _Random(1) == 0 ? "vertical" : "horizontal";	// 横向显示还是纵向显示
						break;
					case "RevealTrans" :
						params.Transition = 23;	// 随机显示
						break;
					case "Slide" :
						params.Bands = _Random(1, 100);	// 多少滑条被抽离
						var style = ["HIDE", "PUSH", "SWAP"];
						params.SlideStyle = style[_Random(style.length - 1)];	// 滑条抽离效果的方式
						break;
					case "Spiral" :
						params.GridSizeX = _Random(1, 32);	// 横向盘旋次数
						params.GridSizeY = _Random(1, 32);	// 纵向盘旋次数
						break;
					case "Stretch" :
						var style = ["SPIN", "HIDE", "PUSH"];
						params.StretchStyle = style[_Random(style.length - 1)];	// 拉伸变形转换的方式
						break;
					case "Strips" :
						var motion = ["leftdown", "leftup", "rightdown", "rightup"];
						params.Motion = motion[_Random(motion.length - 1)];	// 换新内容从哪一个角开始
						break;
					case "Wheel" :
						params.Spokes = _Random(2, 20);	// 风车叶轮数目
						break;
					case "Zigzag" :
						params.GridSizeX = _Random(1, 32);	// 横向盘旋次数
						params.GridSizeY = _Random(1, 32);	// 纵向盘旋次数
						break;
				}
			}
		}

		// 改变图象
		if (eImage)
		{
			if (ImageWidth != null) eImage.style.width = ImageWidth;
			if (ImageHeight != null) eImage.style.height = ImageHeight;

			if (ImageTransEffect && TransType != "" && ie)
			{
				// 为图片添加没有的转换滤镜
				if (!eImage.filters[typeName])
					eImage.style.filter += (type != "BlendTrans" && type != "RevealTrans" ? " progid:" : " ") + typeName + "(enabled=" + enabled + ")";

				// 设置转换时间
				eImage.filters[typeName].duration = TransTime;

				// 设置滤镜参数
				for (param in params)
					eval("eImage.filters[typeName]." + param + " = params[param];");
				// 应用滤镜
				eImage.filters[typeName].apply();
			}
			eImage.src = images[index];
		}

		// 改变标题
		if (eTitle)
		{
			if (TitleTransEffect && TransType != "" && ie)
			{
				// 为标题添加没有的转换滤镜
				if (!eTitle.filters[typeName])
					eTitle.style.filter += (type != "BlendTrans" && type != "RevealTrans" ? " progid:" : " ") + typeName + "(enabled=" + enabled + ")";

				// 设置转换时间
				eTitle.filters[typeName].duration = TransTime;

				// 设置滤镜参数
				for (param in params)
					eval("eTitle.filters[typeName]." + param + " = params[param];");
				// 应用滤镜
				eTitle.filters[typeName].apply();
			}
			eTitle.innerHTML = titles[index];
		}

		// 改变连接地址
		if (eLink)
		{
			for (var i = 0; i < eLink.length; i++)
			{
				if (links[index])
				{
					eLink[i].onclick = function(){};
					eLink[i].href = links[index];
				}
				else
				{
					eLink[i].onclick = function(){return false;};
					eLink[i].href = "#";
				}
			}
		}

		// 改变内容
		if (eContent)
		{
			if (ContentTransEffect && TransType != "" && ie)
			{
				// 为标题添加没有的转换滤镜
				if (!eContent.filters[typeName])
					eContent.style.filter += (type != "BlendTrans" && type != "RevealTrans" ? " progid:" : " ") + typeName + "(enabled=" + enabled + ")";

				// 设置转换时间
				eContent.filters[typeName].duration = TransTime;

				// 设置滤镜参数
				for (param in params)
					eval("eContent.filters[typeName]." + param + " = params[param];");
				// 应用滤镜
				eContent.filters[typeName].apply();
			}
			eContent.innerHTML = contents[index];
		}

		// 改变导航栏 class
		if (eNavs)
		{
			var curNav = eNavs[index];
			var lastNav = eNavs[lastIndex];
			if (lastNav.getAttribute("navIsMouseOver"))
				lastNav.className = navHighlightClasses[lastIndex];
			else
				lastNav.className = navNormalClasses[lastIndex];
			curNav.className = navSelectedClasses[index];
			lastNav.setAttribute("LoopInfoIsCurrent", "");
			curNav.setAttribute("LoopInfoIsCurrent", 1);
		}

		// 开始转换
		if (ie)
		{
			if (eIndex)
			{
				var indexButtons = eIndex.childNodes;
				var lastIndexButton = indexButtons[infoCount - 1 - lastIndex];
				var curIndexButton = indexButtons[infoCount - 1 - index];
				if (!lastIndexButton.getAttribute("indexIsMouseOver"))
				{
					lastIndexButton.style.color = IndexColor;
					lastIndexButton.style.backgroundColor = IndexBackgroundColor;
				}
				curIndexButton.style.color = IndexHightlightColor;
				curIndexButton.style.backgroundColor = IndexHighlightBackgroundColor;
				lastIndexButton.setAttribute("LoopInfoIsCurrent", "");
				curIndexButton.setAttribute("LoopInfoIsCurrent", 1);
			}
			if (eImage && ImageTransEffect && TransType != "") eImage.filters[typeName].play();
			if (eTitle && TitleTransEffect && TransType != "") eTitle.filters[typeName].play();
			if (eContent && ContentTransEffect && TransType != "") eContent.filters[typeName].play();
		}

		lastIndex = index;

		_ShowNext(index);
	}	// end with(this)
}
