// --------------------------------------------------------------------------------------------------------------------------------------------
// Javascript for page handling
// --------------------------------------------------------------------------------------------------------------------------------------------

// Reset all position variables
var startX = 0;
var myX = 0;
var pageSetWidth = 0;
var currPageSet = 0;
var pageLoadNext = 0;
var pagesLoaded = false;
var noPagesLoaded = 0;
var pageImage = new Array();
var pageImageIndex = 0;
var myPageHeight = 0;
var minPageHeight = 440;
var placeholderHeight = 500;
var pageBlankWidth = 786;
var pageBlankLeft = 37;

function preparePageSets(myHeight) {
	if (noSets > 0 && noPages > 0) {
		startX = document.getElementById("pageSet1").offsetLeft;
		myX = document.getElementById("pageSet1").offsetLeft;
		pageSetWidth = document.getElementById("pageSet1").offsetWidth + document.getElementById("pageSet1").offsetLeft;
		myPageHeight = myHeight;
		for (var i=1; i<(noSets+1); i++) {
			document.getElementById("pageSet" + i).style.left = myX + "px";	
			document.getElementById("pageSet" + i).style.visibility = "visible";
			document.getElementById("pageSet" + i).style.height = (myHeight + 6) + "px";
			// Centre vertically (if required)
			if (myHeight < minPageHeight) document.getElementById("pageSet" + i).style.top = (((minPageHeight / 2) - (myHeight / 2))) + document.getElementById("pageSet" + i).offsetTop + "px";
			myX += pageSetWidth;
		}
		// Set size of pages inside pageset areas
		for (var i=1; i<(noPages+1); i++) {
			document.getElementById("pageContainer" + i).style.height = myHeight + "px";
			document.getElementById("pageObject" + i).style.height = myHeight + "px";
			document.getElementById("pageContainerBottom" + i).style.top = (myHeight + 3) + "px";
		}
		// If we only have one page, then centre it horizontally
		if (noSets == 1 && noPages == 1 && !adminMode) {
			document.getElementById("pageContainer1").style.left = (document.getElementById("pageSet1").offsetWidth / 2) - (document.getElementById("pageContainer1").offsetWidth / 2) + "px";
			document.getElementById("pageContainerTop1").style.left = document.getElementById("pageContainer1").offsetLeft + "px";
			document.getElementById("pageContainerBottom1").style.left = document.getElementById("pageContainer1").offsetLeft + "px";
		}
		// Position page fold
		document.getElementById("pageFold").style.top = document.getElementById("pageSet1").offsetTop + "px";
		// Centre arrow buttons and trash can vertically
		document.getElementById("arrowLeft").style.top = (document.getElementById("pageSet1").offsetTop + (document.getElementById("pageSet1").offsetHeight / 2)) - (document.getElementById("arrowLeft").offsetHeight / 2) + "px";
		document.getElementById("arrowRight").style.top = (document.getElementById("pageSet1").offsetTop + (document.getElementById("pageSet1").offsetHeight / 2)) - (document.getElementById("arrowRight").offsetHeight / 2) + "px";
		document.getElementById("arrowRightAdd").style.top = (document.getElementById("pageSet1").offsetTop + (document.getElementById("pageSet1").offsetHeight / 2)) - (document.getElementById("arrowRightAdd").offsetHeight / 2) + "px";
		document.getElementById("trashButton").style.top = (document.getElementById("pageSet1").offsetTop + (document.getElementById("pageSet1").offsetHeight / 2)) - (document.getElementById("trashButton").offsetHeight / 2) + 10 + "px";
		// Set inner area height
		if ((myHeight + 60) > (minPageHeight + 60)) document.getElementById("browserAreaInner").style.height = (myHeight + 60) + "px";
		placeholderHeight = myHeight;
		// Position loading bar
		document.getElementById("loadingBarContainer").style.top = (document.getElementById("centredPage").offsetHeight - document.getElementById("loadingBarContainer").offsetHeight - 1) + "px";
		// Set up slider
		sliderInit();
		gotoPageSet(startSet);
		moveSlider();
	} else if (noSets == 0) {
		// Disable slider
		document.getElementById("sliderGroove").style.width = "0px";
		document.getElementById("sliderButton").style.left = (0 - (document.getElementById("sliderButton").offsetWidth / 2)) + "px";
		document.getElementById("sliderButton").className = "sliderButtonOff"; 
		document.getElementById("sliderButtonLink").title = "";
		// Hide loading bar
		document.getElementById("loadingBarContainer").style.visibility = "hidden";
	}
	// If we're in admin mode, setup the page placeholder graphics
	if (adminMode) {
		document.getElementById("pageBlankSet").style.visibility = "visible";
		document.getElementById("pageBlankSet").style.height = (placeholderHeight + 6) + "px";
		document.getElementById("pageBlankLeft").style.height = placeholderHeight + "px";
		document.getElementById("pageBlankLeftInner").style.height = placeholderHeight + "px";
		document.getElementById("pageBlankLeftBottom").style.top = (placeholderHeight + 3) + "px";
		document.getElementById("pageBlankRight").style.height = placeholderHeight + "px";
		document.getElementById("pageBlankRightInner").style.height = placeholderHeight + "px";
		document.getElementById("pageBlankRightBottom").style.top = (placeholderHeight + 3) + "px";
		if (placeholderHeight < minPageHeight) document.getElementById("pageBlankSet").style.top = (((minPageHeight / 2) - (placeholderHeight / 2))) + document.getElementById("pageBlankSet").offsetTop + "px";
		if ((placeholderHeight + 60) > (minPageHeight + 60)) document.getElementById("browserAreaInner").style.height = (placeholderHeight + 60) + "px";
	}
}

