// Serverside vars 
var strRelatedTotalElementsID;
var strRelatedCurrentElementID;
var strPreviousRelatedButtonID;
var strNextRelatedButtonID;

function scroll(strDivScroller, strDivElementID, strTotalElementsContainerID, strCurrentElementContainerID, intMaxElementsVisibleInDiv, strDirection) {
	// Get total and current value object 
	var objTotalElementsContainer = jQuery('#' + strTotalElementsContainerID);
	var objCurrentElementContainer = jQuery('#' + strCurrentElementContainerID);

	// Get next element integer based on direction of scroll 
	if (strDirection == "Left") {
		objCurrentElementContainer.val(parseInt(objCurrentElementContainer.val()) + 1);
		if (objCurrentElementContainer.val() >= (objTotalElementsContainer.val() - intMaxElementsVisibleInDiv) + 1) {
			objCurrentElementContainer.val((objTotalElementsContainer.val() - intMaxElementsVisibleInDiv) + 1);
		}
	} else {
		objCurrentElementContainer.val(parseInt(objCurrentElementContainer.val()) - 1);
		if (objCurrentElementContainer.val() < 1) {
			objCurrentElementContainer.val(1);
		}
	}

	if (objCurrentElementContainer.val() == 1) {
		// Inactivate previous button and activate next
		jQuery('#' + strPreviousRelatedButtonID).removeAttr("class");
		jQuery('#' + strPreviousRelatedButtonID).attr("class", "PreviousRelatedInactive");
		jQuery('#' + strPreviousRelatedButtonID).attr("disabled", "disabled");

		if (objTotalElementsContainer.val() > intMaxElementsVisibleInDiv) {
			jQuery('#' + strNextRelatedButtonID).removeAttr("class");
			jQuery('#' + strNextRelatedButtonID).removeAttr("disabled");
			jQuery('#' + strNextRelatedButtonID).attr("class", "NextRelated");
		}
	} else if (objCurrentElementContainer.val() == (objTotalElementsContainer.val() - intMaxElementsVisibleInDiv) + 1) {
		// Inactivate next button and activate previous
		jQuery('#' + strNextRelatedButtonID).removeAttr("class");
		jQuery('#' + strNextRelatedButtonID).attr("class", "NextRelatedInactive");
		jQuery('#' + strNextRelatedButtonID).attr("disabled", "disabled");

		jQuery('#' + strPreviousRelatedButtonID).removeClass("PreviousRelatedInactive");
		jQuery('#' + strPreviousRelatedButtonID).removeAttr("disabled");
		jQuery('#' + strPreviousRelatedButtonID).addClass("PreviousRelated");
	} else {
		jQuery('#' + strNextRelatedButtonID).removeAttr("class");
		jQuery('#' + strNextRelatedButtonID).removeAttr("disabled");
		jQuery('#' + strNextRelatedButtonID).attr("class", "NextRelated");

		jQuery('#' + strPreviousRelatedButtonID).removeAttr("class");
		jQuery('#' + strPreviousRelatedButtonID).removeAttr("disabled");
		jQuery('#' + strPreviousRelatedButtonID).attr("class", "PreviousRelated");
	}

	// Do scroll animation 
	var divOffset = jQuery('#' + strDivScroller).offset().left;
	var aOffset = jQuery("#" + strDivScroller + " div[id='" + strDivElementID + objCurrentElementContainer.val() + "']").offset().left;
	var aScroll = aOffset - divOffset;
	jQuery('#' + strDivScroller).animate({ scrollLeft: '+=' + aScroll + 'px' }, 200, 'swing');
}

function scrollNextRelated() {
	scroll('RelatedScroller', 'ScrollTo', strRelatedTotalElementsID, strRelatedCurrentElementID, 3, 'Left');
}
function scrollPrevRelated() {
	scroll('RelatedScroller', 'ScrollTo', strRelatedTotalElementsID, strRelatedCurrentElementID, 3, 'Right')
}