/*
* works with moo 1.1 and 1.2
* domready call:
*
var jzScrollBoxes = new cJzScroll({selector:'.jzscroll'});
*
// additional, allows scrolling to active page if an id="scrollHere" is added the ACT element in TMENU:
$('theScrollMenu').jzScrollToElement('scrollHere');
*
*/

if (MooTools.version.toFloat() < 1.2) { 
	Element.extend ({
		// this function doesn't exist in 1.11
		getScroll: function(){
			return this.getSize().scroll;
		},
		
		getSize: function(){
			return {
				'scroll': {'x': this.scrollLeft, 'y': this.scrollTop},
				'size': {'x': this.offsetWidth, 'y': this.offsetHeight},
				'scrollSize': {'x': this.scrollWidth, 'y': this.scrollHeight}
				// in mootools 1.2 getSize just returns { x , y }, so I'll add them here
				,'x': this.offsetWidth,
				'y': this.offsetHeight
			};
		}
	});
}


var cScrollButton = new Class({
		
	Implements: [Options],
	
	options: {
		fps: 50,
		velocity: 10,
		direction: 'right'
	},
	
	initialize: function(buttonEl,scrolledEl,options){
		
		if ($(buttonEl) && $(scrolledEl)) {
		
			this.setOptions(options);

			var v = this.options.velocity.toInt()
			switch (this.options.direction.toLowerCase()) {
				case 'up': 
					this.velocity = {x:0, y: -v};
					break;
				case 'down': 
					this.velocity = {x: 0, y: v};
					break;
				case 'left': 
					this.velocity = {x: -v, y:0};
					break;
				case 'right': 
				default:
					this.velocity = {x: v, y:0};
					break;
			}

			
			this.buttonEl = $(buttonEl);
			this.scrolledEl = $(scrolledEl);
			
			this.timer = null;

			
			this.buttonEl.addEvent('mouseover', function(){
				if (!this.timer) this.timer = this.scrollIt.periodical(Math.round(1000/this.options.fps), this);
			}.bind(this));
			this.buttonEl.addEvent('mouseout', function(){
				$clear(this.timer);
				this.timer = null; 		
			}.bind(this));
		
		}
	},
	
	scrollIt: function (){
		var scrollPos = this.scrolledEl.getScroll();
		this.scrolledEl.scrollTo(scrollPos.x + this.velocity.x, scrollPos.y + this.velocity.y);
	}
	
});


var cJzScroll = new Class({
	
	Implements: Options,
	options: {
		selector: '.jzscroll',
		velocity: 10
	},
	
	initialize: function(options){
		this.setOptions(options);
		
		$$(this.options.selector).each(function(toScrollEl){
			
			var btnUp 		= new Element('div', {'class': 'jzscroll-btnUp'});
			var btnDown 	= new Element('div', {'class': 'jzscroll-btnDown'});
			var sliderOutter 	= new Element('div', {'class': 'jzscroll-outter'});
			var sliderInner 	= new Element('div', {'class': 'jzscroll-inner'});
			
			sliderInner.adopt(toScrollEl.getChildren());
			btnUp.injectInside(toScrollEl);
			sliderOutter.injectInside(toScrollEl);
			sliderInner.injectInside(sliderOutter);
			btnDown.injectInside(toScrollEl);
						
			var butUp = new cScrollButton(btnUp, sliderOutter, {direction:'up', velocity: this.options.velocity});
			var butDown = new cScrollButton(btnDown, sliderOutter, {direction:'down', velocity: this.options.velocity});
			
			toScrollEl.addEvent('mousewheel', function(e){ // not working in FF3.6 with mootools < 1.2.4
				e = new Event(e); e.stop();
				var scrollPos = sliderOutter.getScroll();
				sliderOutter.scrollTo(0, scrollPos.y - e.wheel*this.options.velocity*2);
			}.bind(this));
			
			
			toScrollEl.jzScrollToElement = function(toElement) {
				if ($(toElement)) {
					var parent = {
						pos: sliderOutter.getPosition(),
						size: sliderOutter.getSize()
					}
					var target = {
						pos: $(toElement).getPosition(),
						size: $(toElement).getSize()
					}
					return sliderOutter.scrollTo(
						target.pos.x - parent.pos.x - (parent.size.x - target.size.x)/2, 
						target.pos.y - parent.pos.y - (parent.size.y - target.size.y)/2
					);
					
					
				}
			};
			
		}, this);
		
	}
	
});


if (MooTools.version.toFloat() < 1.2) { 
	cJzScroll.implement(new Options);
	cScrollButton.implement(new Options);
}