﻿// JavaScript Document
/*
	吉利汽车幻灯新闻控制JS
	作者:梦猫猫(追梦客)
	QQ:16991200
	MSN:flyingwork@hotmail.com
	如果需要自行修改，请保留以上信息
	article = {title:"title",link:"link",photo:"photo"}
	buttonBorder 是小图按钮的背景图片,用于当显示按钮时,设置它的状态
	小图按钮盒子左右2个 下有1个像素的填充,上有6个象素的填充
	小图的宽度高度是容器的五分之一,并在此基础上 宽减4,高减7
*/
	
	function MagicArticlePanel(container,width,height,interval,buttonBorder,autoplay)
	{
		this.__container__ = document.getElementById(container);
		this.__width__ = width;
		this.__height__ = height;
		this.__ButtonBorder__ = buttonBorder;
		this.MagicList = new Array();
		this.MagicButton = new Array();
		this.__Interval__ = interval;
		this.__autoPlay__ = true;
		if(this.__Interval__==null)
		{
			this.__Interval__ = 1000;
		}
		this.__IntervalId__ = null;
		this.__PlayIndex__=0;
		if(autoplay!=null)
		{
		    this.__autoPlay__ = autoplay;
		}		
		
		this.Filters = new Array();//幻灯类用到的滤镜，IE使用
//		this.Filters .push("BlendTrans(duration=2);");
//		this.Filters .push("progid:DXImageTransform.Microsoft.Blinds(direction='down');");
//		this.Filters .push("progid:DXImageTransform.Microsoft.Barn ( duration=1,motion=in,orientation=horizontal );");
//		this.Filters .push("progid:DXImageTransform.Microsoft.Inset ( duration=1 ) ;");
//		this.Filters .push("progid:DXImageTransform.Microsoft.Pixelate ( enabled=false,duration=1,maxSquare=5 ) ;");
//		this.Filters .push("progid:DXImageTransform.Microsoft.RandomBars ( duration=1,orientation=horizontal ) ;");
//		this.Filters .push("progid:DXImageTransform.Microsoft.Iris ( duration=2,irisStyle=DIAMOND,motion=out );");
//		this.Filters .push("progid:DXImageTransform.Microsoft.GradientWipe ( duration=2,gradientSize=0.5,motion=forward );");
//		this.Filters .push("progid:DXImageTransform.Microsoft.Spiral ( duration=1,gridSizeX=2,gridSizeY=16 );");
//		this.Filters .push("progid:DXImageTransform.Microsoft.GradientWipe ( duration=2,gradientSize=0.25,motion=forward ) ;");
//		this.Filters .push("progid:DXImageTransform.Microsoft.Stretch ( duration=1,stretchStyle=PUSH ) ;");
//		this.Filters .push("progid:DXImageTransform.Microsoft.RandomDissolve ( duration=1 ) ;");
		this.Filters .push("progid:DXImageTransform.Microsoft.revealTrans ( duration=1,transition=12 ) ;");
//		this.Filters .push("progid:DXImageTransform.Microsoft.Iris ( duration=1,irisStyle=CROSS,motion=in ) ;");
	}
	MagicArticlePanel.prototype.Add = function (article)
	{
		if(this.MagicList.length<5)
		{
			this.MagicList.push(article);
		}
	}
	MagicArticlePanel.prototype.Render = function ()
	{
		if(!this.__container__)
		{
			return;
		}
		if(this.MagicList.length==0)
		{
		    return;
		}
		//初始化舞台盒子
		this.__container__.style.textAlign="left";
		this.__container__.style.overflow="hidden";
		this.__container__.style.position="relative";
		this.__Stage__ = document.createElement("div");
		this.__Stage__.style.height=this.__height__;
		this.__Stage__.style.width=this.__width__;
		this.__Stage__.Control = this;
		this.__container__.appendChild(this.__Stage__);//创建添加舞台
		//创建图片按钮
		var _zindex = 10;
		var _this = this;
		var _smallImgSize = {width:_this.__width__/5,height:_this.__height__/5};
		for(var i=0;i<this.MagicList.length;i++)
		{
			var _box = document.createElement("a");
			_box.__article__ = this.MagicList[i];
			_box.target="_blank";
			_box.Control = this;
			this.MagicButton.push(_box);
			_box.href=this.MagicList[i].link;
//			_box.style.backgroundColor = "red";
			_box.style.position = "absolute";
			_box.style.top = (this.__height__-_smallImgSize.height)+"px";
			_box.style.left = (_smallImgSize.width*i-1)+"px";
			_box.style.width = (_smallImgSize.width-2)+"px";
			_box.style.height = (_smallImgSize.height-7)+"px";
			_box.style.padding = "6px 2px 1px 2px";
			_box.__PlayIndex__ = i;
			_box.style.zIndex =_zindex;
			_zindex+=1;
			var _img = document.createElement("img");
			_img.src = this.MagicList[i].photo;
			_img.style.border="none"
			_img.style.width = (_smallImgSize.width-2)+"px";
			_img.style.height = (_smallImgSize.height-7)+"px";
			_box.appendChild(_img);
			this.__container__.appendChild(_box);
			_box.onmouseover = function (evt)
			{
				var _event = evt?evt:event;
				this.Control.MouseOver(this,_event)
			}
			_box.onmouseout = function (evt)
			{
				var _event = evt?evt:event;
				this.Control.MouseOut(this,_event)
			}
		}
		this.MouseOver(this.MagicButton[0]);
		if(this.__autoPlay__)
		{
		    this.__IntervalId__ = window.setInterval(this.GetAutoPlayCommand(),this.__Interval__);
        }
	}	
	MagicArticlePanel.prototype.MouseOver = function (sender,evt)
	{
		if(this.__IntervalId__!=null)
		{
			window.clearInterval(this.__IntervalId__);
		}
		this.Transform(sender.__article__);
		for(var i=0;i<this.MagicButton.length;i++)
		{
			this.MagicButton[i].style.backgroundImage = "url()";
		}
		sender.style.backgroundImage = "url("+this.__ButtonBorder__+")";
		this.__PlayIndex__ = sender.__PlayIndex__+1;
		if(this.__PlayIndex__>=this.MagicList.length)
		{
		    this.__PlayIndex__ = 0;
		}
	}
	
	MagicArticlePanel.prototype.MouseOut = function  (sender,evt)
	{
	    if(this.__IntervalId__){
		    this.__IntervalId__ = window.setInterval(this.GetAutoPlayCommand(),this.__Interval__);
		}
	}
	//自动播放
	MagicArticlePanel.prototype.AutoPlay = function ()
	{
		var _article = this.MagicList[this.__PlayIndex__];
		this.Transform(_article);
		for(var i=0;i<this.MagicButton.length;i++)
		{
			this.MagicButton[i].style.backgroundImage = "url()";
		}
		this.MagicButton[this.__PlayIndex__].style.backgroundImage = "url("+this.__ButtonBorder__+")";
		this.__PlayIndex__+=1;
		if(this.__PlayIndex__ > this.MagicList.length-1)
		{
			this.__PlayIndex__ = 0;
		}
	}
	
		//自动播放
	MagicArticlePanel.prototype.Transform = function (article)
	{
		var _filterIndex=parseInt(Math.random()*this.Filters.length);
		if(_filterIndex>=this.Filters.length){
			_filterIndex = 0;
		}
		if(document.all){
		    try{
			    this.__Stage__.style.filter = this.Filters[_filterIndex];
			    this.__Stage__.filters[0].apply();
			    this.__Stage__.innerHTML = this.GetViewHtml(article);
			    this.__Stage__.filters[0].play();	
            }catch(ex){
                this.__Stage__.innerHTML = this.GetViewHtml(article);
            }
		}else{
			this.__Stage__.innerHTML = this.GetViewHtml(article);
		}
		
	}
	MagicArticlePanel.prototype.GetAutoPlayCommand = function ()
	{
//		alert(this)
		var _this = this;
		var _fun = function ()
		{
			_this.AutoPlay();
		}
		return _fun;
	}
	//生成视图
	MagicArticlePanel.prototype.GetViewHtml = function (article)
	{
		var _html = "<a href='"+article.link+"' target='_blank'>";
		_html += "<img style='border:0px;' src='"+article.photo+"' width='"+this.__width__+"' height='"+this.__height__+"' />";
		_html += "</a>";
		_html += "<div style='position:absolute;left:0px;bottom:0px;width:"+this.__width__+"px;height:"+this.__height__+";background-color:black;z-index:6;filter:Alpha(Opacity=50);height:"+this.__height__ * 0.3+"'></div>"
		_html += "<a target='_blank' style='position:absolute;left:0px;bottom:0px;text-align:center;font-size:12px;color:white;width:"+this.__width__+"px;height:"+this.__height__+"px;z-index:8;height:"+this.__height__ * 0.27+"px;text-decoration: none;font-weight: bold;' href='"+article.link+"'>"+article.title+"</a>"
		return _html;
	}

