// JavaScript Document

// Setup some base variables
pagePath = "../html/";
pageBaseName = "webtura-web-graphic-design-";
pageTypeSuffix = "-portfolio-page-";
pageSuffix = ".html";
buttonPath = "../graphics/portfolio-number-buttons/";
buttonPrefix = "webtura-web-graphic-design-portfolio-number-";
buttonActive = "active-";
buttonInactive = "inactive-";
activeButtonBasename = buttonPath + buttonPrefix + buttonActive;
inactiveButtonBasename = buttonPath + buttonPrefix + buttonInactive;
buttonImageTypeSuffix = ".jpg";
numPages = 9;
activeButtons = new Array();
inactiveButtons = new Array();

function preLoadImages() {
	for(i=1;i <= numPages;i++) {
		activeButtonURL = activeButtonBasename + i + buttonImageTypeSuffix;
		activeButtons[i] = new Image(20,20);
		activeButtons[i].src = activeButtonURL;
		inactiveButtonURL = inactiveButtonBasename + i + buttonImageTypeSuffix;
		inactiveButtons[i] = new Image(20,20);
		inactiveButtons[i].src = inactiveButtonURL;
	}
}

function generatePageSelector(pageNum,pageType) {
	for(i = 1;i <= numPages;i++) {
		if(i == pageNum) {
			// Static image for page number
			generateStaticPageNumber(i);
		}
		else {
			generatePageNumberRollover(i,pageType);
		}
	}
}

function generateStaticPageNumber(pageNum) {
	activeButtonURL = activeButtonBasename + pageNum + buttonImageTypeSuffix;
	document.write("<img src='" + activeButtonURL + "' />");
}

function generatePageNumberRollover(pageNum,pageType) {
	buttonName = "pageButton" + pageNum;
	inactiveButtonURL = inactiveButtonBasename + pageNum + buttonImageTypeSuffix;
	pageURL = pagePath + pageBaseName + pageType + pageTypeSuffix + pageNum + pageSuffix;
	document.write("<a href='" + pageURL + "' onMouseover='activateButton(" + pageNum + ")' onMouseout='deactivateButton(" + pageNum + ")'>");
	document.write("<img src='" + inactiveButtonURL + "' name='" + buttonName + "' border='0'>");
	document.write("</a>");
}

function activateButton(buttonNum) {
	buttonName = "pageButton" + buttonNum;
	document[buttonName].src = activeButtons[buttonNum].src;
}

function deactivateButton(buttonNum) {
	buttonName = "pageButton" + buttonNum;
	document[buttonName].src = inactiveButtons[buttonNum].src;
}

//<A HREF="index.html" onMouseover="lightup('pic1')" onMouseout="turnoff('pic1')">
//<IMG SRC="../images/shoes1.gif" name="pic1" width="100" height="25" border="0"></A>