var menuScrollerActive = false;


function menu_scroll_in(menuObj) {
	menuScroller.prototype.doScroll(menuObj);
}




menuScroller = Class.create();

menuScroller.prototype = {

   scrollInDuration: 10,
   scrollInSteps: 5,
   scrollOutDuration: 10,
   scrollOutSteps: 5,
   
   opened: false,
   scrollDiv: false,
   
   scrollInProgress: false,
   
   timer: false,
   timer_check: false,
   
   
   doScroll: function( scrollDiv ) {
   		if( ! $(scrollDiv).scrollMenu) {
   			return new menuScroller( scrollDiv );
   		} else {
   			$(scrollDiv).scrollMenu.scrollIn();
   		}
   		
   },
   
   
   initialize: function(scrollDiv) {
   
		if( ! $(scrollDiv).scrollMenu) {
			this.scrollDiv = $(scrollDiv);
			this.scrollDiv.scrollMenu = this;
		}
		
		this.scrollIn();
   },
   
   
	
	
	startCheckingForMouseOut: function() {
		this.checkForMouseOut = this.checkForMouseOut.bind(this);
		this.timer_check = new PeriodicalExecuter(this.checkForMouseOut, 0.1);
		
		Event.observe( document.getElementsByTagName("body")[0], 'mousemove', this.checkForMouseOut, false);
	},
	
	
	checkForMouseOut: function(evt) {
		var y = Event.pointerY(evt);
		var x = Event.pointerX(evt);
		
		var imgSize = Element.getDimensions(this.scrollDiv);
		var imgPos = Position.cumulativeOffset(this.scrollDiv);
		
		if( menuScrollerActive != this || y < imgPos[1] || y > Number(imgPos[1]) + Number(imgSize.height) || x < imgPos[0] || x > Number(imgPos[0]) + Number(imgSize.width)) {
			this.stopCheckingForMouseOut();
			this.scrollOut();
		}
	},
	
	
	stopCheckingForMouseOut: function() {
		this.timer_check.stop();
		Event.stopObserving( document.getElementsByTagName("body")[0], 'mousemove', this.checkForMouseOut);
	},
	
	
	
	scrollOut: function() {
		if( this.opened == false || this.scrollInProgress == true ) {
			return false;
		}
		
		if( this.detailTimer ) {
			clearTimeout( this.detailTimer );
		}

		this.scrollInProgress = true;
		//this.scrollDiv.style.zIndex = "10";
		
		this.startScroll( this.getMenuLeft(), -26, this.scrollOutSteps, this.scrollOutDuration, {complete: this.scrollOutAfter } );
		
	},
	
	
	scrollOutAfter: function(obj) {
		obj.scrollInProgress = false;
		obj.opened = false;
	},
	
	
	
	
	scrollIn: function() {
		if( this.opened == true || this.scrollInProgress == true ) {
			return false;
		}
		
		menuScrollerActive = this;
		
		this.opened = true;
		this.scrollInProgress = true;

		//this.scrollDiv.style.zIndex	= "11";
	
		this.startScroll( this.getMenuLeft(), ((-1)*this.scrollDiv.getHeight()+26), this.scrollInSteps, this.scrollInDuration, {complete: this.scrollInAfter.bind(this) } );
	},
	
	
	scrollInAfter: function() {
		this.scrollInProgress = false;
		
		this.startCheckingForMouseOut();
	},
	
	
	
	
	
   
   
   getMenuLeft: function() {
   		// get source img position
		return Position.cumulativeOffset( this.scrollDiv )[0];
   },
   
   
   
   
	startScroll: function(x, y, duration, steps, options) {
		this.options  = options || {};
		
		this.steps = steps;
		this.stepDuration	= duration / steps;

		this.currentX = this.scrollDiv.offsetLeft;
		this.currentY = this.scrollDiv.offsetTop;
		
		this.xChange = (x - this.currentX) / steps;
		this.yChange = (y - this.currentY) / steps;
		
		this.changePosition();
	},
	
	
	

   changePosition: function() {
   	
      if ( this.steps <= 0 ) {
         if(this.options.complete) {
         	this.options.complete(this);
         }
         return;
      }

      if (this.timer) {
         clearTimeout(this.timer);
      }

      // reposition
      this.currentX += this.xChange;
      this.currentY += this.yChange;
      
      this.scrollDiv.style.left	= this.currentX + "px";
      this.scrollDiv.style.top	= this.currentY + "px";
      
      this.steps--;

      this.timer = setTimeout( this.changePosition.bind(this), this.stepDuration );
   }
   
   
}