var lastImage
var lastBook
var lastPage=0
var curPage=1
var theCat=""
var theSlices = new Array()

function swapImg(theSuf, rev) {
	if (rev == 1) {
		theSrc = "images/satoSlice"+theSuf+".jpg"
	} else {	
		theSrc = "images/satoSliceRed"+theSuf+".jpg"
	}
	document.getElementById("satoSlice"+theSuf).src = theSrc
}

function firstRun(cat) {
	theCat = cat
	sliceLoader()
	if (cat=="sketch") {
		sketchThumbLoader(1, "", cat)
	} else {
		thumbLoader(0, cat)
	}
	
	if (cat=="illustration") {
		document.getElementById("titleCard").style.top = "130px"
	}
}

function sliceLoader() {
	//preload rollover slices
	j=0
	for (i=2; i<20; i++) {
		if (i*2<10) {
			thePre = "0"+i*2
		} else {
			thePre = i*2
		}
		theSlices[j] = new Image()
		theSlices[j].src = "images/satoSliceRed_"+thePre+".jpg"
		j++
	}
}

function thumbLoader(start, cat) {

	xmlHttp=GetXmlHttpObject()

	if (xmlHttp==null) {
		alert ("Browser does not support HTTP Request")
		return
	} 

	url="robThumbLoader.php"
	url+="?start="+start
	url+="&cat="+cat
	url+="&sid="+Math.random()
	xmlHttp.onreadystatechange=stateChanged
	xmlHttp.open("GET",url,true)
	xmlHttp.send(null)
}

function imageLoader(imgID) {

	xmlHttp2=GetXmlHttpObject()

	if (xmlHttp2==null) {
		alert ("Browser does not support HTTP Request")
		return
	} 

	url="robImageLoader.php"
	url+="?imgID="+imgID
	url+="&cat="+theCat
	url+="&sid="+Math.random()
	xmlHttp2.onreadystatechange=stateChanged2
	xmlHttp2.open("GET",url,true)
	xmlHttp2.send(null)
}

function bookLoader(imgID) {

	xmlHttp3=GetXmlHttpObject()

	if (xmlHttp3==null) {
		alert ("Browser does not support HTTP Request")
		return
	} 

	url="robBookLoader.php"
	url+="?imgID="+imgID
	url+="&cat="+theCat
	url+="&sid="+Math.random()
	xmlHttp3.onreadystatechange=stateChanged3
	xmlHttp3.open("GET",url,true)
	xmlHttp3.send(null)
}

function sketchThumbLoader(first, theID, cat) {

	xmlHttp4=GetXmlHttpObject()

	if (xmlHttp4==null) {
		alert ("Browser does not support HTTP Request")
		return
	} 

	url="robSketchThumbLoader.php"
	url+="?first="+first
	url+="&theID="+theID
	url+="&cat="+cat
	url+="&sid="+Math.random()
	xmlHttp4.onreadystatechange=stateChanged4
	xmlHttp4.open("GET",url,true)
	xmlHttp4.send(null)
}

function stateChanged() {
	if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete") {
		theStr = xmlHttp.responseText
		theArray = theStr.split(",")
		if (theCat == "comix") {
			document.getElementById("comixThumbs").innerHTML=theArray[0]
		} else {
			document.getElementById("satoSlice-31_").innerHTML=theArray[0]
		}
		if (theCat == "illustration" || theCat == "art") {	
			lastImage = theArray[1]
			imageLoader(theArray[1])
		} else {
			lastBook = theArray[1]
			bookLoader(theArray[1])
		}
		pageCount = Math.ceil(parseInt(theArray[2])/16)
		theStart = parseInt(theArray[3])
		numberLinks="Pages: "
		for (i=1; i<=pageCount; i++) {
			if (i!=pageCount) {
				sep = ", "
			} else {
				sep = ""
			}
			if (i==curPage) {
				numberLinks += "<span class='currentPage'>"+i+"</span>"+sep
			} else {
				numberLinks += "<a href='#' onmouseup='gotoPage("+i+")'>"+i+"</a>"+sep
			}
		}
		if (pageCount > 1) {
			document.getElementById("pageNums").innerHTML = numberLinks
		} else {
			document.getElementById("pageNums").innerHTML = ""
		}
	}
}

function stateChanged2() {
	if (xmlHttp2.readyState==4 || xmlHttp2.readyState=="complete") {
		if (theCat=="sketch") {
			makeFrameLoadSketch(xmlHttp2.responseText)
		} else {
			makeFrameLoadImage(xmlHttp2.responseText)	
		}
	}
}

function stateChanged3() {
	if (xmlHttp3.readyState==4 || xmlHttp3.readyState=="complete") {
		makeFrameLoadBook(xmlHttp3.responseText)
	}
}

