$(document).ready(function() {
	// GLOBALS
	var curPage = 1;
	var main = $("#main");
	var page = $("#page");
	var pagewidth = page.outerWidth();
	var increment = pagewidth+10;

	// Subject to change (window resize)
	// so these should be recalculated onLoad and on resize
	var fullwidth = (page.attr("offsetWidth") > page.attr("scrollWidth")) ? page.attr("offsetWidth") : page.attr("scrollWidth");
	fullwidth = fullwidth - increment;
	var curLeft = page.scrollLeft();
	
	// Dealing with the article contents
	var article = document.getElementById("main");
	// Cleaning it
	clearLinks(article);
	cleanStyles(article);					// Removes all style attributes
	// article = killDivs(article);				// Goes in and removes DIVs that have more non <p> stuff than <p> stuff
	article = killBreaks(article);            // Removes any consecutive <br />'s into just one <br /> 
	article = convertEntities(article);
	
	// Remove all inline style tags
	var styleTags = document.getElementsByTagName("style");
	for (var j=0;j < styleTags.length; j++) {
		if (navigator.appName != "Microsoft Internet Explorer") {
			styleTags[j].textContent = "";
		}
	}
	
	// If the html has a class for pgheader, make it its own page
	$(".pgheader").addClass("pageheight");
	
	// FUNCTIONS FOR PAGINATION
	function advance(pages) {
		if (!pages) {
			pages = 1;
		}
		// Need to get curLeft
		curPage = parseFloat($("#currentPage").html());
		
		var curLeft = increment - (curPage*increment);
		var newLeft=curLeft-(increment*pages);
		// alert("curLeft:"+curLeft+" newLeft:"+newLeft);
		if ( -newLeft <= fullwidth) {
			main.animate( { left: newLeft }, 500);
			curLeft = newLeft;
			curPage = Math.ceil(Math.abs(curLeft)/(increment*pages))+1;
			$("#currentPage").html(curPage);
		}
	}

	function goback(pages) {
		if (!pages) {
			pages = 1;
		}
		curPage = parseFloat($("#currentPage").html());
		var curLeft = increment - (curPage*increment);
		var newLeft=curLeft+(increment*pages);
		if ( newLeft < increment ) {
			main.animate( { left: newLeft }, 500);
			curLeft = newLeft;
			curPage = Math.ceil(Math.abs(curLeft)/(increment*pages))+1;
			$("#currentPage").html(curPage);
		}
	}

	function pageTo(page) {
		var thisPage = parseFloat($("#currentPage").html());
		var distance = page - thisPage;
		// alert("page: "+page+" curPage: "+curPage);
		if (page<thisPage){
				goback(distance);
			} else {
				advance(distance);
			} 
	
	}
	
	$('.nextbtn').click(function() {advance();});
	$('.prevbtn').click(function() {goback();});

	// This handles the keypresses
	$(document).keydown(function (e) {
		//Next
		//if the keyCode or charCode is 39 (right arrow)
		if (e.keyCode == 39 || e.charCode == 39 ){
			advance();
			document.getElementById('right').style.background='url(http://reader.redub.org/newreader/images/rightbtn_over.png) repeat-y';
		}
		//Previous
		//works exactly as the above example but for the left arrow (37)
		if (e.keyCode == 37 || e.charCode == 37){
			goback();
			document.getElementById('left').style.background='url(http://reader.redub.org/newreader/images/leftbtn_over.png) repeat-y';
		}
	});
	$(document).keyup(function (e) {
		//Next
		//if the keyCode or charCode is 39 (right arrow)
		if (e.keyCode == 39 || e.charCode == 39 ){
			document.getElementById('right').style.background='url(http://reader.redub.org/newreader/images/rightbtn_off.png) repeat-y';
		}
		//Previous
		//works exactly as the above example but for the left arrow (37)
		if (e.keyCode == 37 || e.charCode == 37){
			document.getElementById('left').style.background='url(http://reader.redub.org/newreader/images/leftbtn_off.png) repeat-y';
		
		}
	});
	

	// This makes sure there are no scrollbars by adjusting the height of the "main" div based on the browser window
	var minorOffset = (document.all)? 50 : 100;
	
	
	function setHgt() {
		// This function gets called every time the browser window gets resized, and onload
		var sHGT;
		var oldfullwidth = fullwidth;
		var newfullwidth = (page.attr("offsetWidth") > page.attr("scrollWidth")) ? page.attr("offsetWidth") : page.attr("scrollWidth");
		fullwidth = newfullwidth - increment;
		
		// Get height of the main container
		srcobj=document.getElementById('main');
		if (self.innerHeight)	{
			sHGT = self.innerHeight;
		} else { 
			if (document.documentElement && document.documentElement.clientHeight) {
				sHGT = document.documentElement.clientHeight;
			} else {
				if (document.body) {
              sHGT = document.body.clientHeight;
				}
			}
		}
		
    	sHGT=sHGT-(document.getElementById('main').offsetTop+minorOffset);
		
		// Set the heights of the main, left and right button containers
	  	document.getElementById('main').style.height=sHGT+"px";
		document.getElementById('left').style.height=sHGT+"px";
		document.getElementById('right').style.height=sHGT+"px";
		
		// This is to make an element with class .pgheight the height of a page
		// Basically a clear
		var pghgt = sHGT - 10;
		$('.pageheight').height(pghgt);
		
		// This makes the middle container bigger
		var middleOffset = sHGT+55;
		document.getElementById('middle').style.height=middleOffset+"px";
		
		var newCurPage = Math.ceil(Math.abs((newfullwidth * curPage)/oldfullwidth));
		curPage = newCurPage;
		
		// Draw pagination indicator
		var tot_pages = Math.ceil(newfullwidth/increment);
		$("#totalPages").html(tot_pages);
		$("#currentPage").html(newCurPage);
		$('#page_indicator').slider({ animate: true, slide: handleSliderSlide, change: handleSliderChange});
		function handleSliderChange(e, ui)
		{
			// var maxScroll = (page.attr("offsetWidth") > page.attr("scrollWidth")) ? page.attr("offsetWidth") : page.attr("scrollWidth");
			// 			maxScroll = maxScroll - increment;
			// 			var total_pages = Math.ceil(maxScroll/increment);
			var newPage = Math.ceil((ui.value * tot_pages)/100);
			pageTo(newPage);
			$("#currentPage").html(newPage);
		}

		function handleSliderSlide(e, ui)
		{
			// var maxScroll = (page.attr("offsetWidth") > page.attr("scrollWidth")) ? page.attr("offsetWidth") : page.attr("scrollWidth");
			// 			maxScroll = maxScroll - increment;
			// 			var total_pages = Math.ceil(maxScroll/increment);
			var newPage = Math.ceil((ui.value * tot_pages)/100);
			pageTo(newPage);
			$("#currentPage").html(newPage);
		}
	}
	



	window.onload=setHgt;
	window.onresize=setHgt;
	$("#runninghead").css("margin-top", "0");
	$("#main").css("top", "0");
	$(".loading").css("display", "none");
	
});