// JScript File
window.onload = initAll;
var xhr = false;
var statesArray = new Array();

var imageRoot = "http://abbottprime.com/images/slides/snap";
var maxImage = 163;
var currentImage = 1;

function initAll() {
    // Make sure this page is not displayed within a frame
    if (top.location != self.location) { top.location.replace(self.location); }

    // This simply sets the contents of the helloMessage tag.  I have used two strings
    // combined together with the plus (+) to continue onto a second link for readability
	document.getElementById("helloMessage").innerHTML = "<hr />This content was written using the innerHTML property in the window.onload event handler. &nbsp;" + 
	"<b>NOTE</b>: Since this uses the inner<b>HTML</b> property, I am able to use HTML tags in my JavaScript functions. This is also a source of a potential security problem.  If you allow visitors to your page to input text that will be display in the page using an innerHTML property, the visitor could submit HTML tags";

    //This section initializes all of the event handlers for this page
    document.getElementById("jsAlert").onclick = alertMe;
    document.getElementById("navButton").onclick = navigateMe;
    document.getElementById("linkWarning").onclick = navigateWarnMe;

    document.getElementById("choiceRed").onclick = colorChoice;
    document.getElementById("choiceBlue").onclick = colorChoice;
    document.getElementById("choiceGreen").onclick = colorChoice;
    document.getElementById("performMath").onclick = mathMe;

	if (window.XMLHttpRequest) { xhr = new XMLHttpRequest(); }
	else { if (window.ActiveXObject) { try { xhr = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e) { } }}
	if (xhr) {
		xhr.onreadystatechange = setStatesArray;
		xhr.open("GET", "us-states.xml", true);
		xhr.send(null);
	}
	else { alert("Sorry, but I couldn't create an XMLHttpRequest"); }

    // This sets the showPreview for any <a> tags with a class of "ajaxLink"
	var allTags = document.getElementsByTagName("*");
	for (var i=0; i<allTags.length; i++) {
		if (allTags[i].className.indexOf("ajaxLink")>-1) {
			allTags[i].onclick = showPreview;
		}
		if (allTags[i].className.indexOf("rollText")>-1) {
			allTags[i].onmouseover = showRolltext;
			allTags[i].onmouseout  = hideRolltext;
		}
	}

	for (var i=0; i<document.images.length; i++) {
		if (document.images[i].parentNode.tagName == "A" && document.images[i].className.indexOf("rollover")>=0) {
			setupRollover(document.images[i]);
		}
	}
    
    // This sets up the slideshow
    setTimeout("updateImage()", 5000);

}

function updateImage() {
    document.getElementById("slide").src = getImageFilename();
    setTimeout("updateImage()", 5000);
}

function getImageFilename() {
    if (++currentImage > maxImage) currentImage = 1;
    return imageRoot + Right("00000000000" + currentImage, 4) + ".jpg"
}

function Right(str, num) {
  return str.substring(str.length-num);  // pull out right num
}

function showRolltext() {
    document.getElementById("rollText").innerHTML = this.title;
    document.getElementById("rollText").className = this.className;
}

function hideRolltext() {
    document.getElementById("rollText").innerHTML = "";
    document.getElementById("rollText").className = "";
}

function setupRollover(thisImage) {
	thisImage.outImage = new Image();
	thisImage.outImage.src = thisImage.src;
	thisImage.onmouseout = rollOut;

	thisImage.clickImage = new Image();
	thisImage.clickImage.src = "images/" + thisImage.id + "-click.gif";
	thisImage.onclick = rollClick;	

	thisImage.overImage = new Image();
	thisImage.overImage.src = "images/" + thisImage.id + "-over.gif";
	thisImage.onmouseover = rollOver;	
}
function rollOver()  { this.src = this.overImage.src;  }
function rollOut()   { this.src = this.outImage.src;   }
function rollClick() { this.src = this.clickImage.src; }

function setStatesArray() {
	if (xhr.readyState == 4) {
		if (xhr.status == 200) {
			if (xhr.responseXML) {
			    document.getElementById("stateList").options.length = 0;
				var allStates = xhr.responseXML.getElementsByTagName("item");
				for (var i=0; i<allStates.length; i++) {
					statesArray[i] = allStates[i].getElementsByTagName("label")[0].firstChild;
					document.getElementById("stateList").options[i] = new Option(statesArray[i].nodeValue);
				}
			}
		} else { alert("There was a problem with the request " + xhr.status); }
	}
}

// This is just a simple warning with the alert function
function alertMe() {
    alert("This is a JavaScript alert--pretty simple stuff.  This can be used to display important information to the user. I used return false to keep the A tag from navigating.");
    return false;
}

// This performs a navigation using a button--could be any type of tag, link an image
function navigateMe() {
    alert("I will now navigate to the books home page using the window.location property");
    window.location = "http://javascriptworld.com";
    return false;
}

// This intercepts the normal <a> tag and provides a warning before navigating to the new page
function navigateWarnMe() {
    alert("This is a warning that you are navigating away. You would probably want to use this and either check to see if the link goes to a different website or use a class attribute to trigger the warning.");
    window.location = this;
    return false;
}

// This checks to see which hyperlink you clicked and display a different answer based on the link you chose.
function colorChoice() {
    switch(this.id) {
        case "choiceRed":
            alert("You chose Red");
            break;
        case "choiceBlue":
            alert("You chose Blue");
            break;
        case "choiceGreen":
            alert("You chose Green");
            break;
    }
    return false;
}

// This prompts for a number, then displays the square root of that number
function mathMe() {
	var ans = prompt("Enter a number and I will return the square root of that number","");
	try {
		if (!ans || isNaN(ans) || ans<0) {
			throw new Error("Not a valid number");
		}
		alert("The square root of " + ans + " is " + Math.sqrt(ans));
	}
	catch (errMsg) {
		alert(errMsg.message);
	}
    return false;
}

function showPreview(evt) {
	getPreview(evt);
	return false;
}

function getPreview(evt) {
	if (evt) {
		var url = evt.target;
	}
	else {
		evt = window.event;
		var url = evt.srcElement;
	}
	xPos = evt.clientX;
	yPos = evt.clientY;
	
	if (window.XMLHttpRequest) {
		xhr = new XMLHttpRequest();
	}
	else {
		if (window.ActiveXObject) {
			try {
				xhr = new ActiveXObject("Microsoft.XMLHTTP");
			}
			catch (e) { }
		}
	}

	if (xhr) {
		xhr.onreadystatechange = showContents;
		xhr.open("GET", url, true);
		xhr.send(null);
	}
	else {
		alert("Sorry, but I couldn't create an XMLHttpRequest");
	}
}

function showContents() {
	var prevWin = document.getElementById("updateArea");
	
	if (xhr.readyState == 4) {
		prevWin.innerHTML = (xhr.status == 200) ? xhr.responseText : "There was a problem with the request " + xhr.status;
	}
}