function stateChanged4() {
	if (xmlHttp4.readyState==4 || xmlHttp4.readyState=="complete") {
		theStr = xmlHttp4.responseText
		theArray = theStr.split(",")
		document.getElementById("satoSlice-31_").innerHTML=theArray[0]
		
		lastImage = theArray[1]
		imageLoader(theArray[1])
	}
}

function GetXmlHttpObject() {
	
	var objXMLHttp=null
	try
	 {
	 // Firefox, Opera 8.0+, Safari
	 objXMLHttp=new XMLHttpRequest();
	 }
	catch (e)
	 {
	 //Internet Explorer
	 try
	  {
	  objXMLHttp=new ActiveXObject("Msxml2.XMLHTTP");
	  }
	 catch (e)
	  {
	  objXMLHttp=new ActiveXObject("Microsoft.XMLHTTP");
	  }
	 }
	/*
	var objXMLHttp=null
	
	if (window.XMLHttpRequest) {
		objXMLHttp=new XMLHttpRequest()
	} else if (window.ActiveXObject) {
		objXMLHttp=new ActiveXObject("Microsoft.XMLHTTP")
	}
	*/
	return objXMLHttp
	
}

function loadImage(theID, book) {
	if (book) {
		document.getElementById("bookDetailTitle").innerHTML = "<a href='#' id='"+lastBook+"' 'onmouseup='loadBook(this.id)'>Book Details</a>"
		document.getElementById("sampleTitle").innerHTML = "Sample(s)"
		document.getElementById("sampleTitle").style.color = "#E14642"
		
		if (lastImage) document.getElementById(lastImage).style.color = "#B8D8CD"
		
		document.getElementById(theID).style.color = "#E14642"
	} else {
		document.getElementById("chosenThumb").id="thumb"+lastImage
		document.getElementById("thumb"+theID).id="chosenThumb"
	}
	
	lastImage=theID
	imageLoader(theID)
}

function loadBook(theID) {
	document.getElementById("chosenThumb").id="thumb"+lastBook
	document.getElementById("thumb"+theID).id="chosenThumb"
	document.getElementById("comicTitleChosen").id="comicTitle"+lastBook
	document.getElementById("comicTitle"+theID).id="comicTitleChosen"
	lastBook=theID
	lastImage=""
	bookLoader(theID)
}

function loadSketches(theID) {
	lastBook = theID
	sketchThumbLoader("", theID, theCat)
}

function makeFrameLoadImage(theString) {
	theArray = theString.split(",^ ")
	theUrl = theArray[0]
	theWidth = parseInt(theArray[1])
	theHeight = parseInt(theArray[2])
	theTitle = theArray[3]
	theYear = theArray[4]
	cat = theArray[5]
	
	if (theYear=="0") {
		theYear = ""
	}
	
	document.getElementById("satoSlice-33c_").innerHTML = "<div id='frameLeft'></div><div id='frameTop'></div><div id='frameRight'></div><div id='frameBottom'></div>Loading..."
	
	if (cat=="illustration") {
		theDescrip = theArray[6]
		theClient = theArray[7]
		theDirector = theArray[8]
		theNotes = theArray[9]
		theBigString=""
		brNum = 0
		
		if (theDescrip) {
			theBigString += "<span id='titleDescripBigger'>"+theDescrip+", "+theYear+"</span><br />"
			brNum++
		} else {
			theBigString += "<br />"
		}
		if (theClient != "Client:") {
			theBigString += "<span class='titleDescrip'>"+theClient+"</span><br />"
			brNum++
		}
		if (theDirector != "Art Director:") {
			theBigString += "<span class='titleDescrip'>"+theDirector+"</span><br />"
			brNum++
		}
		if (theNotes) {
			theBigString += "<span class='titleDescrip'>"+theNotes+"</span>"
			brNum++
		}
		
		
		descLength = theDescrip.split("")
		
		if (descLength.length>=90) {
			theBigString = "<p><br />"+theBigString+"</p>"
			document.getElementById("titleCard").innerHTML = theBigString
			document.getElementById("titleDescripBigger").style.fontSize = "11px"
		} else if (descLength.length>=60 && theWidth<=320) {
			theBigString = "<p><br />"+theBigString+"</p>"
			document.getElementById("titleCard").innerHTML = theBigString
		} else {
			theBigString = "<p><br />"+theBigString+"</p>"
			document.getElementById("titleCard").innerHTML = theBigString
		}
		document.getElementById("titleCard").style.width = theWidth + "px"
		document.getElementById("titleCard").style.paddingLeft = ((627 - theWidth)/2) +"px"
		
	} else if (cat=="comixsample") {
		
		
	} else {
		document.getElementById("titleCard").innerHTML = theTitle+", "+theYear
		document.getElementById("titleCard").style.paddingLeft = ((627 - theWidth)/2) +"px"
	}
	
	document.getElementById("satoSlice-33b_").innerHTML = ""
	document.getElementById("satoSlice-33b_").style.backgroundImage = "url("+theUrl+")"
	document.getElementById("satoSlice-33b_").style.height = (theHeight + 7) + "px"
	document.getElementById("satoSlice-33c_").style.paddingTop = ((theHeight/2) + 7) + "px"
	
	document.getElementById("frameLeft").style.height = (theHeight + 7) +"px"
	document.getElementById("frameRight").style.height = (theHeight + 7) +"px"
	document.getElementById("frameTop").style.width = (theWidth + 7) +"px"
	document.getElementById("frameBottom").style.width = (theWidth + 7) +"px"
	
	document.getElementById("frameLeft").style.left = (((627 - theWidth)/2) - 7) +"px"
	document.getElementById("frameBottom").style.left = (((627 - theWidth)/2) -7) +"px"
	document.getElementById("frameBottom").style.top = (theHeight + 7) +"px"
	document.getElementById("frameTop").style.left = ((627 - theWidth)/2) +"px"
	document.getElementById("frameRight").style.left = (((627 - theWidth)/2) + theWidth-1) +"px"
	
	
}

