
var currentSlide
var scrollObjList = {}

function initScroll(id)
{
	if(scrollObjList[id])
	{
		scrollObj=scrollObjList[id];
	}
	else
	{
		scrollObjList[id] = scrollObj = document.getElementById(id);
		scrollObj.timeID = null;
	}
	scrollElmList = scrollObj.getElementsByTagName("div");
	for(var i=0;i<scrollElmList.length;i++)
	{
		scrollElm=scrollElmList[i];
		switch(scrollElm.className)
		{
			case "scrollField":
				scrollObj.scrollField = scrollElm;
				scrollObj.scrollContent = scrollElmList[i+1];
				
				scrollElm.style.width = scrollObj.offsetWidth+"px";
				
				// determin width of scrollContent
				scrollObj.scrollContent.style.left="-500px";
				scrollObj.scrollContent.style.width=scrollObj.scrollContent.offsetWidth+"px";
				
				scrollObj.scrollContent.style.left="0px";
				scrollObj.scrollContent.style.top="0px";
				
				scrollElm.id = scrollObj.id;
				scrollElm.onmousewheel = function()
				{
					if(event.wheelDelta<0)
					{
						scrollContents(this.id,"down",wheelStep)
						clearTimeout(scrollObj.timeID);
					}
					else
					{
						scrollContents(this.id,"up",wheelStep)
						clearTimeout(scrollObj.timeID);
					}
					return false;
				}
				break;
			case "scrollBarV":
				scrollObj.scrollBarV = scrollElm;
				scrollElm.id = scrollObj.id;
				if(scrollObj.scrollContent.offsetHeight<=scrollObj.scrollField.offsetHeight)
				{
					scrollObj.scrollField.style.width=scrollObj.scrollField.offsetWidth+"px";
					scrollElm.style.visibility="hidden";
					scrollElm.onmousedown=null;
				}
				else
				{
					scrollElm.style.left=scrollObj.scrollField.offsetWidth-scrollElm.offsetWidth+"px";
					scrollObj.scrollField.style.width=scrollObj.scrollField.offsetWidth-scrollElm.offsetWidth-1+"px";
					scrollElm.style.visibility="visible";
					scrollElm.onmousedown= function(e)
					{
						if(e){
							mY = e.layerY;
							e.cancelBubble=true;
						}
						else
						{
							mY = event.offsetY
							event.cancelBubble=true;
						}
						scrollObj = document.getElementById(this.id);
						if(mY>scrollObj.sliderV.offsetTop)
						{
							scrollContents(this.id,"down",scrollbarStep)
						}
						else
						{
							scrollContents(this.id,"up",scrollbarStep)
						}
						this.onmouseup = this.onmouseleave = function()
						{
							scrollObj = document.getElementById(this.id);
							document.onselectstart = null;
							clearTimeout(scrollObj.timeID);
						}
						document.onselectstart = function()
						{
							return false;	
						}
					}
				}
				break;
			case "buttonUp":
				scrollObj.buttonUp = scrollElm;
				scrollElm.id = scrollObj.id;
				scrollElm.onmousedown=function(e)
				{
					if(e) event = e;
					event.cancelBubble=true;
					scrollContents(this.id,"up")
					this.onmouseup = this.onmouseleave = function()
					{
						scrollObj = document.getElementById(this.id);
						document.onselectstart = null;
						clearTimeout(scrollObj.timeID);
					}
					document.onselectstart = function()
					{
						return false;	
					}
				}
				break;
			case "buttonDown":
				scrollObj.buttonDown = scrollElm;
				scrollElm.id = scrollObj.id;
				scrollElm.onmousedown=function(e)
				{
					if(e) event = e;
					event.cancelBubble=true;
					scrollContents(this.id,"down")
					
					this.onmouseup = this.onmouseleave = function()
					{
						scrollObj = document.getElementById(this.id);
						document.onselectstart = null;
						clearTimeout(scrollObj.timeID);
					}
					document.onselectstart = function()
					{
						return false;	
					}
				}
				break;
			case "sliderV":
				scrollObj.sliderV = scrollElm;
				
				scrollElm.id = scrollObj.id;
				scrollElm.scrollRange = [(scrollObj.buttonUp.offsetTop+scrollObj.buttonUp.offsetHeight),scrollObj.buttonDown.offsetTop];
		
				scrollElm.style.top = scrollElm.scrollRange[0]+"px";
				
				scrollElm.scrollAreaHeight = scrollElm.scrollRange[1]-scrollElm.scrollRange[0];
				
				sliderHeight  = Math.floor((scrollElm.scrollAreaHeight/scrollObj.scrollContent.offsetHeight)*scrollObj.scrollField.offsetHeight)
				scrollElm.style.height = ((sliderHeight<10)?10:sliderHeight)+"px";
				
				scrollElm.scrollRatio = (scrollElm.scrollAreaHeight-scrollElm.offsetHeight)/(scrollObj.scrollContent.offsetHeight-scrollObj.scrollField.offsetHeight);
				
				scrollElm.dragRatio = (scrollObj.scrollContent.offsetHeight-scrollObj.scrollField.offsetHeight)/(scrollElm.scrollAreaHeight-scrollElm.offsetHeight);
				scrollElm.onmousedown = function(e)
				{
					if(e) event = e;
					event.cancelBubble=true;
					
					currentSlide = this;
					mY=event.clientY;
					document.onmousemove = function(e)
					{
						if(e) event = {clientY:e.clientY}
						yPos = mY - event.clientY;
						if(currentSlide.offsetTop-yPos<=currentSlide.scrollRange[0])
						{
							currentSlide.style.top = currentSlide.scrollRange[0]+"px";
						}
						else if(currentSlide.offsetTop-yPos>=currentSlide.scrollRange[1]-currentSlide.offsetHeight)
						{
							currentSlide.style.top = (currentSlide.scrollRange[1]-currentSlide.offsetHeight)+"px";
						}
						else
						{
							currentSlide.style.top = currentSlide.offsetTop-yPos+"px";
						}
					
						document.getElementById(currentSlide.id).scrollContent.style.top=-Math.floor((currentSlide.offsetTop-currentSlide.scrollRange[0])*currentSlide.dragRatio)+"px";
						mY = event.clientY;
						return false;
					}
					document.onmouseup = function()
					{
						document.onmousemove = null;
						document.onselectstart = null;
					}
					document.onselectstart = function()
					{
						return false;	
					}
				}
				break;
				// -----------------------------------------
				case "scrollBarH":
					scrollObj.scrollBarH = scrollElm;
					scrollElm.id = scrollObj.id;
					if(scrollObj.scrollContent.offsetWidth<=scrollObj.scrollField.offsetWidth)
					{
						scrollObj.style.height=scrollObj.scrollField.offsetHeight+"px";
						scrollElm.style.visibility="hidden";
						scrollElm.onmousedown=null;
					}
					else
					{
						scrollElm.style.top = (scrollObj.scrollField.offsetHeight+1)+"px"
						scrollObj.style.height=(scrollObj.offsetHeight+scrollElm.offsetHeight+2)+"px";
						scrollElm.style.visibility="visible";
						scrollElm.onmousedown= function(e)
						{
							if(e){
								e.cancelBubble=true;
								mX = e.layerX;
							}
							else
							{
								event.cancelBubble=true;
								mX = event.offsetX
							}
							scrollObj = document.getElementById(this.id);
							if(mX>scrollObj.sliderH.offsetLeft)
							{
								scrollContents(this.id,"right",scrollbarStep)
							}
							else
							{
								scrollContents(this.id,"left",scrollbarStep)
							}
							
							this.onmouseup = this.onmouseleave = function()
							{
								scrollObj = document.getElementById(this.id);
								document.onselectstart = null;
								clearTimeout(scrollObj.timeID);
							}
							document.onselectstart = function()
							{
								return false;	
							}
						}
					}
					scrollElm.style.width=(scrollObj.scrollField.offsetWidth)+"px";
					break;
				case "buttonLeft":
					scrollObj.buttonLeft = scrollElm;
					scrollElm.id = scrollObj.id;
					scrollElm.onmousedown=function(e)
					{
						if(e) event = e;
						event.cancelBubble=true;
						scrollContents(this.id,"left")
						this.onmouseup = this.onmouseleave = function()
						{
							scrollObj = document.getElementById(this.id);
							document.onselectstart = null;
							clearTimeout(scrollObj.timeID);
						}
						document.onselectstart = function()
						{
							return false;	
						}
					}
					break;
				case "buttonRight":
					scrollObj.buttonRight = scrollElm;
					scrollElm.style.left=(scrollObj.scrollField.offsetWidth-scrollElm.offsetWidth)+"px";
					scrollElm.id = scrollObj.id;
					scrollElm.onmousedown=function(e)
					{
						if(e) event = e;
						event.cancelBubble=true;
						scrollContents(this.id,"right")
						this.onmouseup = this.onmouseleave = function()
						{
							scrollObj = document.getElementById(this.id);
							document.onselectstart = null;
							clearTimeout(scrollObj.timeID);
						}
						document.onselectstart = function()
						{
							return false;	
						}
					}
					break;
				case "sliderH":
				scrollObj.sliderH = scrollElm;
				
				scrollElm.id = scrollObj.id;
				scrollElm.scrollRange = [(scrollObj.buttonLeft.offsetLeft+scrollObj.buttonUp.offsetWidth),scrollObj.buttonRight.offsetLeft];
		
				scrollElm.style.left = scrollElm.scrollRange[0]+"px";
				
				scrollElm.scrollAreaWidth = scrollElm.scrollRange[1]-scrollElm.scrollRange[0];
	
				sliderWidth  = Math.floor((scrollElm.scrollAreaWidth/scrollObj.scrollContent.offsetWidth)*scrollObj.scrollField.offsetWidth)
				scrollElm.style.width = ((sliderWidth<1)?4:sliderWidth)+"px";
				
				scrollElm.scrollRatio = (scrollElm.scrollAreaWidth-scrollElm.offsetWidth)/(scrollObj.scrollContent.offsetWidth-scrollObj.scrollField.offsetWidth);
				
				scrollElm.dragRatio = (scrollObj.scrollContent.offsetWidth-scrollObj.scrollField.offsetWidth)/(scrollElm.scrollAreaWidth-scrollElm.offsetWidth);
				scrollElm.onmousedown = function(e)
				{
					if(e) event = e;
					event.cancelBubble=true;
					currentSlide = this;
					mX=event.clientX;
					document.onmousemove = function(e)
					{
						if(e) event = e;
						event.cancelBubble=true;
						xPos = mX - event.clientX;
						if(currentSlide.offsetLeft-xPos<=currentSlide.scrollRange[0])
						{
							currentSlide.style.left = currentSlide.scrollRange[0]+"px";
						}
						else if(currentSlide.offsetLeft-xPos>=currentSlide.scrollRange[1]-currentSlide.offsetWidth)
						{
							currentSlide.style.left = (currentSlide.scrollRange[1]-currentSlide.offsetWidth)+"px";
						}
						else
						{
							currentSlide.style.left = currentSlide.offsetLeft-xPos+"px";
						}
					
						document.getElementById(currentSlide.id).scrollContent.style.left=-Math.floor((currentSlide.offsetLeft-currentSlide.scrollRange[0])*currentSlide.dragRatio)+"px";
						mX = event.clientX;
						return false;
					}
					document.onmouseup = function()
					{
						document.onmousemove = null;
						document.onselectstart = null;
					}
					document.onselectstart = function()
					{
						return false;	
					}
				}
				break;
		}
	}
}

