// JAVASCRIPT BROWSER v2.0
// Encapsulates all the things you want to know about your browser (width, height, version)
// Automates the image rollovers
// Allows you to add to the laod event

// -----------------------------------------------------------------------------------------------------------------------
// Methods that safely allow developers to add funcions to onload and onresize without overwriting what's already there
// Can't use addEventListener or attachEvent since that messes around with the ordering of events - load MUST fire before resize
function addLoadEvent(func) {
	// Add to OnLoad (but don't kill what's already in OnLoad)
	if (typeof window.onload != 'function') {
		window.onload = func;
	} else {
		var holdonload = window.onload;
		window.onload = function() { holdonload(); func(); }
	}
}

function addResizeEvent(func) {
	if (typeof window.onresize != 'function') {
		window.onresize = func;
	} else {
		var holdonresize = window.onresize;
		window.onresize = function() { holdonresize(); func(); }
	}
}


// -----------------------------------------------------------------------------------------------------------------------
// Browser to capture position of Mouse X & Y - eventually incorporate offset?
function Browser() {
	this.mouseX = 0; this.mouseY = 0; this.mouseDown = false; // controlled by events defined outside of this class
	this.width = parseInt(screen.availWidth / 2); this.height = parseInt(screen.availHeight / 2);
	// this.widthmin = 1024 - 121; this.heightmin = 768 - 180; // don't allow window to ever be smaller than 1024 x 768 (need to take into scrollbars, address bars etc.)
	this.widthmin = 1; this.heightmin = 1; // don't allow window to ever be smaller than 1024 x 768 (need to take into scrollbars, address bars etc.)
	this.ratioX = 1; this.ratioY = 1;
	this.name = ""; this.version = 0; this.os = "";
	this.keys = new Array(255);
}

// Instantiate the Browser object (badly encapsulates everything)
var gBrowser = new Browser();

// -----------------------------------------------------------------------------------------------------------------------
// Capture the size of the browser (taking into account user resize) and store in .width and .height
// If this page scrolls (it's bigger than the browser), this function ignores that and just returns the width/height of the BROWSER
function Browser_onresize() {
	// Get actual gBrowser width & height (not the screen)
	if( typeof( window.innerWidth ) == 'number' ) {
		//Non-IE
		gBrowser.width  = window.innerWidth;
		gBrowser.height = window.innerHeight;
	} else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
		//IE 6+ in 'standards compliant mode'
		gBrowser.width = document.documentElement.clientWidth;
		gBrowser.height = document.documentElement.clientHeight;
	} else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
		//IE 4 compatible
		gBrowser.width = document.body.clientWidth;
		gBrowser.height = document.body.clientHeight;
	}

	if (gBrowser.width <= gBrowser.widthmin) { gBrowser.width = gBrowser.widthmin; gBrowser.ratioX = 1;} else { gBrowser.ratioX = gBrowser.width / gBrowser.widthmin; }
	if (gBrowser.height <= gBrowser.heightmin) { gBrowser.height = gBrowser.heightmin; gBrowser.ratioY = 1;} else { gBrowser.ratioY = gBrowser.height / gBrowser.heightmin; }
}

addLoadEvent(Browser_onresize);
addResizeEvent(Browser_onresize);

// -----------------------------------------------------------------------------------------------------------------------
// Capture the Mouse and dump it into .mouseX and .mouseY
function Browser_onmousemove(e) {
	if( !e ) {
		if( window.event ) {
			//DOM
			e = window.event;
		} else {
			//TOTAL FAILURE, WE HAVE NO WAY OF REFERENCING THE EVENT
			window.status = "Error: Can't capture mouse!";
			return;
		}
	}

	if( typeof( e.pageX ) == 'number' ) {
		//NS 4, NS 6+, Mozilla 0.9+
		var xcoord = e.pageX;
		var ycoord = e.pageY;
	} else {
		if( typeof( e.clientX ) == 'number' ) {
			//IE, Opera, NS 6+, Mozilla 0.9+
			//except that NS 6+ and Mozilla 0.9+ did pageX ...
			var xcoord = e.clientX;
			var ycoord = e.clientY;
			if( !( ( window.navigator.userAgent.indexOf( 'Opera' ) + 1 ) ||
			( window.ScriptEngine && ScriptEngine().indexOf( 'InScript' ) + 1 ) ||
			window.navigator.vendor == 'KDE' ) ) {
				if( document.body && ( document.body.scrollLeft || document.body.scrollTop ) ) {
					//IE 4, 5 & 6 (in non-standards compliant mode)
					xcoord += document.body.scrollLeft;
					ycoord += document.body.scrollTop;
				} else if( document.documentElement &&
				( document.documentElement.scrollLeft || document.documentElement.scrollTop ) ) {
					//IE 6 (in standards compliant mode)
					xcoord += document.documentElement.scrollLeft;
					ycoord += document.documentElement.scrollTop;
				}
			}
		} else {
			//TOTAL FAILURE, WE HAVE NO WAY OF OBTAINING THE
			//MOUSE COORDINATES
			return;
		}
	}
	gBrowser.mouseX = parseInt(xcoord); gBrowser.mouseY = parseInt(ycoord);
}

function Browser_onmousedown() { gBrowser.mouseDown = true; }

function Browser_onmouseup() { gBrowser.mouseDown = false; }

// strangely, you can hook up to the events even though document should not exist at this point (try getting document.offsetWidth)
if( document.captureEvents ) {
    //non IE
    if( Event.KEYUP ) {
        //NS 4, NS 6+, Mozilla 0.9+
		document.captureEvents( Event.MOUSEMOVE );
		document.captureEvents( Event.MOUSEDOWN );
		document.captureEvents( Event.MOUSEUP );
    }
}
document.onmousedown = Browser_onmousedown; // can't call / link to methods of an object
document.onmouseup = Browser_onmouseup;
document.onmousemove = Browser_onmousemove;	