function makeFrameLoadBook(theString) {
	theArray = theString.split(",^ ")
	theContent = theArray[0]
	theWidth = 608
	theHeight = 300
	theTitle = "<span class='comicTitleDetail' id='bookDetailTitle'>Book Details</span> | "+theArray[1]
	//theYear = theArray[4]
	cat = theArray[2]
	/*
	if (theYear=="0") {
		theYear = ""
	}
	*/
	if (cat=="comix") {
		
		document.getElementById("titleCard").innerHTML = theTitle
		document.getElementById("titleCard").style.paddingLeft = "7px"
		document.getElementById("satoSlice-33c_").innerHTML = "<div id='frameLeft'></div><div id='frameTop'></div><div id='frameRight'></div><div id='frameBottom'></div>"
		document.getElementById("satoSlice-33b_").innerHTML = theContent
		document.getElementById("satoSlice-33b_").style.paddingLeft = "17px"
		document.getElementById("satoSlice-33b_").style.paddingRight = "17px"
		document.getElementById("satoSlice-33b_").style.width = (theWidth - 14) + "px"
	}
	
	
	document.getElementById("satoSlice-33b_").style.backgroundImage = "none"
	document.getElementById("satoSlice-33b_").style.height = (theHeight + 7) + "px"
	//document.getElementById("satoSlice-33c_").style.paddingTop = ((theHeight/2) + 7) + "px"
	
	document.getElementById("frameLeft").style.height = (theHeight + 7) +"px"
	document.getElementById("frameRight").style.height = (theHeight + 7) +"px"
	document.getElementById("frameTop").style.width = (theWidth + 7) +"px"
	document.getElementById("frameBottom").style.width = (theWidth + 7) +"px"
	
	document.getElementById("frameLeft").style.left = (((627 - theWidth)/2) - 7) +"px"
	document.getElementById("frameBottom").style.left = (((627 - theWidth)/2) -7) +"px"
	document.getElementById("frameBottom").style.top = (theHeight + 7) +"px"
	document.getElementById("frameTop").style.left = ((627 - theWidth)/2) +"px"
	document.getElementById("frameRight").style.left = (((627 - theWidth)/2) + theWidth-1) +"px"
	
	
}

function makeFrameLoadSketch(theString) {
	theArray = theString.split(",^ ")
	theUrl = theArray[0]
	theWidth = parseInt(theArray[1])
	theHeight = parseInt(theArray[2])
	theTitle = theArray[3]
	cat = theArray[5]
	
	document.getElementById("titleCard").innerHTML = theTitle
	document.getElementById("titleCard").style.paddingLeft = ((627 - theWidth)/2) +"px"
	document.getElementById("satoSlice-33b_").style.backgroundImage = "url("+theUrl+")"
	document.getElementById("satoSlice-33b_").style.height = (theHeight + 7) + "px"
	document.getElementById("satoSlice-33c_").style.paddingTop = ((theHeight/2) + 7) + "px"
	
	document.getElementById("frameLeft").style.height = (theHeight + 7) +"px"
	document.getElementById("frameRight").style.height = (theHeight + 7) +"px"
	document.getElementById("frameTop").style.width = (theWidth + 7) +"px"
	document.getElementById("frameBottom").style.width = (theWidth + 7) +"px"
	
	document.getElementById("frameLeft").style.left = (((627 - theWidth)/2) - 7) +"px"
	document.getElementById("frameBottom").style.left = (((627 - theWidth)/2) -7) +"px"
	document.getElementById("frameBottom").style.top = (theHeight + 7) +"px"
	document.getElementById("frameTop").style.left = ((627 - theWidth)/2) +"px"
	document.getElementById("frameRight").style.left = (((627 - theWidth)/2) + theWidth-1) +"px"
}

function gotoPage(thePage) {
	curPage = thePage
	thePage--
	thePage *= 16
	thumbLoader(thePage, theCat)
}