function loadNextPage() {
	// Start loading page image
	pageImage[pageImageIndex] = new ImageLoader("/common_code/see_inside_get_image.asp?path=" + pageImagePath + "&img=" + pageImages[pageLoadNext], pageLoadNext);
	pageImage[pageImageIndex].loadEvent = function(url, image, index) { pageLoaded(image, index); }
	pageImage[pageImageIndex].load();
	pageImageIndex++;
}

function pageLoaded(myImage, myIndex) {
	myWidth = document.createAttribute('width');
	myWidth.value = 389;
	myImage.setAttributeNode(myWidth);
	//myHeight = document.createAttribute('height');
	//myHeight.value = 539;
	//myImage.setAttributeNode(myHeight);
	document.getElementById("pageObjectImage" + (myIndex + 1)).appendChild(myImage);
	document.getElementById("pageObject" + (myIndex + 1)).style.backgroundImage = "none";
	if (pageImageLoaded[myIndex] == false) noPagesLoaded++;
	document.getElementById("loadingBar").style.width = Math.round((noPagesLoaded / noPages) * 100) + "px";
	pageImageLoaded[myIndex] = true;
	if (pageLoadNext == myIndex) {
		pageLoadNext = getNextPage();
	} else {
		if (pageImageLoaded[pageLoadNext] == true) pageLoadNext = getNextPage();
	}
	if (!pagesLoaded) setTimeout("loadNextPage();",100); else document.getElementById("loadingBarContainer").style.visibility = "hidden";
}

function getNextPage() {
	var pageFound = false;
	for (var i=pageLoadNext; i<pageImageLoaded.length; i++) {
		if (pageImageLoaded[i] == false) { pageFound = true; break; }
	}
	if (!pageFound) {
		for (var i=0; i<pageLoadNext; i++) {
			if (pageImageLoaded[i] == false) { pageFound = true; break; }
		}
	}
	if (!pageFound) pagesLoaded = true;
	return i;
}

function pageSetForward() {
	if (currPageSet < (noSets - 1)) {
		bookmarkPage = false;
		currPageSet++;
		gotoPageSet(currPageSet);
		moveSlider();
	}	
}

function pageSetBackward() {
	if (currPageSet > 0) {
		bookmarkPage = false;
		currPageSet--;
		gotoPageSet(currPageSet);
		moveSlider();
	}	
}