// -----------------------------------------------------------------------------------------------------------------------
// Keyboard
if( document.captureEvents ) {
    //non IE
    if( Event.KEYUP ) {
        //NS 4, NS 6+, Mozilla 0.9+
        document.captureEvents( Event.KEYDOWN );
		document.captureEvents( Event.KEYUP );
    }
}
document.onkeydown = Browser_keydown;
document.onkeyup = Browser_keyup;
		
function Browser_keycode(e) {
    if( !e ) {
        //if the browser did not pass the event information to the
        //function, we will have to obtain it from the event register
        if( window.event ) {
            //DOM
            e = window.event;
        } else {
            //TOTAL FAILURE, WE HAVE NO WAY OF REFERENCING THE EVENT
            return;
        }
    }
    if( typeof( e.which ) == 'number' ) {
        //NS 4, NS 6+, Mozilla 0.9+, Opera
        e = e.which;
    } else if( typeof( e.keyCode ) == 'number'  ) {
        //IE, NS 6+, Mozilla 0.9+
        e = e.keyCode;
    } else if( typeof( e.charCode ) == 'number'  ) {
        //also NS 6+, Mozilla 0.9+
        e = e.charCode;
    } else {
        //TOTAL FAILURE, WE HAVE NO WAY OF OBTAINING THE KEY CODE
        return;
    }
    return parseInt(e); // window.status = 'The key pressed has keycode ' + e + ' and is key ' + String.fromCharCode( e );
}
	
function Browser_keydown(e) {
	gBrowser.keys[Browser_keycode(e)] = true;
}

function Browser_keyup(e) {
	gBrowser.keys[Browser_keycode(e)] = false;
}


// -----------------------------------------------------------------------------------------------------------------------
// Browser detection (can do this right away, no need to wait for document to load)
// http://www.howtocreate.co.uk/tutorials/index.php?tut=0&part=16
// http://www.quirksmode.org/js/detect.html
var detect = navigator.userAgent.toLowerCase();
function Browser_checkIt(string)
{
	place = detect.indexOf(string) + 1;
	thestring = string;
	return place;
}

if (Browser_checkIt('konqueror'))
{
	gBrowser.name = "Konqueror";
	gBrowser.os = "Linux";
}
else if (Browser_checkIt('safari')) gBrowser.name = "Safari"
else if (Browser_checkIt('omniweb')) gBrowser.name = "OmniWeb"
else if (Browser_checkIt('opera')) gBrowser.name = "Opera"
else if (Browser_checkIt('webtv')) gBrowser.name = "WebTV";
else if (Browser_checkIt('icab')) gBrowser.name = "iCab"
else if (Browser_checkIt('msie')) gBrowser.name = "Internet Explorer"
else if (!Browser_checkIt('compatible'))
{
	gBrowser.name = "Netscape Navigator"
	gBrowser.version = detect.charAt(8);
}
else gBrowser.name = "An unknown gBrowser.name";

if (!gBrowser.version) gBrowser.version = detect.charAt(place + thestring.length);

if (!gBrowser.os)
{
	if (Browser_checkIt('linux')) gBrowser.os = "Linux";
	else if (Browser_checkIt('x11')) gBrowser.os = "Unix";
	else if (Browser_checkIt('mac')) gBrowser.os = "Mac"
	else if (Browser_checkIt('win')) gBrowser.os = "Windows"
	else gBrowser.os = "an unknown operating system";
}


// -----------------------------------------------------------------------------------------------------------------------
// Easy Image Rollover v1.0
var Browser_cache = new Array();

function Browser_rollover() {
  	var rollover_images = new Array();
  	var hold_images = new Array();
  	var index = -1;
	var hold = "";
	var href = "";
	
  	// Step 1. Create an array of images that require rollovers	
  	var hold_images = document.getElementsByTagName('img');
  	for (var i = 0; i < hold_images.length; i++) {
  		if ((hold_images[i].src.indexOf('_off.') != -1) && (!hold_images[i].onmouseover) && (!hold_images[i].onmouseout)) {
  			index = rollover_images.length; 
  			rollover_images[index] = hold_images[i];
  		}
  	}
  
  	var hold_images = document.getElementsByTagName('input');
  	for (var i = 0; i < hold_images.length; i++) {
  		if ((hold_images[i].src.indexOf('_off.') != -1) && (!hold_images[i].onmouseover) && (!hold_images[i].onmouseout)) {
  			index = rollover_images.length; 
  			rollover_images[index] = hold_images[i];
  		}
  	}
  	
  	for (var i = 0; i < rollover_images.length; i++)
  	{	
  		// Step 2: If we're on the page this image links to, and the user want it remembered, don't add mouseovers and keep the image on always
		href = "";
		if ((rollover_images[i].parentNode) && (rollover_images[i].parentNode.href)) { href = rollover_images[i].parentNode.href.toLowerCase(); }

		if (href == window.location.href.toLowerCase()) {
  			rollover_images[i].src = rollover_images[i].src.replace("_off.", "_on.");

  		} else if (href != "") {
  			// Step 3: Add the usual mouse rollover events to each image
  			rollover_images[i].onmouseover = function () { this.src = this.src.replace("_off.", "_rollover."); };
  			rollover_images[i].onmouseout = function () { this.src = this.src.replace("_rollover.", "_off."); };
  			
  			// Step 4: Cache the on states of the rollover images (off states already cached by IMG tag).
  			index = Browser_cache.length;
  			Browser_cache[index] = new Image();
  			Browser_cache[index].src = rollover_images[i].src.replace("_off.", "_rollover.");
  		}
  	}
}
addLoadEvent(Browser_rollover);