/**************************************************
Ļ³ĺ ͼƬÖ²¥`
ʾ}:
<style type="text/css">
    .notcur { filter:alpha(opacity=50);background:#ffffff; }
</style>
 PImgPlayer.addItem( "test1", "http://www.feixiangdk.com", "images/imgdisplay/imgbig1.jpg", "images/imgdisplay/imgsmall1.jpg");
 PImgPlayer.addItem( "test2", "http://www.feixiangdk.com", "images/imgdisplay/imgbig2.jpg", "images/imgdisplay/imgsmall2.jpg");

***************************************************/
var PImgPlayer =
{
    _timer : null,
    _items : [],
    _container : null,
    _divsmall : null,
    _divtitle : null,
    _index : 0,
    _imgs : [],
    _smallimgs : [],
    intervalTime : 5000,
    init : function( objID, w, h, divsmall, divtitle, time )
    {
        this.intervalTime = time || this.intervalTime;
        this._container = $( objID );
        this._divsmall = $( divsmall );
        this._divtitle = $( divtitle );
        this._container.style.display = "block";
        this._container.style.width = w + "px";
        this._container.style.height = h + "px";
        this._container.style.position = "relative";
        this._container.style.overflow  = "hidden";
        //this._container.style.border = "1px solid #fff";
        var linkStyle = "display: block; TEXT-DECORATION: none;";
        if( document.all ){ // ͭ¼ԍ¼ƬȐ»»ҹʽ
            linkStyle += "FILTER:";
            linkStyle += "progid:DXImageTransform.Microsoft.Barn(duration=0.5, motion='out', orientation='vertical') ";
            linkStyle += "progid:DXImageTransform.Microsoft.Barn ( duration=0.5,motion='out',orientation='horizontal') ";
            linkStyle += "progid:DXImageTransform.Microsoft.Blinds ( duration=0.5,bands=10,Direction='down' )";
            linkStyle += "progid:DXImageTransform.Microsoft.CheckerBoard()";
            linkStyle += "progid:DXImageTransform.Microsoft.Fade(duration=0.5,overlap=0)";
            linkStyle += "progid:DXImageTransform.Microsoft.GradientWipe ( duration=1,gradientSize=1.0,motion='reverse' )";
            linkStyle += "progid:DXImageTransform.Microsoft.Inset ()";
            linkStyle += "progid:DXImageTransform.Microsoft.Iris ( duration=1,irisStyle=PLUS,motion=out )";
            linkStyle += "progid:DXImageTransform.Microsoft.Iris ( duration=1,irisStyle=PLUS,motion=in )";
            linkStyle += "progid:DXImageTransform.Microsoft.Iris ( duration=1,irisStyle=DIAMOND,motion=in )";
            linkStyle += "progid:DXImageTransform.Microsoft.Iris ( duration=1,irisStyle=SQUARE,motion=in )";
            linkStyle += "progid:DXImageTransform.Microsoft.Iris ( duration=0.5,irisStyle=STAR,motion=in )";
            linkStyle += "progid:DXImageTransform.Microsoft.RadialWipe ( duration=0.5,wipeStyle=CLOCK )";
            linkStyle += "progid:DXImageTransform.Microsoft.RadialWipe ( duration=0.5,wipeStyle=WEDGE )";
            linkStyle += "progid:DXImageTransform.Microsoft.RandomBars ( duration=0.5,orientation=horizontal )";
            linkStyle += "progid:DXImageTransform.Microsoft.RandomBars ( duration=0.5,orientation=vertical )";
            linkStyle += "progid:DXImageTransform.Microsoft.RandomDissolve ()";
            linkStyle += "progid:DXImageTransform.Microsoft.Spiral ( duration=0.5,gridSizeX=16,gridSizeY=16 )";
            linkStyle += "progid:DXImageTransform.Microsoft.Stretch ( duration=0.5,stretchStyle=PUSH )";
            linkStyle += "progid:DXImageTransform.Microsoft.Strips ( duration=0.5,motion=rightdown )";
            linkStyle += "progid:DXImageTransform.Microsoft.Wheel ( duration=0.5,spokes=8 )";
            linkStyle += "progid:DXImageTransform.Microsoft.Zigzag ( duration=0.5,gridSizeX=4,gridSizeY=40 ); width: 100%; height: 100%";
        }
        var html = "<div title=\""+this._items[this._index].title+"\" style=\""+linkStyle+"\"></div>";
        this._container.innerHTML = html;
        // create small image list
        var imglist = '<div style="width:9999px;">';
        for (var i = 0; i < this._items.length; i++)
        {
            var div = '<div class="notcur" id="smallimg'+i+'" style="margin-left:10px;width:200px;height:125px;overflow:hidden;float:left;">';
            div += '<img title="'+this._items[i].title+'" src="' + this._items[i].smallimg + '" border="0" onclick="PImgPlayer.play('+i+');" />';
            div += '</div>';
            imglist += div;
        }
        imglist += '</div>';
        this._divsmall.innerHTML = imglist;
        var link = this._container.getElementsByTagName("DIV")[0];
        link.style.width =  w + "px";
        link.style.height = h + "px";
        link.style.background = 'url(' + this._items[0].img + ') no-repeat center center';
        this._divtitle.innerHTML = this._items[0].title;
        link.title = this._items[0].title;
        this._index = 0;
        this.setclass(this._index, '');
        this._timer = setInterval( "PImgPlayer.play()", this.intervalTime );
    },
    addItem : function( _title, _link, _imgURL, _smallimg)
    {
        this._items.push ( {title:_title, link:_link, img:_imgURL, smallimg:_smallimg } );
        var img = new Image();
        img.src = _imgURL;
        this._imgs.push( img );
        var smallimg = new Image();
        smallimg.src = _smallimg;
        this._smallimgs.push(smallimg);
    },
    play : function( index )
    {
        if (this._index != null)
            this.setclass(this._index, 'notcur');
        if ( index!=null ) {
            this._index = index;
            clearInterval( this._timer );
            this._timer = setInterval( "PImgPlayer.play()", this.intervalTime );
        } else {
            this._index = this._index<this._items.length-1 ? this._index+1 : 0;
        }
        this.setclass(this._index, '');
        var link = this._container.getElementsByTagName("DIV")[0];
        if (link.filters){
            var ren = Math.floor(Math.random()*(link.filters.length));
            try {
                link.filters[ren].Apply();
                link.filters[ren].play();
            } catch (ex)
            {
                //alert(ex.message);
            }
        }
        link.title = this._items[this._index].title;
        link.style.background = 'url(' + this._items[this._index].img + ') no-repeat center center';
        this._divtitle.innerHTML = this._items[this._index].title;
        this.scrollsmall();
    },
    playnext : function(step)
    {
        if (this._index == null) this._index = 0;
        var newindex = this._index+step;
        if (newindex < 0) newindex = 0;
        else if (newindex >= this._items.length) newindex = this._items.length - 1;
        this.play(newindex);
    },
    setclass : function(idx, cn)
    {
        $('smallimg'+idx).className = cn;
    },
    _sctotal : 0,
    _targetLeft : 0,
    scrollsmall : function()
    {
        this._sctotal = this._divsmall.scrollWidth - this._divsmall.offsetWidth;
        if (this._sctotal < 0)
            return;
        var curleft = this._divsmall.scrollLeft;
        var idx = this._index;
        this._targetLeft = 210 * (idx-2);
        if (this._targetLeft < 0) this._targetLeft = 0;
        this._scrolltimer = setInterval("PImgPlayer.scrolldiv()", 15);
    },
    _scrolltimer : null,
    scrolldiv : function()
    {
        var curleft = this._divsmall.scrollLeft;
        var dif = this._targetLeft - curleft;
        if (0 == dif) // µ½´𐄿±뎻׃
        {
            clearInterval(this._scrolltimer);
        }
        else if (Math.abs(dif) < 5)
        {
            clearInterval(this._scrolltimer);
            this._divsmall.scrollLeft += dif;
        }
        else if (dif > 0)
        {
            this._divsmall.scrollLeft += 5;
        }
        else
        {
            this._divsmall.scrollLeft -= 5;
        }
    }
}

