var boolScrollAreasInitilized = false;
	
	var strScrollUpIcon = '/\\';
	var strScrollDownIcon = '\\/';
	var strScrollLeftIcon = '<';
	var strScrollRightIcon = '>';
	var strHScrollBarIcon = '<div style="background-color: #ffffff; width: 12px; height: 12px; cursor: move;">&nbsp;</div>';
	var strVScrollBarIcon = '<div style="background-color: #ffffff; width: 12px; height: 12px; cursor: move;">&nbsp;</div>';
	
	var intScrollFactorX = 0.6;
	var intScrollFactorY = 0.6;
	
	var intCurrArea = -1;
	var intCurrScrolling = 0; //0 = both, 1 = vertical, 2 = horizontal
	var aryScrollAreas = null;
		
	function scrollAreaStart(intScrolling)
	{
		intCurrArea++;
		intCurrScrolling = intScrolling;
		
		var intRowspan = 3;
		var intColspan = 3;
		
		if( intCurrScrolling == 1 )
			intColspan = 1;
		else if( intCurrScrolling == 2 )
			intRowspan = 1;
		
		document.write( '<table id="scrollTable' + intCurrArea + '" border="0" cellpadding="0" cellspacing="0" style="width: 100%; height: 100%;">' );
		document.write( '	<tr>' );
		document.write( '		<td rowspan="' + intRowspan + '" colspan="' + intColspan + '" id="scrollContainer' + intCurrArea + '">&nbsp;' );
		document.write( '			<div id="scrollArea' + intCurrArea + '" style="position: absolute; left: -50000; top: -50000; margin: 0px; padding: 0px; clip: rect(0,1,1,0); display: visible;">' );
		
	}
	
	function scrollAreaEnd()
	{
		document.write( '			</div>' );
		document.write( '		</td>' );
		
		if( intCurrScrolling != 2 )
		{
			document.write( '		<td style="vertical-align: top; width: 14px; height: 14px;">' );
			document.write( '			<a id="btnScrollUp' + intCurrArea + '" href="JavaScript:scrollUp(' + intCurrArea + ');">' + strScrollUpIcon + '</a>' );
			document.write( '		</td>' );		
			document.write( '	</tr>' );
			document.write( '	<tr>' );
			document.write( '		<td style="vertical-align: top; width: 14px;">' );
			dragElementStart(intCurrArea, 2);
			document.write( strVScrollBarIcon );
			dragElementEnd();
			document.write( '           </div>' );
			document.write( '		</td>' );
			document.write( '	</tr>' );
			document.write( '	<tr>' );			
			document.write( '		<td style="vertical-align: top; width: 14px; height: 14px;">' );
			document.write( '			<a id="btnScrollDown' + intCurrArea + '" href="JavaScript:scrollDown(' + intCurrArea + ');">' + strScrollDownIcon + '</a>' );
			document.write( '		</td>' );	
		}
		
		document.write( '	</tr>' );
		
		if( intCurrScrolling != 1 )
		{
			document.write( '	<tr>' );
			document.write( '		<td style="text-align: left; height: 14px; width: 14px;">' );
			document.write( '			<a id="btnScrollLeft' + intCurrArea + '" href="JavaScript:scrollLeft(' + intCurrArea + ');">' + strScrollLeftIcon + '</a>' );
			document.write( '		</td>' );
			document.write( '		<td style="background-image: url(\'images/hScrollLine.gif\'); background-repeat: repeat-x;">' );
			dragElementStart(intCurrArea, 1);
			document.write( strHScrollBarIcon );
			dragElementEnd();		
			document.write( '		</td>' );
			document.write( '		<td style="text-align: right; height: 14px; width: 14px;">' );
			document.write( '			<a id="btnScrollRight' + intCurrArea + '" href="JavaScript:scrollRight(' + intCurrArea + ');">' + strScrollRightIcon + '</a>' );
			document.write( '		</td>' );
			
			if( intCurrScrolling != 2 )
			{
				document.write( '		<td>' );
				document.write( '			&nbsp;' );
				document.write( '		</td>' );
			}
			document.write( '	</tr>' );
		}
		
		document.write( '</table>' );
	}

	function scrollDown(intAreaNum)
	{
		doScroll( intAreaNum, 0, aryScrollAreas[intAreaNum][2].height * intScrollFactorX );
	}
	
	function scrollUp(intAreaNum)
	{
		
		doScroll( intAreaNum, 0, aryScrollAreas[intAreaNum][2].height * intScrollFactorX * -1 );
	}
	
	function scrollRight(intAreaNum)
	{
		doScroll( intAreaNum, aryScrollAreas[intAreaNum][2].width * intScrollFactorY, 0 );
	}
	
	function scrollLeft(intAreaNum)
	{
		doScroll( intAreaNum, aryScrollAreas[intAreaNum][2].width * intScrollFactorY * -1, 0 );
	}
	
	function scrollBarDrag(intDragNum, intPercentX, intPercentY)
	{
		var intArea = aryDragInfo[intDragNum];
		
		scrollTo( intArea, intPercentX * (aryScrollAreas[intArea][5] - aryScrollAreas[intArea][2].width), intPercentY * (aryScrollAreas[intArea][6] - aryScrollAreas[intArea][2].height));
	}
	
	function doScroll(intAreaNum, intScrollByX, intScrollByY)
	{
		intScrollByX = aryScrollAreas[intAreaNum][3] + intScrollByX;
		intScrollByY = aryScrollAreas[intAreaNum][4] + intScrollByY;
		
		scrollTo(intAreaNum, intScrollByX, intScrollByY);
	}
	
	function scrollTo(intAreaNum, intOffsetX, intOffsetY)
	{
		var objArea = aryScrollAreas[intAreaNum][0];
		var objContainer = aryScrollAreas[intAreaNum][1];
		var objCurrParentPos = aryScrollAreas[intAreaNum][2];
		
		//intOffsetX = aryScrollAreas[intAreaNum][3] + intOffsetX;
		//intOffsetY = aryScrollAreas[intAreaNum][4] + intOffsetY;
		
		if( objCurrParentPos.width > aryScrollAreas[intAreaNum][5] )
			intOffsetX = 0;
		else
		{
			if( intOffsetX < 0 )
				intOffsetX = 0;
			if( intOffsetX > (aryScrollAreas[intAreaNum][5]-objCurrParentPos.width) )
				intOffsetX = aryScrollAreas[intAreaNum][5]-objCurrParentPos.width;
		}
		
		if( objCurrParentPos.height > aryScrollAreas[intAreaNum][6] )
			intOffsetY = 0;
		else
		{
			if( intOffsetY < 0 )
				intOffsetY = 0;
			if( intOffsetY > (aryScrollAreas[intAreaNum][6]-objCurrParentPos.height) )
				intOffsetY = aryScrollAreas[intAreaNum][6]-objCurrParentPos.height;
		}
		
		aryScrollAreas[intAreaNum][3] = intOffsetX;
		aryScrollAreas[intAreaNum][4] = intOffsetY;
		
		objArea.style.clip='rect(' + (intOffsetY) + 'px ' + 
		                             (objCurrParentPos.width + intOffsetX) + 'px ' + 
									 (objCurrParentPos.height + intOffsetY) + 'px ' + 
									 (intOffsetX) + 'px)';

		objArea.style.left = objCurrParentPos.left - intOffsetX;
		objArea.style.width = objCurrParentPos.width + intOffsetX;
		objArea.style.top = objCurrParentPos.top - intOffsetY;
		objArea.style.height = objCurrParentPos.height + intOffsetY;
	}
		
	function initScrollAreas()
	{
		if( boolScrollAreasInitilized )
			return;
			
		var objCurrArea = null;
		var objParent = null;
		var objCurrParentPos = null;
		var objScrollTable = null;
		
		aryScrollAreas = new Array(intCurrArea+1);
		
		for( i=0 ; i <= intCurrArea ; i++ )
		{
			objCurrArea = getObject( 'scrollArea' + i );
			objParent = getObject( 'scrollContainer' + i );
			objCurrParentPos = getAbsolutePosition( objParent );
			objScrollTable = getObject( 'scrollTable' + i );
						
			aryScrollAreas[i] = new Array(7);
			aryScrollAreas[i][0] = objCurrArea;
			aryScrollAreas[i][1] = objParent;
			aryScrollAreas[i][2] = objCurrParentPos;
			aryScrollAreas[i][3] = 0; //OffsetX
			aryScrollAreas[i][4] = 0; //OffsetY
			aryScrollAreas[i][5] = objCurrArea.offsetWidth; //max OffsetX
			aryScrollAreas[i][6] = objCurrArea.offsetHeight + (objCurrParentPos.height / 2); //max OffsetY;

			if( objCurrParentPos.height > objCurrArea.offsetHeight )
			{
				var objCurrBtn = getObject( 'btnScrollDown' + i );
				if( objCurrBtn != null )
				{
					objCurrBtn.style.display = 'none';
					objCurrBtn = getObject( 'btnScrollUp' + i );
					objCurrBtn.style.display = 'none';
				}
			}
			
			if( objCurrParentPos.width > objCurrArea.offsetWidth )
			{
				var objCurrBtn = getObject( 'btnScrollLeft' + i );
				if( objCurrBtn != null )
				{
					objCurrBtn.style.display = 'none';
					objCurrBtn = getObject( 'btnScrollRight' + i );
					objCurrBtn.style.display = 'none';
				}
			}			

			objCurrArea.style.clip = 'rect(0px ' + objCurrParentPos.width + 'px ' + objCurrParentPos.height + 'px 0px)'
			objCurrArea.style.top = objCurrParentPos.top;
			objCurrArea.style.left = objCurrParentPos.left;
			objCurrArea.style.height = objCurrParentPos.height;
			objCurrArea.style.width = objCurrParentPos.width;
			objCurrArea.style.overflow = 'hidden';
		}
		
		initDrag();
		addDragListener('scrollBarDrag');
		
		boolScrollAreasInitilized = true;
	}