// Author: R. Pepe Lopez B.
// Date: 2.10.2009
// Version: 1.00
// Contact: js_hacks [-a-t-] freshsite.de
// License: MIT License
/*
 * Initialize:
 * var moover = new milkyMoove({
                                divname1: "inner",
                                divname2: "inner2",
                                divleftarr: "leftarr",
                                divrightarr: "rightarr",
                                milkyMoove_move_step: 2
                            });
 * 
 * 
 */
var milkyMoove = new Class({
     Implements: [Options],
    
        //options
          options: {
            milkyMoove_move_step: 1, //how much px in one step?
            
            divname1: "inner",      // id of inital DIV which contains pix
            divname2: "inner2",     // id of cloned div, you need it for css!
            
            divleftarr: "leftarr",  // id of left arrow 
            divrightarr: "rightarr" // id of right arrow
          },
          
      //variables - LEAVE AS IS!
        milkyMoove_move: 0,         //status - LEAVE AS IS HERE!
        milkyMoove_timer: '',
          
      //functions
       initialize: function(options){
        // apply options
        this.setOptions(options);   
        //set events
            //if you want to "inverse" movement, switch left & right to each other!!
            $(this.options.divleftarr).addEvent('mouseover', (function(){
                this.scroll_mouse_over('left');
            }).bind(this));
            $(this.options.divrightarr).addEvent('mouseover', (function(){
                this.scroll_mouse_over('right');
            }).bind(this));
            $(this.options.divleftarr).addEvent('mouseout', (function(){
                this.scroll_mouse_out();
            }).bind(this));
            $(this.options.divrightarr).addEvent('mouseout', (function(){
                this.scroll_mouse_out();
            }).bind(this));
 
        
        },
        //main move function
        scroll_move_it: function()
        {
                // getting element names...
                var el = $(this.options.divname1);
                var el2 = $(this.options.divname2);
                
                switch(this.milkyMoove_move)
                {
                    case 1: //left arrow
                        el.style.left = (el.offsetLeft+(this.options.milkyMoove_move_step))+"px";
                        
                        if(el.offsetLeft>-10)
                        {
                            //if 2nd div does not exist... only 1st time!
                            if (!el2)
                            {
                                el2 = el.cloneNode(true);       //clone 1st div
                                el2.id = this.options.divname2; //give name
                                el.parentNode.appendChild(el2); //append
                            }
                            //and move too
                            el2.style.left = (el.offsetLeft - el2.offsetWidth)+"px";
                            
                            //if out of sight switch place                          
                            if(el.offsetLeft>el.offsetWidth)
                            {
                                el.style.left = (el2.offsetLeft-el.offsetWidth)+"px;"
                                el2.id=this.options.divname1;
                                el.id =this.options.divname2;
                            }
                        }
                        break;
                    case -1:    //right arrow
                        el.style.left = (el.offsetLeft-(this.options.milkyMoove_move_step))+"px";
                        
                        if((el.offsetWidth+el.offsetLeft)<(el.offsetWidth+10))
                        {
                            //if 2nd div does not exist... only 1st time!
                            if (!el2)
                            {
                                el2 = el.cloneNode(true);
                                el2.id = this.options.divname2;
                                el.parentNode.appendChild(el2);
                            }
                            el2.style.left = (el.offsetLeft + el.offsetWidth)+"px";
                            
                            if(el2.offsetLeft<0)
                            {
                                //if in sight switch place
                                el.style.left = (el2.offsetLeft+el.offsetWidth)+"px;"
                                el2.id=this.options.divname1;
                                el.id=this.options.divname2;
                            }
                        }
                        break;
                }
                
            },
                  
        scroll_mouse_over: function (name){
            var el = $(this.options.divname1);
            var el2 = $(this.options.divname2);
            switch(name)
            {
                case 'right':
                //you may change this line...
                    $(this.options.divrightarr).setOpacity(0.8);
                    
                    if(el2 && el.offsetLeft>el2.offsetLeft)
                    {
                        el.id = this.options.divname2;
                        el2.id = this.options.divname1;
                    }
                    this.milkyMoove_move=-1;
                    break;
                case 'left':
                //you may change this line...
                    $(this.options.divleftarr).setOpacity(0.8);
                    
                    if(el2 && el.offsetLeft<el2.offsetLeft)
                    {
                        el.id = this.options.divname2;
                        el2.id = this.options.divname1;
                    }
                    this.milkyMoove_move=1;
                    break;
            }
            
            if(this.milkyMoove_move!=0)
            {
                //as long as mouseover, execute function!
                this.milkyMoove_timer = this.scroll_move_it.periodical(10, this);
            }
        }, 
      
        scroll_mouse_out: function(){
                switch (this.milkyMoove_move) {
                    case -1:
                    //you may change this line...
                        $(this.options.divrightarr).setOpacity(1);
                        break;
                    case 1:
                    //you may change this line...
                        $(this.options.divleftarr).setOpacity(1);
                        break;
                }
                //stop movement
                this.milkyMoove_move = 0;
                $clear(this.milkyMoove_timer);
                
              }
  
});