var ImgScroll =
{
    _sch : 4,
    scth : 168,
    sct : 50,
    stoptm : 5000,
    sctotal : 0,
    t : null,
    imglist : null,
    slide : function(imglist)
    {
        this.imglist = $(imglist);
        this.sctotal = this.imglist.scrollHeight - this.scth;
        this._sch = 4;
        ImgScroll.begin();
    },
    begin : function()
    {
        if (this.t) clearInterval(this.t);
        this.t = setInterval("ImgScroll.scrolldiv()", this.sct);
    },
    scrolldiv : function()
    {
        this.imglist.scrollTop += this._sch;
        //$('show').innerHTML += '-'+this.imglist.scrollTop;
        if ((this.imglist.scrollTop >= this.sctotal) || (this.imglist.scrollTop <= 0)) // µ½µ׻򵽶¥
        {
            clearInterval(this.t);
            this._sch = 0 - this._sch;
            setTimeout("ImgScroll.begin()", this.stoptm);
        }
        else if ((this.imglist.scrollTop % this.scth) == 0)
        {
            clearInterval(this.t);
            setTimeout("ImgScroll.begin()", this.stoptm);
        }
    },
    stopsc : function()
    {
        clearInterval(this.t);
    }
}


function ImgShow(imgTag){
   //var imgTag=(window.event)?event.srcElement:evt.target;
   var imgPath=imgTag.src.replace("/mid","");
   var tagTop=Math.max(document.documentElement.scrollTop,document.body.scrollTop);
   var tag=document.createElement("div");
    tag.style.cssText="width:100%;height:"+Math.max(document.body.clientHeight,document.body.offsetHeight)+"px;position:absolute;background:white;top:0;filter: Alpha(Opacity=80);Opacity:0.8;";
    tag.ondblclick=function(){var clsOK=confirm("确定要取消图片显示吗？"); if(clsOK){closes();}};
   var tagImg=document.createElement("div");
    tagImg.style.cssText="font:12px /18px verdana;overflow:auto;text-align:center;position:absolute;width:200px;border:5px solid gray;background:gray;color:white;left:"+(parseInt(document.body.offsetWidth)/2-100)+"px;top:"+(document.documentElement.clientHeight/3+tagTop)+"px;"
    tagImg.innerHTML="<div style='padding:10px;background:#cccccc;border:1px solid white'><br /><b style='color:#999999;font-weight:normal'>正在加载图片...</b><br /></div>";
   var closeTag=document.createElement("div");
    closeTag.style.cssText="display:none;position:absolute;left:10px;top:10px;background:red;border:1px solid white;yellow:white;filter:Alpha(Opacity=50);Opacity:0.5;cursor:pointer;";
    closeTag.innerHTML="<b>&nbsp;关闭&nbsp;</b>";
    closeTag.onclick=closes;
   document.body.appendChild(tag);
   document.body.appendChild(tagImg);
   var img=new Image();
    img.src=imgPath;
    img.style.cssText="border:1px solid #cccccc;filter: Alpha(Opacity=0);Opacity:0;";
    tagImg.oncontextmenu=function(){var clsOK=confirm("确定要取消图片显示吗？"); if(clsOK){closes();};return false};
   var barShow,imgTime;
   img.complete?ImgOK():img.onload=ImgOK;
   function ImgOK(){
    var Stop1=false,Stop2=false,temp=0;
    var tx=tagImg.offsetWidth,ty=tagImg.offsetHeight;
    var ix=img.width,iy=img.height;
    var sx=document.documentElement.clientWidth,sy=Math.min(document.documentElement.clientHeight,document.body.clientHeight/*opera*/);
    var xx=ix>sx?sx-50:ix+4,yy=iy>sy?sy-50:iy+3;
    var maxTime=setInterval(function(){
     temp+=35;
     if((tx+temp)<xx){
      tagImg.style.width=(tx+temp)+"px";
      tagImg.style.left=(sx-(tx+temp))/2+"px";
     }else{
      Stop1=true;
      tagImg.style.width=xx+"px";
      tagImg.style.left=(sx-xx)/2+"px";
     }
     if((ty+temp)<yy){
      tagImg.style.height=(ty+temp)+"px";
      tagImg.style.top=(tagTop+((sy-(ty+temp))/2))+"px";
     }else{
      Stop2=true;
      tagImg.style.height=yy+"px";
      tagImg.style.top=(tagTop+((sy-yy)/2))+"px";
     }
     if(Stop1 && Stop2){
      clearInterval(maxTime);
      tagImg.appendChild(img);
      temp=0;
      imgOPacity();
     }
    },1);
    function imgOPacity(){
     temp+=10;
     img.style.filter="alpha(opacity="+temp+")";
     img.style.opacity=temp/100;
     imgTime=setTimeout(imgOPacity,1)
     if(temp>100) clearTimeout(imgTime);
    }
    tagImg.innerHTML="";
    tagImg.appendChild(closeTag);
    if(ix>xx||iy>yy){
     img.title="左键拖动，双击放大缩小";
     img.ondblclick=function (){
      if(tagImg.offsetWidth<img.offsetWidth||tagImg.offsetHeight<img.offsetHeight){
       img.style.width="auto";
       img.style.height="100%";
       img.title="双击可以放大";
       img.onmousedown=null;
       closeTag.style.top="10px";
       closeTag.style.left="10px";
       tagImg.style.overflow="visible";
       tagImg.style.width=img.offsetWidth+"px";
       tagImg.style.left=((sx-img.offsetWidth)/2)+"px";
      }else{
       img.style.width=ix+"px";
       img.style.height=iy+"px";
       img.title="双击可以缩小";
       img.onmousedown=dragDown;
       tagImg.style.overflow="auto";
       tagImg.style.width=xx+"px";
       tagImg.style.left=((sx-xx)/2)+"px";
      }
     }
     img.onmousedown=dragDown;
     tagImg.onmousemove=barHidden;
     tagImg.onmouseout=moveStop;
     document.onmouseup=moveStop;
    }else{
     tagImg.style.overflow="visible";
     tagImg.onmousemove=barHidden;
    }
   }
   function dragDown(a){
    img.style.cursor="pointer";
    var evts=a||window.event;
    var onx=evts.clientX,ony=evts.clientY;
    var sox=tagImg.scrollLeft,soy=tagImg.scrollTop;
    var sow=img.width+2-tagImg.clientWidth,soh=img.height+2-tagImg.clientHeight;
    var xxleft,yytop;
    document.onmousemove=function(e){
     var evt=e||window.event;
     xxleft=sox-(evt.clientX-onx)<0?"0":sox-(evt.clientX-onx)>sow?sow:sox-(evt.clientX-onx);
     yytop=soy-(evt.clientY-ony)<0?"0":soy-(evt.clientY-ony)>soh?soh:soy-(evt.clientY-ony);
     tagImg.scrollTop=yytop;
     tagImg.scrollLeft=xxleft;
     closeTag.style.top=(yytop+10)+"px";
     closeTag.style.left=(xxleft+10)+"px";
     return false;
    }
    return false;
   }
   function barHidden(){
    clearTimeout(barShow);
    if(closeTag.style.display=="none")closeTag.style.display="block";
    barShow=setTimeout(function(){closeTag.style.display="none";},2000);
   }
   function closes(){
    document.body.removeChild(tag);
    document.body.removeChild(tagImg);
    clearTimeout(barShow);
    clearTimeout(imgTime);
    document.onmouseup=null;
    tag=img=tagImg=closeTag=null;
   }
   function moveStop(){
    document.onmousemove=null;
    tagImg.onmousemove=barHidden;
    img.style.cursor="default";
   }
  }