//==========================================
// www.GameWAWA.com & www.DBAHome.com
//==========================================
// Scroll v3.11 by Jackson Shang on 2007.12.14
// 1.Add trigger for autoScroll
// 2.Fix bug on children's size overflow the parent's when in w3c page.
//   We must set parent's position to "relative" in initialize 


//==========================================
// www.GameWAWA.com & www.DBAHome.com
//==========================================
// Scroll v3.10 by Jackson Shang on 2007.12.04
// 1.Fixed bugs
// 2.Support Left&Right besides Up&Down
// 3.split scroll item from show item
//              This means you can show several items in the maq but every time it scrolls it just scroll in and out 1 item. 



if(!window.Scroll) window.Scroll = {}; 

//==========================================
// circle 
//==========================================
Scroll.circle = function() { 
this.s = new Array();
this.i=-1;
this.c=-1;
this.n=0 
};

Scroll.circle.prototype = { 
    append: function(value) { 
        if(value) 
        {
            this.s.push(value); 
            this.n++;
            if(this.i<0) this.i=0;
        }
    },
    prev: function() {
        if(this.n>0) {
            if(this.i>0)
                this.i--;
            else 
                this.i=this.n-1;
            return this.s[this.i];
        }
    },
    next: function() {
        if(this.n>0) {
            if(this.i<(this.n-1))
                this.i++;
            else 
                this.i=0;
            return this.s[this.i];
        }
    },
    prevN: function(n) {
        if(n<0) return;
        var r = new Array();
        for(i=0;i<n;i++) {
            r.push(this.prev());
        }
        return r;
    },
    nextN: function(n) {
        if(n<0) return;
        var r = new Array();
        for(i=0;i<n;i++) {
            r.push(this.next());
        }
        return r;
    },    
    getAt: function(i) {
        if(i<this.n && i>=0)
        return this.s[i];
    },
    move: function (n) {
        if(n==0) return;
        if(this.n>0) {
            if(n>0) {
                for(var i=0;i<n;i++)
                    if(this.c<(this.n-1))
                        this.c++;
                    else 
                        this.c=0;                
            } else {
                for(var i=0;i>n;i--)
                    if(this.c>0)
                        this.c--;
                    else 
                        this.c=this.n-1;               
            }
        }
    }             
};


//==========================================
// construction
//==========================================
Scroll.Maq = function() {
    // User Objects
    this.prevID = "prev";
    this.nextID = "next";
    this.ID = "Maq";
    this.elemTagName = "div";
    
    // User Settings
    this.direction = "up";
    this.showItem = 2;
    this.stepItem = 1;
    this.center = true;
    this.autoFade = true;
    this.showTime = 6000;
    this.autoScroll = true; 
    
    // system objects
    this.distanceAmend = 10;
    this.moveStep = 5;
    this.startOpacity = 0.0;
    this.opacityIncr = 0.05;
    this.opacityDecr = 0.2;
    this.endOpacity = 1;
    
    //Fixed system objects 
    this.item = new Scroll.circle();
    this.length = 0;
    this.childLength = 0;
    this.stopPos = 0;
    this.animationTimecount = 0;
    this.animationInterval =30;
    this.allMoveItem;
    this.alreadyShowItem; 
    this.inItem;
    this.fixItem;
    this.outItem;
          
    
    // Triggers
    this.action = "none"; //pause prev next none
    this.status = "stopped";  //"next" "prev" "stopped" "busyNext" "busyPrev" 
    this.scroll = true;         
};