var defaultStep = 13;
var wheelStep = 26;
var scrollbarStep = 52;
function scrollContents(id,dir,scrollStep)
{
	if(!scrollStep) scrollStep=defaultStep;
	var scrollObj = document.getElementById(id);
	clearTimeout(scrollObj.timeID);
	switch(dir)
	{
		case "up":				
			if(scrollObj.scrollContent.offsetTop+scrollStep<0)
			{
				scrollObj.scrollContent.style.top=(scrollObj.scrollContent.offsetTop+scrollStep)+"px";
			}
			else
			{
				scrollObj.scrollContent.style.top="0px"
				clearTimeout(scrollObj.timeID);
			}
			break;
		case "down":				
			if(scrollObj.scrollContent.offsetTop-scrollStep>(-scrollObj.scrollContent.offsetHeight+scrollObj.scrollField.offsetHeight))
			{
				scrollObj.scrollContent.style.top=(scrollObj.scrollContent.offsetTop-scrollStep)+"px";
			}
			else
			{
				scrollObj.scrollContent.style.top=(-scrollObj.scrollContent.offsetHeight+scrollObj.scrollField.offsetHeight)+"px"
				clearTimeout(scrollObj.timeID);
			}
			break;
		case "left":				
			if(scrollObj.scrollContent.offsetLeft+scrollStep<0)
			{
				scrollObj.scrollContent.style.left=(scrollObj.scrollContent.offsetLeft+scrollStep)+"px";
			}
			else
			{
				scrollObj.scrollContent.style.left="0px"
				clearTimeout(scrollObj.timeID);
			}
			break;
		case "right":				
			if(scrollObj.scrollContent.offsetLeft-scrollStep>(-scrollObj.scrollContent.offsetWidth+scrollObj.scrollField.offsetWidth))
			{
				scrollObj.scrollContent.style.left=(scrollObj.scrollContent.offsetLeft-scrollStep)+"px";
			}
			else
			{
				scrollObj.scrollContent.style.left=(-scrollObj.scrollContent.offsetWidth+scrollObj.scrollField.offsetWidth)+"px"
				clearTimeout(scrollObj.timeID);
			}
			break;
		
	}
	switch(dir)
	{
		case "up":				
		case "down":
			scrollObj.sliderV.style.top = scrollObj.sliderV.scrollRange[0]+Math.floor(-scrollObj.scrollContent.offsetTop*scrollObj.sliderV.scrollRatio)+"px";
			break;
		case "left":				
		case "right":
			scrollObj.sliderH.style.left = scrollObj.sliderH.scrollRange[0]+Math.floor(-scrollObj.scrollContent.offsetLeft*scrollObj.sliderH.scrollRatio)+"px";
			break;
	}
	
	scrollObj.timeID = setTimeout("scrollContents(\""+id+"\",\""+dir+"\","+scrollStep+")",40);
}
