var Slider = Class.create({
	initialize: function (layerId, offset, speed, interval, left_ctr, right_ctr) {
		this.layerId = layerId;
		
		this.offset = offset || 50;
		this.speed = speed || 3;
		this.interval = interval || 100;
		
		this.left_ctr = false;
		this.right_ctr = false;
		if (typeof(left_ctr) != 'undefined' && typeof(right_ctr) != 'undefined') {
			this.left_ctr = left_ctr;
			this.right_ctr = right_ctr;
		}
	},
	init: function () {
		this.layer = $(this.layerId);
		this.xSlide = (this.layer.offsetWidth < this.layer.scrollWidth);
		this.ySlide = (this.layer.offsetHeight < this.layer.scrollHeight);
		if (this.xSlide || this.ySlide)
		{
			this.minX = this.layer.offsetWidth - this.layer.scrollWidth;
			this.maxX = 0;
			this.minY = this.layer.offsetHeight - this.layer.scrollHeight;
			this.maxY = 0;
			
			var myself = this;
			
			if (!this.left_ctr) {
				if (this.layer.captureEvents)
					this.layer.captureEvents(Event.MOUSEMOVE);
				
				this.layer.onmouseover = function () { myself.startSlide(); }
				this.layer.onmouseout = function () { myself.stopSlide(); }
				this.layer.onmousemove = function (e) {	myself.updateTarget(e); }
			}
			else {
				this.left_ctr.onmouseover = function() { 
					myself.targetX = 0;
					myself.targetY = 0;
					myself.startSlide();
				}
				this.left_ctr.onmouseout = function() { myself.stopSlide() }
				
				this.right_ctr.setStyle({visibility:'visible'});
				this.right_ctr.onmouseover = function() {
					myself.targetX = myself.minX;
					myself.targetY = myself.minY;
					myself.startSlide();
				};
				this.right_ctr.onmouseout = function() { myself.stopSlide() }
			}			
			
			this.layer.style.position = 'relative';
			
			var newHTML = '<div id="' + this.layer.id + '_wrapper" style="position:absolute;top:0px;left:0px;">' + this.layer.innerHTML + '</div>';
			this.layer.innerHTML = newHTML;
			
			// reassign text to the wrapper
			this.wrapper = $(this.layer.id + '_wrapper');
		}
	},
	updateTarget: function(e) {
		var posx = 0;
		var posy = 0;
		if (!e) var e = window.event;
		if (e.pageX || e.pageY) {
			posx = e.pageX;
			posy = e.pageY;
		}
		else if (e.clientX || e.clientY) {
			posx = e.clientX + document.body.scrollLeft;
			posy = e.clientY + document.body.scrollTop;
		}
	
		this.targetX = this.offset + (((posx - this.X) / this.layer.offsetWidth) * (this.minX - (this.offset * 2)));
		this.targetY = this.offset + (((posy - this.Y) / this.layer.offsetHeight) * (this.minY - (this.offset * 2)));
	},
	startSlide: function() {
		var offset = this.layer.cumulativeOffset();
		if (this.xSlide)
		{
			this.X = offset.left;
			
			var myself = this;
			this.intervalXId = setInterval(function () { myself.slideX(); }, this.interval);
		}
		
		if (this.ySlide)
		{
			this.Y = offset.top;
			
			var myself = this;
			this.intervalYId = setInterval(function () {  myself.slideY(); }, this.interval);
		}
	},
	stopSlide: function() {
		if (this.intervalXId)
			clearInterval(this.intervalXId);
		if (this.intervalYId)
			clearInterval(this.intervalYId);
	},
	slideX: function() {
		var newX = parseInt(this.wrapper.getStyle('left'));
		newX += (this.targetX - newX) / this.speed;
		this.wrapper.setStyle({left:Math.max(this.minX, Math.min(this.maxX, newX))+'px'});
		
		if (this.left_ctr)
		{
			if (newX <= this.minX)
				this.right_ctr.setStyle({visibility:'hidden'});
			else
				this.right_ctr.setStyle({visibility:'visible'});
				
			if (newX >= this.maxX)
				this.left_ctr.setStyle({visibility:'hidden'});
			else
				this.left_ctr.setStyle({visibility:'visible'});
		}
	},
	slideY: function() {
		var newY = parseInt(this.wrapper.getStyle('top'));
		newY += (this.targetY - newY) / this.speed;
		this.wrapper.setStyle({top:Math.round(Math.max(this.minY, Math.min(this.maxY, newY)))+'px'});
		
		if (this.left_ctr)
		{
			if (newY == this.minY)
				this.left_ctr.hide();
			else
				this.left_ctr.show();
				
			if (newY == this.maxY)
				this.right_ctr.hide();
			else
				this.right_ctr.show();
		}
	}
});