

var ScrollWindow = Class.create();

ScrollWindow.prototype = {
	
	linkList:null,
	contentList:null,
	initialItem:null,
	viewingWindow:null,
	scrollLeftArrow:null,
	scrollRightArrow:null,
	titleLabel:null,
	selectionBackground:null,
	
	listLength:null,
	farLeft:null,
	farRight:null,
	viewportLength:null,
	
	scrollLength:null,
	scrollDuration:null,
	scrollFastDuration:null,
	scrollType:Effect.Transitions.linear,
	pixelsPerSecond:165,
	
	scrollEffect:null,
	activeContent:null,
	
	contentEffectIn:Effect.SlideDown,
	contentEffectOut:Effect.Fade,
	contentEffectInOptions:null,
	contentEffectOutOptions:null,
	contentEffectDuration:0.3,
	contentEffectQueue:'content',
	
	linkIdPrefix:'link',
	contentIdprefix:'content',
	
	shouldHighlightArrows:true,

	//////////////// getters & setters //////////////////////
	
	get_linkList:function () { return this.linkList; },
	get_contentList:function() { return this.contentList; },
	get_initialItem:function() { return this.initialItem; },
	get_viewingWindow:function() { return this.viewingWindow; },
	get_scrollLeftArrow:function() { return this.scrollLeftArrow; },
	get_scrollRightArrow:function() { return this.scrollRightArrow; },
	get_titleLabel:function() { return this.titleLabel; },
	
	set_linkList:function(value) { this.linkList=value; },
	set_contentList:function(value) { this.contentList=value; },
	set_initialItem:function(value) { this.initialItem=value; },
	set_viewingWindow:function(value) { this.viewingWindow=value; },
	set_scrollLeftArrow:function(value) { this.scrollLeftArrow=value; },
	set_scrollRightArrow:function(value) { this.scrollRightArrow=value; },
	set_titleLabel:function(value) { this.titleLabel=value; },
	
	
	////////////////////////////////////////////////
	initialize:function (list,larrow,rarrow,content,visibleWindow,titleObj,firstItem, selectionBkgd)
	{
		this.linkList=list;
		this.scrollLeftArrow=larrow;
		this.scrollRightArrow=rarrow;
		this.contentList=content;
		this.viewingWindow=visibleWindow;
		this.titleLabel=titleObj;
		this.initialItem=firstItem;
		this.selectionBackground=selectionBkgd;
		
		this.linkList._scrollWindowObject=this;
	},
		
	/////////////////////// initialize methods /////////////////////////
	initializeObjects: function ()
	{
		
		this.initScrollEffect();
		this.initScrollArrows();
		this.initLinks();
		this.initContent();
		if(this.shouldHighlightArrows)this.HighlightArrows();

		this.timelineItem_click(this.initialItem); 
	},
	initScrollArrows:function()
	{
		this.scrollLeftArrow._scrollWindowObject=this;
		this.scrollRightArrow._scrollWindowObject=this;
		
		if(this.scrollRightArrow==null)this.scrollRightArrow=$(this.scrollRightArrowId);
		this.scrollRightArrow.onclick=function() 
		{ 
			if (this._scrollWindowObject != null)
				this._scrollWindowObject.rightArrow_click(); 
		}
		this.scrollRightArrow.onmouseover=function() 
		{ 
			if (this._scrollWindowObject != null)
				this._scrollWindowObject.rightArrow_mouseover(); 
		} 
		this.scrollRightArrow.onmouseout=function() 
		{ 
			if (this._scrollWindowObject != null)
				this._scrollWindowObject.rightArrow_onmouseout(); 
		} 

		if(this.scrollLeftArrow==null)this.scrollLeftArrow=$(this.scrollLeftArrowId);
		this.scrollLeftArrow.onclick=function() 
		{ 
			if (this._scrollWindowObject != null)
				this._scrollWindowObject.leftArrow_click(); 
		}
		this.scrollLeftArrow.onmouseover=function() 
		{ 
			if (this._scrollWindowObject != null)
				this._scrollWindowObject.leftArrow_mouseover(); 
		} 
		this.scrollLeftArrow.onmouseout=function() 
		{ 
			if (this._scrollWindowObject != null)
				this._scrollWindowObject.leftArrow_onmouseout(); 
		} 
	},
	initScrollEffect:function()
	{
		this.viewportLength = parseFloat(this.viewingWindow.getStyle('width')) || this.viewingWindow.offsetWidth;
		this.listLength = parseFloat(this.linkList.getStyle('width')) || this.linkList.offsetWidth;
		
		this.farLeft=-this.listLength + this.viewportLength;
		this.farRight=0;
		
		this.scrollLength=this.farRight-this.farLeft;
		
		this.scrollDuration=this.scrollLength/this.pixelsPerSecond;
		this.scrollFastDuration=this.scrollDuration/7;
	},
	initLinks:function() { 
		var items = this.linkList.descendants();
		for(i=0;i<items.length;i++)
			if(this.isLinkItem)
				if(this.isLinkItem(items[i]))
				{
					this.AddLinkAttributes(items[i]);
				}
	},
	initContent:function() {
		var items = this.contentList.descendants();
		for(i=0;i<items.length;i++)
			if(this.isContentItem)
				if(this.isContentItem(items[i]))
					this.AddContentAttributes(items[i]);
	},
	
	
	
	
	
	////////////////////// events ////////////////////////////
	leftArrow_mouseover:function() { this.scrollLeft(this.linkList); },
	leftArrow_onmouseout:function() { this.cancelEffect(this.linkList); this.cancelEffect(this.selectionBackground); },
	rightArrow_mouseover:function() { this.scrollRight(this.linkList);  },
	rightArrow_onmouseout:function() { this.cancelEffect(this.linkList); this.cancelEffect(this.selectionBackground); },
	
	leftArrow_click:function(sender)
	{
		var oldDuration = this.scrollDuration;
		this.scrollDuration=this.scrollFastDuration;
		this.scrollLeft(this.linkList)
		this.scrollDuration=oldDuration;
	},
	rightArrow_click:function(sender)
	{
		var oldDuration = this.scrollDuration;
		this.scrollDuration=this.scrollFastDuration;
		this.scrollRight(this.linkList)
		this.scrollDuration=oldDuration;
	},
	timelineItem_click:function(sender)
	{
		this.MoveSelectionBackground(sender,sender.parentNode.offsetLeft);
		var newId = this.getContentIdByLinkId(sender.id);
		
		if(this.activeContent!=null) this.FadeItem(this.activeContent);
		
		this.set_TitleText(sender.title);
		this.activeContent = $(newId)
		
		this.AppearItem(this.activeContent);

},
	
	
	
	//getLinkContent
	
	
	/////////////////////////// effects //////////////////////////////
	MoveSelectionBackground:function(target, finalLocation)
	{
		
		var effectDuration = 0.5;
		var effectTransition = Effect.sinoidal;
		var efx = new Effect.Move (this.selectionBackground,{ x: finalLocation,  mode: 'absolute', duration: effectDuration, transition:effectTransition}); 

		if(target!=null) {
			this.selectionBackground.style.height = this.getHeight(target) + 'px';
			this.selectionBackground.style.width = target.offsetWidth + 'px';
			target._currenteffect=efx;
		}
	},
	getHeight:function(target)
	{
		if(target==null) return 0;
		var height = target.offsetHeight;

		var lineHeight = 13;	/* mindless work around for IE 6 */
		if (target.getStyle)
			lineHeight = parseFloat(target.getStyle('lineHeight'));
		return height + lineHeight; 
	},
	
	
	scrollLeft:function(target) 
	{ 
		var remainingDistance=this.viewOffset();
		var newDuration = remainingDistance * this.scrollDuration / this.scrollLength;
		
		this.cancelEffect(target);
		target._currentEffect=new Effect.Move (target,{ x: this.farRight,  mode: 'absolute', duration: newDuration, transition: this.scrollType}); 
		
	},
	scrollRight:function(target) 
	{ 
									
									
		var remainingDistance=this.listLength-this.viewOffset();
		var newDuration = remainingDistance * this.scrollDuration / this.scrollLength;
		
		this.cancelEffect(target);
		target._currentEffect=new Effect.Move (target,{ x: this.farLeft,  mode: 'absolute', duration: newDuration, transition: this.scrollType}); 
	},
	
	ShowItem:function(target) { target.style.display='';  },
	HideItem:function(target) { target.style.display='none';  },
	
	FadeItem:function(target) { 
		if(target==null) return;
		var defaultOptions = {duration:this.contentEffectDuration,queue:{position:'front',scope:this.contentEffectQueue}};
		this.cancelEffect(target);
		target._currentEffect=new this.contentEffectOut(target, Object.extend(defaultOptions,this.contentEffectOutOptions || {})); 
	},
	
	AppearItem:function(target) { 
		var defaultOptions = {duration:this.contentEffectDuration,queue:{position:'end',scope:this.contentEffectQueue}};
		this.cancelEffect(target);
		target._currentEffect=new this.contentEffectIn(target, Object.extend(defaultOptions,this.contentEffectInOptions || {})); 
	},
	
	cancelEffect:function(target) { if(target._currentEffect!=null)target._currentEffect.cancel(); },
	
	
	
	
	//////////////////////////// misc ///////////////////////////////////
	getContentIdByLinkId:function(linkId) { return this.contentIdprefix + linkId.replace(this.linkIdPrefix,''); },
	isLinkItem:function(target) { return (target.tagName=='A'); },
	isContentItem:function(target) { return (target.tagName=='LI'); },

	AddLinkAttributes:function(target) { 
		target._scrollWindowObject=this;
		target.onclick=function(){ this._scrollWindowObject.timelineItem_click(target); } 
	},
	AddContentAttributes:function(target) { 
		target._scrollWindowObject=this;
		this.HideItem(target); 
	},
	
	HighlightArrows:function()
	{
		
		var effectDuration = 6;
		var minOpacity = 0.3;
		var numPulses = 10;
		var transitionType = Effect.Transitions.linear
		
		new Effect.Pulsate(this.scrollLeftArrow,{duration:effectDuration, from:minOpacity, pulses:numPulses, transition: transitionType});
		new Effect.Pulsate(this.scrollRightArrow,{duration:effectDuration, from:minOpacity, pulses:numPulses, transition: transitionType});
	},
	
	viewOffset:function() { return -1 * this.linkList.offsetLeft; },
	
	set_TitleText:function(value) { this.titleLabel.innerHTML=value; }

}

////////////////////////////////Friend functions/////////////////////////////////////
function getStyle(oElm, strCssRule){
	var strValue = "";
	if(document.defaultView && document.defaultView.getComputedStyle){
		strValue = document.defaultView.getComputedStyle(oElm, "").getPropertyValue(strCssRule);
	}
	else if(oElm.currentStyle){
		strCssRule = strCssRule.replace(/-(w)/g, function (strMatch, p1){
			return p1.toUpperCase();
		});
		strValue = oElm.currentStyle[strCssRule];
	}
	return strValue;
}