//==========================================
//prototype
//==========================================
Scroll.Maq.prototype = {
	addEvent: function(oName, eName, fName) {
		if(window.attachEvent) 
			oName.attachEvent("on" + eName, fName); 
		if(window.addEventListener) 
			oName.addEventListener(eName, fName, false); 
	},
	handleMouseOver : function() {
	    this.action = "pause";
	},
	handleMouseOut : function() {
	    this.action = "none";
	},
	handleActionPrev : function() {
	    this.action = "prev";
	},
	handleActionNext : function() {
	    this.action = "next";
	},
    setChildPosInit: function(k) {            
        if(this.direction=="up"||this.direction=="down") {
            for( var i = 0; i < k.length; i++ )  {
                 k[i].style.position = "absolute";
                 if(i<this.showItem) {
                    k[i].style.marginTop = px(this.stopPos + i*this.childLength);
                    k[i].style.filter="progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=" + this.endOpacity * 100 + ",finishOpacity=100);";   
                 }
                 else {
                    k[i].style.marginTop = px(this.length + this.distanceAmend+i*this.childLength);
                    k[i].style.filter="progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=" + this.startOpacity * 100 + ",finishOpacity=100);";   
                 }
            }
        } else {
            for( var i = 0; i < k.length; i++ )  {
                 k[i].style.position = "absolute";
                 if(i<this.showItem) {
                    k[i].style.marginLeft = px(this.stopPos + i*this.childLength);
                    k[i].style.filter="progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=" + this.endOpacity * 100 + ",finishOpacity=100);";   
                 }
                 else {
                    k[i].style.marginLeft = px(this.length + this.distanceAmend+i*this.childLength);
                    k[i].style.filter="progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=" + this.startOpacity * 100 + ",finishOpacity=100);";   
                 }
            }  
        }    
    },
    setChildPos: function() {
        var item;
        if((this.direction=="up"&&this.status=="next")||(this.direction=="down"&&this.status=="prev")) {
            //up
            this.item.i = this.item.c;
            item = this.item.getAt(this.item.c);
            for( var i = 0; i < this.showItem; i++ )  {
                var k = $(item);
                item = this.item.next();
//                k.style.position = "absolute";
//                k.style.marginTop = px(this.stopPos + i*this.childLength);
//                k.style.filter="progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=" + this.endOpacity * 100 + ",finishOpacity=100);";                 
            }
            for(var j = 0;j<this.stepItem;j++)
            {
                var k = $(item);
                item = this.item.next();
                //k.style.position = "absolute";
                k.style.marginTop = px(this.stopPos +(j+this.showItem)*this.childLength);
                k.style.filter="progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=" + this.startOpacity * 100 + ",finishOpacity=100);";                 
            }
            for(var m = this.showItem+this.stepItem;m<this.item.n;m++)
            {
                var k = $(item);
                item = this.item.next();
                //k.style.position = "absolute";
                k.style.marginTop = px(this.length +this.childLength);
                //k.style.filter="progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=" + this.startOpacity * 100 + ",finishOpacity=100);";            
            }            
        } else if((this.direction=="down"&&this.status=="next")||(this.direction=="up"&&this.status=="prev")) {
            //down
//            this.item.i = this.item.c;
//            item = this.item.getAt(this.item.c);
//            for( var i = 0; i < this.showItem; i++ )  {
//                var k = $(item);
//                item = this.item.next();
//                k.style.position = "absolute";
//                k.style.marginTop = px(this.stopPos + i*this.childLength);
//                k.style.filter="progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=" + this.endOpacity * 100 + ",finishOpacity=100);";                 
//            }
            this.item.i = this.item.c;
            item = this.item.prev();
            for(var j = 1;j<=this.stepItem;j++)
            {
                var k = $(item);
                item = this.item.prev();
                //k.style.position = "absolute";
                k.style.marginTop = px(this.stopPos -j*this.childLength);
                k.style.filter="progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=" + this.startOpacity * 100 + ",finishOpacity=100);";                 
            }
            for(var m = this.showItem+this.stepItem;m<this.item.n;m++)
            {
                var k = $(item);
                item = this.item.prev();
                //k.style.position = "absolute";
                k.style.marginTop = px(this.length +this.childLength);
                //k.style.filter="progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=" + this.startOpacity * 100 + ",finishOpacity=100);";            
            }                        
        } else if((this.direction=="left"&&this.status=="next")||(this.direction=="right"&&this.status=="prev")) {
            //left
            this.item.i = this.item.c;
            item = this.item.getAt(this.item.c);
            for( var i = 0; i < this.showItem; i++ )  {
                var k = $(item);
                item = this.item.next();
//                k.style.position = "absolute";
//                k.style.marginLeft = px(this.stopPos + i*this.childLength);
//                k.style.filter="progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=" + this.endOpacity * 100 + ",finishOpacity=100);";                 
            }
            for(var j = 0;j<this.stepItem;j++)
            {
                var k = $(item);
                item = this.item.next();
                //k.style.position = "absolute";
                k.style.marginLeft = px(this.stopPos +(j+this.showItem)*this.childLength);
                k.style.filter="progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=" + this.startOpacity * 100 + ",finishOpacity=100);";                 
            }
            for(var m = this.showItem+this.stepItem;m<this.item.n;m++)
            {
                var k = $(item);
                item = this.item.next();
                //k.style.position = "absolute";
                k.style.marginLeft = px(this.length +this.childLength);
                //k.style.filter="progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=" + this.startOpacity * 100 + ",finishOpacity=100);";            
            }                        
        } else if((this.direction=="right"&&this.status=="next")||(this.direction=="left"&&this.status=="prev")) {
            //right
//            this.item.i = this.item.c;
//            item = this.item.getAt(this.item.c);
//            for( var i = 0; i < this.showItem; i++ )  {
//                var k = $(item);
//                item = this.item.next();
//                k.style.position = "absolute";
//                k.style.marginLeft = px(this.stopPos + i*this.childLength);
//                k.style.filter="progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=" + this.endOpacity * 100 + ",finishOpacity=100);";                 
//            }
            this.item.i = this.item.c;
            item = this.item.prev();
            for(var j = 1;j<=this.stepItem;j++)
            {
                var k = $(item);
                item = this.item.prev();
               // k.style.position = "absolute";
                k.style.marginLeft = px(this.stopPos -j*this.childLength);
                k.style.filter="progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=" + this.startOpacity * 100 + ",finishOpacity=100);";                 
            }            
            for(var m = this.showItem+this.stepItem;m<this.item.n;m++)
            {
                var k = $(item);
                item = this.item.prev();
                //k.style.position = "absolute";
                k.style.marginLeft = px(this.length +this.childLength);
                //k.style.filter="progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=" + this.startOpacity * 100 + ",finishOpacity=100);";            
            }             
        }  
    },    
    launchEvent: function() {
        var _this = this;
        if (document.all) {
            setTimeout( function(){_this.handleEvent();},this.animationInterval);
        } else {
            setTimeout( function(){_this.launchEvent();},1000);
        }
    },    	
    initialize: function() {
        //get objects
        var p = $(this.prevID);
        if (p)
            this.addEvent(p, "click", Scroll.Maq.createDelegate(this, this.handleActionPrev,p));
        var n = $(this.nextID);
        if (n)
            this.addEvent(n, "click", Scroll.Maq.createDelegate(this, this.handleActionNext,n));
        var c = $(this.ID);
        if (c) {
            this.addEvent(c, "mouseover", Scroll.Maq.createDelegate(this, this.handleMouseOver,c));
            this.addEvent(c, "mouseout", Scroll.Maq.createDelegate(this, this.handleMouseOut,c));
            c.style.position="relative";
        } else return;    
        
        //initial the list
        var k = c.getElementsByTagName(this.elemTagName);  
        if(k) {
            for( var i = 0; i < k.length; i++ )  {
                 this.item.append(k[i].id);
            }
            this.item.c=0; 
            this.item.i=0;
        } else return;
        
        if(this.item.n<this.showItem) this.scroll=false;
        if((this.item.n-this.showItem)<this.stepItem) this.stepItem = (this.item.n-this.showItem);
        
        //initial the lengths
        if(this.direction=="up"||this.direction=="down") {
            this.length = $px(c.currentStyle.height);
            this.childLength = $px(k[0].currentStyle.height);        
        }
        if(this.direction=="left"||this.direction=="right") {
            this.length = $px(c.currentStyle.width);
            this.childLength = $px(k[0].currentStyle.width);        
        }
        this.stopPos = (this.length<(this.showItem* this.childLength)|| this.center == false)? 0:parseInt((this.length - this.showItem*this.childLength)/2); 
        if(this.autoFade) {        
            var opacitychange = (parseInt(100*this.moveStep/(this.stepItem*this.childLength)))/100;
            this.opacityIncr = opacitychange;
            this.opacityDecr = opacitychange;            
        }
        
        //initial the pos of all the items
        this.setChildPosInit(k);
        
        //initial finished and start the timer
        if(this.scroll)
        this.launchEvent();       
    },
    isStop : function() {
        
        var c = $(this.item.getAt(this.item.c));
        var n ;
        if(this.direction=="up"||this.direction=="down")
           n = $px(c.style.marginTop)-this.stopPos; 
        else
           n = $px(c.style.marginLeft)-this.stopPos;     
        if ( n<this.moveStep && n>=0 )
        return true;
        else 
        return false;
    },     
    handleEvent : function() {
        var _this = this;
        
        if(this.status=="stopped") {
            switch (this.action) {
                case "none":
                    if(this.animationTimecount>=this.showTime)
                    {
                        this.animationTimecount =0;
                        this.status = "next";
                    }
                    else {
                        if(this.autoScroll)     
                        this.animationTimecount += this.animationInterval; 
                    }
                    break;
                case "next":
                    this.status="next";this.action = "none";
                    break;
                case "prev":
                    this.status="prev";this.action = "none";
                    break;
                case "pause":
                default:break;              
            }
        }
        else if (this.status=="next"|| this.status=="prev") {
            this.setChildPos();
            if(this.status=="next") {
            //this.item.move(this.stepItem);
            this.status="busyNext";
            }
            else {
            //this.item.move(-this.stepItem);
            this.status="busyPrev";
            }
            
            if((this.direction=="up"&&this.status=="busyNext")||(this.direction=="down"&&this.status=="busyPrev")) {
            this.item.move(this.stepItem);
            } else if((this.direction=="down"&&this.status=="busyNext")||(this.direction=="up"&&this.status=="busyPrev")) {
            this.item.move(-this.stepItem); 
            } else if((this.direction=="left"&&this.status=="busyNext")||(this.direction=="right"&&this.status=="busyPrev")) {
            this.item.move(this.stepItem);
            } else if((this.direction=="right"&&this.status=="busyNext")||(this.direction=="left"&&this.status=="busyPrev")) {
            this.item.move(-this.stepItem);
            }    
        } else {
            this.cycle();
        }
        setTimeout( function(){_this.handleEvent();},this.animationInterval);     
    },
    cycle:function () {
        if(this.isStop()) {       
            this.status = "stopped";
        } else {
            var item;
            if((this.direction=="up"&&this.status=="busyNext")||(this.direction=="down"&&this.status=="busyPrev")) {
                //up
                this.item.i = this.item.c;
                this.item.prevN(this.stepItem);
                item = this.item.getAt(this.item.i);
                for( var i = 0; i < this.showItem+this.stepItem; i++ )  {
                    var k = $(item);
                    item = this.item.next();
                    k.style.marginTop = px($px(k.style.marginTop)-this.moveStep);
                    if(i<this.stepItem)
                        this.fadeOut(k);
                    if(i>=this.showItem)
                        this.fadeIn(k);                                   
                }                                              
            } else if((this.direction=="down"&&this.status=="busyNext")||(this.direction=="up"&&this.status=="busyPrev")) {
                //down 
                this.item.i = this.item.c;
                item = this.item.getAt(this.item.i);
                for( var i = 0; i < this.showItem+this.stepItem; i++ )  {
                    var k = $(item);
                    item = this.item.next();
                    k.style.marginTop = px($px(k.style.marginTop)+this.moveStep);
                    if(i<this.stepItem)
                        this.fadeIn(k);
                    if(i>=this.showItem)
                        this.fadeOut(k);                                   
                }                                     
            } else if((this.direction=="left"&&this.status=="busyNext")||(this.direction=="right"&&this.status=="busyPrev")) {
                //left
                this.item.i = this.item.c;
                this.item.prevN(this.stepItem);
                item = this.item.getAt(this.item.i);
                for( var i = 0; i < this.showItem+this.stepItem; i++ )  {
                    var k = $(item);
                    item = this.item.next();
                    k.style.marginLeft = px($px(k.style.marginLeft)-this.moveStep);
                    if(i<this.stepItem)
                        this.fadeOut(k);
                    if(i>=this.showItem)
                        this.fadeIn(k);                                   
                }                                        
            } else if((this.direction=="right"&&this.status=="busyNext")||(this.direction=="left"&&this.status=="busyPrev")) {
                //right 
                this.item.i = this.item.c;
                item = this.item.getAt(this.item.i);
                for( var i = 0; i < this.showItem+this.stepItem; i++ )  {
                    var k = $(item);
                    item = this.item.next();
                    k.style.marginLeft = px($px(k.style.marginLeft)+this.moveStep);
                    if(i<this.stepItem)
                        this.fadeIn(k);
                    if(i>=this.showItem)
                        this.fadeOut(k);                                   
                }                            
            }            
        }
    },
    fadeIn : function(e) {
        var c = e.filters.item("DXImageTransform.Microsoft.Alpha").opacity;       
        c = ((c+this.opacityIncr)<=100)? c+this.opacityIncr*100 : 100;
        e.filters.item("DXImageTransform.Microsoft.Alpha").opacity = c;
    },
    fadeOut : function(e) {
        var c = e.filters.item("DXImageTransform.Microsoft.Alpha").opacity;       
        c = ((c-this.opacityDecr)>=0)? c-this.opacityDecr*100 : 0;
        e.filters.item("DXImageTransform.Microsoft.Alpha").opacity = c;
    }       
};

$ = function(id) { return document.getElementById(id); };
$px = function(v) { return parseInt(v.substring(0,v.indexOf("px"))); };
px = function(v) { return v+"px" };
Scroll.Maq.createDelegate = function(instance, method,c) { 
							return function() { 
								return method.call(instance, c); 
							} 
						};