var duration_arrow = 500;
var duration_slide = 500;

function initScroll()
{
	changeScroll();
	
	$(window).resize(function() {
  changeScroll();
	});
	
	$("#arrowright").click(function() {
  moveRight();
	});
	$("#arrowleft").click(function() {
  moveLeft();
	});
}

function changeScroll()
{
	var width = $(window).width();
	var box = $("#columns");
	var ulbox = $("#columns .columns");
	var offset = box.offset().left;
	var arrowright = $("#arrowright");
	var arrowleft = $("#arrowleft");
	
	box.width(width - offset);
	$('#float-width').width(width-24);
	box.css({overflow: 'hidden'});
	
	if((offset + 700) > width)
	{
		arrowright.css('left', (parseInt(box.width()/350)*350) - 42 + offset + 'px');
		if((offset + 330) < width)
		{
			arrowleft.css('left', offset + 290 + 'px');
		}
		else
		{
			arrowleft.css('left', offset - 58 + 'px');
		}
	}
	else
	{
		arrowright.css('left', (parseInt(box.width()/350)*350) - 50 + offset + 'px');
		arrowleft.css('left', offset + 300 + 'px');
	}
	
	if ((width - offset) < (ulbox.width() + parseInt(ulbox.css('marginLeft'))))
	{
		arrowright.fadeIn(duration_arrow);
	}
	else
	{
		arrowright.fadeOut(duration_arrow);
	}
}

function moveRight()
{
	var width = $(window).width();
	var box = $("#columns");
	var ulbox = $("#columns .columns");
	var content_width = ulbox.width();
	var offset = box.offset().left;
	var arrowright = $("#arrowright");
	var arrowleft = $("#arrowleft");
	
	if ((width - offset) >= (content_width + parseInt(ulbox.css('marginLeft'))))
	{
		arrowright.fadeOut(duration_arrow);
	}
	else
	{
		ulbox.animate({marginLeft: (parseInt(ulbox.css('marginLeft')) - 350) + 'px'}, duration_slide, null,
		function (){
			if ((width - offset) >= (content_width + parseInt(ulbox.css('marginLeft'))))
			{
				arrowright.fadeOut(duration_arrow);
			}
		}
		);
	}
	arrowleft.fadeIn(duration_arrow);
}

function moveLeft()
{
	var width = $(window).width();
	var box = $("#columns");
	var ulbox = $("#columns .columns");
	var content_width = ulbox.width;
	var offset = box.offset().left;
	var arrowright = $("#arrowright");
	var arrowleft = $("#arrowleft");
	
	if (parseInt(ulbox.css('marginLeft')) == 0)
	{
		arrowleft.fadeOut(duration_arrow);
	}
	else
	{
		ulbox.animate({marginLeft: (parseInt(ulbox.css('marginLeft')) + 350) + 'px'}, duration_slide, null,
		function (){
			if (parseInt(ulbox.css('marginLeft')) == 0)
			{
				arrowleft.fadeOut(duration_arrow);
			}
		}
		);
	}
	arrowright.fadeIn(duration_arrow);
}