function gotoPageSet(mySet) {
	if (mySet >= 0 && mySet < noSets) {
		currPageSet = mySet;
		myX = startX - currPageSet  * pageSetWidth;
		for (var i=1; i<(noSets+1); i++) {
			document.getElementById("pageSet" + i).style.left = myX + "px";
			myX += pageSetWidth;
		}
		// Hide arrow buttons, if required
		if (mySet == 0) document.getElementById("arrowLeft").style.visibility = "hidden"; else document.getElementById("arrowLeft").style.visibility = "visible";
		if ((mySet + 1) == noSets) document.getElementById("arrowRight").style.visibility = "hidden"; else document.getElementById("arrowRight").style.visibility = "visible";
		if ((mySet + 1) == noSets && adminMode) document.getElementById("arrowRightAdd").style.visibility = "visible"; else document.getElementById("arrowRightAdd").style.visibility = "hidden";
		// Make sure the next page image we load is the one we are looking at now
		pageLoadNext = pageLoadRel[currPageSet];
		if (bookID > 0) setCookie("myPage_" + bookID,pageLoadRel[currPageSet],365);
		// Add page fold for bookmarked page
		if (currPageSet > 0 && currPageSet < (noSets - 1) && bookmarkPage == true) {
			bookmarkPage = false;
			if (!adminMode) document.getElementById("pageFold").style.visibility = "visible";
		} else if (bookmarkPage == false) {
			document.getElementById("pageFold").style.visibility = "hidden";
		}
		// Hide panel (if it's showing)
		if (myPanelDown) openClosePanel();
		// Hide and show placeholder panels for missing pages (in Admin mode)
		if (adminMode) {
			var showTrash = true;
			document.getElementById("pageBlankLeftTop").style.visibility = "hidden";
			document.getElementById("pageBlankLeft").style.visibility = "hidden";
			document.getElementById("pageBlankLeftBottom").style.visibility = "hidden";
			document.getElementById("pageBlankRightTop").style.visibility = "hidden";
			document.getElementById("pageBlankRight").style.visibility = "hidden";
			document.getElementById("pageBlankRightBottom").style.visibility = "hidden";
			document.getElementById("pageBlankSet").style.width = "0px";
			document.getElementById("pageBlankSet").style.left = pageBlankLeft + "px";
			switch(pageSetPages[currPageSet]) {
				case "r":
					document.getElementById("pageBlankLeftTop").style.visibility = "visible";
					document.getElementById("pageBlankLeft").style.visibility = "visible";
					document.getElementById("pageBlankLeftBottom").style.visibility = "visible";
					document.getElementById("pageBlankRightTop").style.right = "0px";
					document.getElementById("pageBlankRight").style.right = "0px";
					document.getElementById("pageBlankRightBottom").style.right = "0px";
					document.getElementById("pageBlankSet").style.width = (pageBlankWidth / 2) + "px";
					if (pageImages[pageLoadRel[currPageSet]] == "") disableRemove(pageLoadRel[currPageSet] + 1);
					else {
						enableRemove(pageLoadRel[currPageSet] + 1, 'right');
						showTrash = false;
					}
					break;
				case "l":
					document.getElementById("pageBlankRightTop").style.visibility = "visible";
					document.getElementById("pageBlankRight").style.visibility = "visible";
					document.getElementById("pageBlankRightBottom").style.visibility = "visible";
					document.getElementById("pageBlankRightTop").style.left = "0px";
					document.getElementById("pageBlankRight").style.left = "0px";
					document.getElementById("pageBlankRightBottom").style.left = "0px";
					document.getElementById("pageBlankSet").style.width = (pageBlankWidth / 2) + "px";
					document.getElementById("pageBlankSet").style.left = (pageBlankWidth / 2) + pageBlankLeft + "px";
					if (pageImages[pageLoadRel[currPageSet]] == "") disableRemove(pageLoadRel[currPageSet] + 1);
					else {
						enableRemove(pageLoadRel[currPageSet] + 1, 'left');
						showTrash = false;
					}
					break;
				case "b":
					if (pageImages[pageLoadRel[currPageSet]] == "") disableRemove(pageLoadRel[currPageSet] + 1);
					else {
						enableRemove(pageLoadRel[currPageSet] + 1, 'left');
						showTrash = false;
					}
					if (pageImages[pageLoadRel[currPageSet] + 1] == "") disableRemove(pageLoadRel[currPageSet] + 2);
					else {
						enableRemove(pageLoadRel[currPageSet] + 2, 'right');
						showTrash = false;
					}
					break;
			}
			if (showTrash && currPageSet > 0) document.getElementById("trashButton").style.visibility = "visible"; else document.getElementById("trashButton").style.visibility = "hidden";
		}
		//Google Event track
		if (!adminMode) pageTracker._trackEvent('ViewBook', 'PageChanged', bookTitle, currPageSet);
	}
}

// ===========================================================
// Image pre-loading functions...
// ===========================================================

function addListener(element, type, expression, bubbling) {
	bubbling = bubbling || false;
	if (window.addEventListener) { // Standard
		element.addEventListener(type, expression, bubbling);
		return true;
	} else if (window.attachEvent) { // IE
		element.attachEvent('on' + type, expression);
		return true;
	} else return false;
}

var ImageLoader = function(url,index) {
	this.url = url;
	this.index = index;
	this.image = null;
	this.loadEvent = null;
};

ImageLoader.prototype = {
	load:function() {
		this.image = document.createElement('img');
		var url = this.url;
		var index = this.index;
		var image = this.image;
		var loadEvent = this.loadEvent;
		addListener(this.image, 'load', function(e) { if (loadEvent != null) { loadEvent(url, image, index); } }, false);
		this.image.src = this.url;
	},
	getImage:function() {
		return this.image;
	}
};

// ===========================================================