var slidebox;

Event.observe(window, 'load', 
	function() 
	{
		if($('slidebox') && $('news_holder').visible())
		{
			slidebox = new SlideBoxV(5, 70);
		}
	}
);

function SlideBoxV(elementsToMove, duration)
{
	this.box              = $('slidebox');
	this.clip             = $('slidebox_clip');
	this.topNav           = $('slidebox_top');
	this.bottomNav        = $('slidebox_bottom');
	this.selectedElement;
	
	this.active           = false;
	this.duration         = duration;
	this.topDirection     = 1;
	this.bottomDirection  = -1;
	this.moveTolerance    = 5;
	this.actualTime       = 0;
	this.shiftMade        = 0;
	
	this.elementsToMove   = elementsToMove;
	this.boxHeight        = this.box.getHeight();
	this.clipHeight       = this.getElementHeight(this.clip);
 	this.elements         = this.clip.childElements(); 
	this.elementHeight    = this.getElementHeight(this.elements[0]);
	this.maxShift         = this.elementHeight * this.elementsToMove;
	this.elementsInView   = Math.round(this.boxHeight / this.elementHeight);
	
	this.createNavigation()
	    .findSelectedElement()
	    .moveToSelectedElement();	
} 


SlideBoxV.prototype.createNavigation = function (element)
{
	Event.observe(this.topNav.id, 'click', this.slideTop.bindAsEventListener(this));
	Event.observe(this.bottomNav.id,'click', this.slideBottom.bindAsEventListener(this));
	this.topNav.href  = 'javascript:;';
	this.bottomNav.href = 'javascript:;';
	return this;
}

SlideBoxV.prototype.findSelectedElement = function()
{
	this.selectedElement = $$('#slidebox_clip .selected').first();
	return this;
}

SlideBoxV.prototype.moveToSelectedElement = function ()
{
	if(this.selectedElement)
	{
		var top = this.getClipTopStyle();
		if(this.selectedElement.offsetTop < (-1 * top) || this.selectedElement.offsetTop > (this.boxHeight - top))
		{
			var shift = this.selectedElement.offsetTop + this.maxShift - this.boxHeight;
			shift = Math.round(shift / this.elementHeight) * this.elementHeight;
			shift = Math.min(shift, this.clipHeight - this.boxHeight);
			shift = Math.min(0, -shift);
			this.setClipTopStyle(shift);
		}
		
	}
	this.toggleButtons();
	return this;
}

SlideBoxV.prototype.setClipTopStyle = function(top)
{
	this.clip.style.top = Math.round(top) + 'px';
}

SlideBoxV.prototype.getClipTopStyle = function()
{
	var top = parseInt(this.clip.style.top);
	return top ? top : 0;
}

SlideBoxV.prototype.getElementHeight = function(element)
{
	var width = 0;
	if(element)
	{
		width += element.getHeight();
		width += parseInt(element.getStyle('margin-top'));
		width += parseInt(element.getStyle('margin-bottom'));
	}
	return width;
}

SlideBoxV.prototype.run = function (direction)
{
	if(!this.active)
	{
		this.actualTime = 0;
		this.shiftMade  = 0;
		this.direction  = direction;
		this.active     = true;
		if(this.direction == this.topDirection)
		{
			this.shift = -1 * parseInt(this.clip.getStyle('top'));
		}
		else if(this.direction == this.bottomDirection)
		{
			this.shift = this.clipHeight + parseInt(this.clip.getStyle('top')) - this.boxHeight;			
		}
		this.shift = Math.min(this.shift, this.maxShift);		
		this.slide();
	}
}


SlideBoxV.prototype.previousElement = function(linkObj)
{
	this.moveToSelectedElement();
	if(this.isSelectedFirst())
	{
		this.returnUrl = linkObj.href;
		this.run(this.topDirection);
		return false;
	}
	return true;
}

SlideBoxV.prototype.nextElement = function(linkObj)
{
	this.moveToSelectedElement();
	if(this.isSelectedLast())
	{
		this.returnUrl = linkObj.href;
		this.run(this.bottomDirection);	
		return false;
	}
	return true;
}

SlideBoxV.prototype.slideTop = function()
{
	this.run(this.topDirection);
}

SlideBoxV.prototype.slideBottom = function()
{
	this.run(this.bottomDirection);	
}
SlideBoxV.prototype.isSelectedFirst = function()
{
	if(this.selectedElement)
	{
		var top = this.getClipTopStyle();
		return this.selectedElement.offsetTop + top <= this.moveTolerance;
	}
	return false;
}

SlideBoxV.prototype.isSelectedLast = function()
{
	if(this.selectedElement)
	{
		var top = this.getClipTopStyle();
		return this.selectedElement.offsetTop == -top + (this.elementsInView - 1) * this.elementHeight;
	}
	return false;
}



SlideBoxV.prototype.slide = function()
{
	if(this.shiftMade == this.shift)
	{
		this.active = false;
		this.toggleButtons();
		if(this.returnUrl)
		{
			location.href = this.returnUrl;
			this.returnUrl = null;
		}
		return;
	}

	var offset  = this.calculateOffset(this.shift);
	this.shiftMade += offset; 
	this.actualTime++;
		
	var top = this.getClipTopStyle();
	var move = top + this.direction * offset;
	this.setClipTopStyle(move);
	setTimeout(this.slide.bindAsEventListener(this), 1);
}



SlideBoxV.prototype.calculateOffset = function(length)
{
	if(this.actualTime == this.duration)
		return 1;
		
	return Math.round(Easing.easeOutQuad(this.actualTime, 0, length, this.duration)) - this.shiftMade;	
}

SlideBoxV.prototype.toggleButtons = function()
{
	var top = this.getClipTopStyle();
	
	if(top == 0 || this.elements.length == 0)
	{
		this.topNav.hide();	
	}
	else
	{
		this.topNav.show();	
	}
	
	if(this.boxHeight - top >= this.clipHeight || this.elements.length == 0)
	{
		this.bottomNav.hide();	
	}
	else
	{
		this.bottomNav.show();;	
	}
	return this;
}