var page = 1;
var scrollStep = 10;
var pageWidth = 520;
var timer;

onLoadAdd("HScrollInit()");

function nextPage() {
	forwardToPage(page+1);
}

function previousPage() {
	rewindToPage(page-1);
}

function goToPage(targetPage) {
	if (targetPage > page) {
		forwardToPage(targetPage);
	} else {
		rewindToPage(targetPage);
	}
}

function forwardToPage(targetPage) {
	var container = document.getElementById("container");
	clearTimeout(timer);
	if (((targetPage-1)*pageWidth) > container.scrollLeft) {
		container.scrollLeft += scrollStep;
		timer = setTimeout("forwardToPage(" + targetPage + ")",5);
	} else {
		page = targetPage;
		updatePageSelector();
	}
}

function rewindToPage(targetPage) {
	var container = document.getElementById("container");
	clearTimeout(timer);
	if (((targetPage-1)*pageWidth) < container.scrollLeft) {
		container.scrollLeft -= scrollStep;
		timer = setTimeout("rewindToPage(" + targetPage + ")",5);
	} else {
		page = targetPage;
		updatePageSelector();
	}
}

function updatePageSelector() {
	var pageSelector = document.getElementById("pageSelector");
	var previousButton = document.getElementById("previousButton");
	var nextButton = document.getElementById("nextButton");
	var totalPages = parseInt(document.getElementById("numberOfPages").innerHTML);
	pageSelector.innerHTML = "";
	
	if (page<=1) {
		page=1;
		if (previousButton != null) {
			previousButton.style.display = "none";
		}
	} else if (previousButton != null) {
		previousButton.style.display = "block";
	}
	
	if (page>=totalPages) {
		page=totalPages;
		if (nextButton != null) {
			nextButton.style.display = "none";
		}
	} else if (nextButton != null) {
		nextButton.style.display = "block";
	}
	
	for (var i=1; i<=totalPages; i++) {
		if (i == page) {
			pageSelector.innerHTML += "<div class=\"pageSelected\">" + i + "</div>";
		} else {
			pageSelector.innerHTML += "<div class=\"pageSelector\" onclick=\"goToPage(" + i + ");\">" + i + "</div>";
		}
	}
	pageSelector.innerHTML += "<div class='clearFloat'></div>";
}

function goBuy(designId) {
	var width = 1000; var height = 800;
	var coords = getCentreCoords(width, height);
	var props = "left=" + coords[0] + ",top=" + coords[1] + ",width=" + width + ",height=" + height + ",scrollbars=yes";
	var win = window.open('loginRedirect?redirectUrl=design.html?designId='+designId+'&siteId=1000', '', props);
	win.focus();


	//alert("You clicked on Buy with index of " + index);
}

function goInfo(designId) {
	var url = "product-information?designId=" + designId;
	document.location.href = url;
}

function HScrollInit()
  {
  	
      settingsOuterContainer = {
          tl: false,
          tr: false,
          bl: { radius: 5 },
          br: { radius: 5 },
          antiAlias: true,
          autoPad: false
	   }
	  
	  settingsPageSelector = {
          tl: false,
          tr: false,
          bl: { radius: 5 },
          br: { radius: 5 },
          antiAlias: true,
          autoPad: false
      }

      var outerContainer = new curvyCorners(settingsOuterContainer, "outerContainer");
      outerContainer.applyCornersToAll();
	  var pageSelector = new curvyCorners(settingsPageSelector, "pageSelectorCurvyCorners");
      pageSelector.applyCornersToAll();
 
	updatePageSelector();
 }