﻿/*
@author Ivo Yankulovski
*/

var isIE8=(navigator.userAgent.toLowerCase().indexOf('msie 8') != -1);

function initHScroller(scrollpane, scrollLeft, scrollRight, clipArray, step, initX)
{
	var scrollpanes=$(scrollpane);
	var scrollLefts=$(scrollLeft);
	var scrollRights=$(scrollRight);
	var l=scrollpanes.length;
	
	for(var i=0;i<l;i++)
	{
		var scrollpaneObject=$(scrollpanes.get(i));
		scrollpaneObject.css('clip', arrayToCSSClipRect(clipArray));
		var width=0;
		
		var children=scrollpaneObject.children();
		var chl=children.length;
		//var step=0;
		
		if (chl>0)
		{
			//step=32;//$(children.get(0)).outerWidth(); //chrome causes errors when getting this property, use constant instead
			width=chl*step;
		}
		
		var cssClipRect=scrollpaneObject.css('clip');
		var clipRect=cssClipRectToObject(cssClipRect);
		
		var scrollLeftObject=$(scrollLefts.get(i));
		var scrollRightObject=$(scrollRights.get(i));
		
		var scrollVars={
						x:initX,//parseInt(scrollpaneObject.css('left')), //chrome causes errors when getting this property, use constant instead
						width: width, 
						maxWidth: clipRect.right, 
						height: clipRect.bottom, 
						step: step, 
						scroll: 0, 
						maxScroll: width<clipRect.right ? 0 : width-clipRect.right,
						leftScroller: scrollLeftObject,
						rightScroller: scrollRightObject
						};
		
		var visible=Math.floor(scrollVars.maxWidth/step);
		
		scrollpaneObject.css('width', width+step);//+step ??? somehow fixes the div scroll issues in ie and chrome, leave it there
		
		
		$.data(scrollpaneObject, 'scrollVars', scrollVars);
		$.data(scrollLeftObject.get(0), 'scrollVars', {target:scrollpaneObject, step: -visible*step});
		$.data(scrollRightObject.get(0), 'scrollVars', {target:scrollpaneObject, step: visible*step});
		
		function scrollLeftMethod()
		{
			var scrollVars=$.data(this, 'scrollVars');
			scroll(scrollVars.target, scrollVars.step);
		}
		
		function scrollRightMethod()
		{
			var scrollVars=$.data(this, 'scrollVars');
			scroll(scrollVars.target, scrollVars.step);
		}
		
		scroll(scrollpaneObject, 0);
		scrollLeftObject.click(scrollLeftMethod);
		scrollRightObject.click(scrollRightMethod);
	}
}

function cssClipRectToObject(cssClipRect)
{
	var separator=' ';
	if (isIE8)
		separator=',';
	cssClipRect=cssClipRect.split('rect(')[1].split(')')[0].split(separator);
	var clipRect={top:parseInt(cssClipRect[0]), right:parseInt(cssClipRect[1]), bottom:parseInt(cssClipRect[2]), left:parseInt(cssClipRect[3])}
	
	return clipRect;
}

function arrayToCSSClipRect(array)
{
	var css;
	var separator=' ';
	if (isIE8)
		separator=',';
	css='rect('+array[0]+'px'+separator+array[1]+'px'+separator+array[2]+'px'+separator+array[3]+'px)';
	
	return css;
}

function scroll(target, value)
{
	var scrollVars=$.data(target, 'scrollVars');
	scrollVars.scroll=Math.max(0, Math.min(scrollVars.scroll+value, scrollVars.maxScroll));
	var left=scrollVars.x-scrollVars.scroll;
	var clip=arrayToCSSClipRect([0, scrollVars.maxWidth+scrollVars.scroll, scrollVars.height, scrollVars.scroll]);
	target.stop();
	
	target.animate({'left': left, 'clip': clip}, {'duration': 400});
	
	scrollVars.leftScroller.hide();
	scrollVars.rightScroller.hide();
	if (scrollVars.scroll>0)
		scrollVars.leftScroller.show();
	if (scrollVars.scroll<scrollVars.maxScroll)
		scrollVars.rightScroller.show();
}
