var $E = YAHOO.util.Event;
var $D = YAHOO.util.Dom;
var $Es = YAHOO.util.Easing;
var $A = YAHOO.util.Anim;
var $S = YAHOO.util.Scroll;

var sv = function()
{
    var timer;
    var time = 300;
    var st = false;
    var srcTop;
    var srcBot;
    var oldLeft = "p001";
    var oldIn = "i001";
    var oldInSrc = "../i/items/p001/inner/i001.jpg";
    var leftNavOn;
    var leftNavOut;
    
    var ic = new Array();
    
    var oldView = "i001";
    var oldViewSrc = "../i/items/p001/inner/i001.jpg";

    var oldOverLeft= "p001";
    
    return {
        init: function()
        {
            //$D.get('main-pics').style.height='450px';
            //$D.get('main-pics').style.top='25px';
            
            $E.on('up-img','mouseover',this.scroll);
            $E.on('down-img','mouseover',this.scroll);
            $E.on('up-img','mouseout',this.stop);
            $E.on('down-img','mouseout',this.stop);            
            
            srcTop = new Ext.get('up-img');
            srcBot = new Ext.get('down-img');   
            
            this.resize();
           
            this.setImgs();  
            
            //var it = $D.getElementsByClassName('img-link','a')[0];
            //oldLeft = $D.getElementsByClassName('pic-img','img',it)[0].id;            
            $D.get(oldLeft).src = "../i/items/"+oldLeft+"/"+oldLeft+"l.jpg";
            
            $D.getElementsByClassName('view-image','img',oldIn)[0].src = "../i/items/p001/inner/i001l.jpg";
            
            if (navigator.appVersion.indexOf("MSIE") != -1)
            {
                $D.get('text-button').style.top = "-5px";
                if (navigator.appVersion.indexOf("MSIE 6") != -1)
            {
                $D.get('text-button').style.top = "-6px";
            }
            }
            
            $D.get('main-pics').style.visibility = "visible";
        },
        fixLink: function()
        {
            if ($D.get('table-info').innerHTML.length==0)
            {
                $D.get('table-info').innerHTML = 
                $D.getElementsByClassName("viewLinks","a","info-views")[0].title;
            }
            
            $D.get(oldLeft).src = "../i/items/"+oldLeft+"/"+oldLeft+"l.jpg"
            
            var it = $D.getElementsByClassName('viewLinks','a')[0];
            oldIn = it.id;
            it = $D.getElementsByClassName('view-image','img',it)[0];
            oldInSrc = it.src;
            
            var objs = $D.getElementsByClassName('view-image','img');
            for (var i = 0;i<objs.length;i++)
            {
                $E.on(objs[i],'mouseover',this.viewsOver);
                $E.on(objs[i],'mouseout',this.viewsOut);
            }
           
            it.src = "../i/items/"+oldLeft+"/inner/"+oldIn+"l.jpg";
            
            var l = Ext.get('loading');
            l.hide();         
        },
        setImgs: function()
        {
            var els = $D.getElementsByClassName('img-link','a');
			for (var i=0;i<els.length;i++)
			{
				$E.on(els[i],'click',this.navClick);				
			}
			this.setLeftNav();
        },
        navClick: function(e)
        {
            var c = $E.getTarget(e).id;
            $D.get(oldLeft).src = "../i/items/"+oldLeft+"/"+oldLeft+".jpg";
            //$D.get(c).src = "../i/items/"+c+"/"+c+"l.jpg";
            oldLeft=c;
            
            //Loading
            var n = Ext.get('body-main');
            var l = Ext.get('loading');
            
            
            var p = ($D.getViewportHeight()-700)/2;
            p = p < 0 ? 0 : p;
           
            l.setWidth(n.getWidth());
            l.setHeight(n.getHeight());
            l.setLeft(($D.getViewportWidth()-580)/2);
            l.setTop(p);
            l.show();
            /*
            var objs = $D.getElementsByClassName('view-image','img');
            for (var i = 0;i<objs.length;i++)
            {
                $E.removeListener(objs[i],'mouseover');
                $E.removeListener(objs[i],'mouseout');
            }*/
                     
        },
        setLeftNav: function()
        {
            var objs = $D.getElementsByClassName('pic-img','img');
            leftNavOn = new Array(objs.length);
            leftNavOut = new Array(objs.length);
            
			for (var i=0;i<objs.length;i++)
			{
			    leftNavOn[objs[i].id] = new Image();
			    leftNavOn[objs[i].id].src = "../i/items/"+objs[i].id+"/"+objs[i].id+"l.jpg";
			    
			    leftNavOut[objs[i].id] = new Image();
			    leftNavOut[objs[i].id].src = "../i/items/"+objs[i].id+"/"+objs[i].id+".jpg";
			    
				$E.on(objs[i],'mouseover',this.navOver);
				$E.on(objs[i],'mouseout',this.navOut);				
			}
        },
        navOver: function(e)
        {
            var c = $E.getTarget(e).id;
            if (oldOverLeft != oldLeft)
                $D.get(oldOverLeft).src = leftNavOut[oldOverLeft].src;
            
            oldOverLeft = c;
            $D.get(oldOverLeft).src = leftNavOn[oldOverLeft].src;
        },
        navOut: function(e)
        {
            var c = $E.getTarget(e).id;
            if (oldOverLeft != oldLeft)
                $D.get(oldOverLeft).src = leftNavOut[oldOverLeft].src;
        },
        viewsOver: function(e)
        {
            var c = $E.getTarget(e);
            var id = c.parentNode.id;
            
            if (oldView != oldIn && $D.get(oldView))
            $D.getElementsByClassName('view-image','img',oldView)[0].src = oldViewSrc;
            oldView = id;
            oldViewSrc = c.src;       
            
            
            var typ = id.indexOf('i')!= -1 ? "inner" : "add";
            c.src = "../i/items/"+oldLeft+"/"+typ+"/"+id+"l.jpg";   
        },
        viewsOut: function(e)
        {
            var c = $E.getTarget(e);
            var id = c.parentNode.id;
            
            if (oldView != oldIn)
            $D.getElementsByClassName('view-image','img',oldView)[0].src = oldViewSrc;
        },
        scroll: function(e)
        {
            clearTimeout(timer);
            st=true;
            if ($E.getTarget(e).id == "up-img")
                timer = setTimeout("sv.start(true)",0);
            else
                timer = setTimeout("sv.start(false)",0);
            
        },
        start: function(way)
        {
            if (st)
            {
                clearTimeout(timer);
                var a;
                if (way)
                {
                    this.checkTop();
                    srcBot.show();
                    a = {scroll:{by:[0,-10]}};
                }
                else
                {
                    this.checkBottom();
                    srcTop.show();
                    a = {scroll:{by:[0,10]}};
                    
                }
                var scr = new $S('main-pics',a,this.time,$Es.easeNone);
                scr.onComplete.subscribe(function(){timer = setTimeout("sv.start("+way+")",10);});
                scr.useSeconds = false;
                               
                scr.animate();
            }
        },
        stop: function()
        {
            clearTimeout(timer);
            st = false;
        },
        checkTop: function()
        {
            var top = $D.get('main-pics').scrollTop;
            if (top == 0)
            {
                srcTop.hide();
            }
        },
        checkBottom: function()
        {
            var top = $D.get('main-pics').scrollTop;                
            var c = new Ext.get('pics-scroll');                
            var d = Math.ceil($D.getViewportHeight()*0.86)+top;
                    
            var i;
            
            if (navigator.appVersion.indexOf("MSIE 6") != -1)
            {
                i = Math.ceil(c.getHeight() - d);
            } else
            {
                i = Math.abs(c.getHeight() - d);
            }
            
            if (i <= 1)
            {
                srcBot.hide();
            }
            
        },
        changeImage: function(img,text,id,pId)
        {
            var infoPanel = Ext.get('table-info');
            infoPanel.hide();
            
            
            
            var ttt;
            
            if (ic[id])
            {
                ttt = ic[id];
                sv.chgImg(ttt.src,text,id,pId);
                return;
            }
            
            ttt = new Image();
            ttt.src = "../"+img;
            
            
//            if (navigator.appVersion.indexOf("MSIE 6") != -1)
//            {
                ttt.onload = function(){
                    sv.chgImg(ttt.src,text,id,pId);
                    ic[id] = ttt;
                }
                
                //ttt.onload = null;
//            } else
//            {
//                sv.chgImg(ttt.src,text,id,pId);
//            }
          
        },
        chgImg: function(img,text,id,pId)
        {
            $D.get('imageLarge').src = img;
            $D.get('table-info').innerHTML = text;
            
            if (oldView != oldIn)
            $D.getElementsByClassName('view-image','img',oldView)[0].src = oldViewSrc;

        
            if ($D.get(oldIn) != null)
            {
                $D.getElementsByClassName('view-image','img',oldIn)[0].src = oldInSrc;
                oldIn = id;
                oldInSrc = $D.getElementsByClassName('view-image','img',id)[0].src;
            }
            oldIn = id;
            var typ = id.indexOf('i')!= -1 ? "inner" : "add";            
            $D.getElementsByClassName('view-image','img',id)[0].src = "../i/items/"+pId+"/"+typ+"/"+id+"l.jpg";
        },
        resize: function()
        {             
            var p = ($D.getViewportHeight()-700)/2;
            p = p < 0 ? "0px" : p + "px";
            $D.get('body-main').style.marginTop = p;
            
            var pics = new Ext.get('main-pics');
            var up = new Ext.get('pics-up');
            var down = new Ext.get('pics-down');
            var logo = new Ext.get('body-logo');
            
            var l = ($D.getViewportWidth()-600)/2;
            
            l = l < 200 ? 120 : l-80;
            
            pics.setLeft(l);
            up.setLeft(l);
            down.setLeft(l);
            
            if (navigator.appVersion.indexOf("MSIE") == -1)
            {
                logo.setTop($D.getViewportHeight()*0.07);
            }
            
            if (navigator.appVersion.indexOf("MSIE 6") != -1)
            {
                pics.setHeight($D.getViewportHeight()*0.86);
                $D.get('down-img').style.top = "-20px";
                $D.get('main-pics').style.width="100px";
            }
            
            var top = $D.get('main-pics').scrollTop;                
            var c = new Ext.get('pics-scroll');                
            var d = Math.ceil($D.getViewportHeight()*0.86)+top;
            
            if (Math.abs(c.getHeight() - d) > 0)
            {
                srcTop.show();
                srcBot.show();
            }
            
            this.checkTop();
            this.checkBottom();
            this.onSrc();
        },
        onSrc: function()
        {
            var x;
              if (self.pageYOffset){ 
                x = self.pageYOffset;
              }else if (document.documentElement && document.documentElement.scrollTop){ 
                x = document.documentElement.scrollTop; 
              }else if (document.body) { 
                x = document.body.scrollTop;
              }
            $D.get('pix').style.top = x + $D.getViewportHeight() - 38 + "px";
        },
        togInfo: function()
        {
            var infoPanel = Ext.get('table-info');
            var img = Ext.get('imageLarge');

            infoPanel.setWidth(img.getWidth());
            infoPanel.setHeight(img.getHeight());
            
            infoPanel.toggle(true);
            
            infoPanel.setOpacity(0.8);
        }
    };
}();

$E.on(window,'resize',sv.resize,sv,true);
$E.on(window,'load',sv.init,sv,true);
$E.on(window,'scroll',sv.onSrc,sv,true);