function getWindowDetails() {

	// the "viewable" height and width
	var viewWidth = window.innerWidth ? window.innerWidth : (document.documentElement ? document.documentElement.clientWidth : document.body.clientWidth);
	var viewHeight = window.innerHeight ? window.innerHeight : (document.documentElement ? document.documentElement.clientHeight : document.body.clientHeight);
	
	// where we're currently scrolled to
	var scrollPositionY = window.scrollY ? window.scrollY : document.documentElement.scrollTop;
	var scrollPositionX = window.scrollX ? window.scrollX : document.documentElement.scrollLeft;
	
	// get the total height and width of the content (which includes the area you have to scroll to)...
	var totalHeight = (document.documentElement.scrollHeight > document.body.scrollHeight) ? document.documentElement.scrollHeight : document.body.scrollHeight;	
	var totalWidth = (document.documentElement.scrollWidth > document.body.scrollWidth) ? document.documentElement.scrollWidth : document.body.scrollWidth;
	
	var centerY = scrollPositionY+(viewHeight/2);
	var centerX = scrollPositionX+(viewWidth/2);
	
	return {
		viewWidth: viewWidth,
		viewHeight: viewHeight,
		scrollPositionX: scrollPositionX,
		scrollPositionY: scrollPositionY,
		totalWidth: totalWidth,
		totalHeight: totalHeight,
		centerY: centerY,
		centerX: centerX,
		toString: function() {
			var output = "";
			output += 'viewWidth: '+viewWidth+"\n";
			output += 'viewHeight: '+viewHeight+"\n";
			output += 'scrollPositionX: '+scrollPositionX+"\n";
			output += 'scrollPositionY: '+scrollPositionY+"\n";
			output += 'totalWidth: '+totalWidth+"\n";
			output += 'totalHeight: '+totalHeight+"\n";
			output += 'centerY: '+centerY+"\n";
			output += 'centerX: '+centerX+"\n";
			
			return output;
		}
	};
}

function scaleDimensions(maxDimensions, currentDimensions) {
	var scaledDimensions = currentDimensions;

	if (scaledDimensions['width'] > maxDimensions['width']) {
		// restrain the width, and scale the height accordingly
		var targetWidth = maxDimensions['width'];
		var targetHeight = Math.floor( (targetWidth*(scaledDimensions['height']))/(scaledDimensions['width']) );

		scaledDimensions['width'] = targetWidth; 
		scaledDimensions['height'] = targetHeight;
	}
	if (scaledDimensions['height'] > maxDimensions['height']) {
		// restrain the height, and scale the width accordingly
		var targetHeight =  maxDimensions['height'];
		var targetWidth = Math.floor( (targetHeight*(scaledDimensions['width']))/(scaledDimensions['height']) );
		
		scaledDimensions['width'] = targetWidth; 
		scaledDimensions['height'] = targetHeight;
	}
	
	return scaledDimensions;
}

function outputPNG(imgSource, hoverSource, width, height, title) {	
	var isIE = (navigator.appName == "Microsoft Internet Explorer" && navigator.userAgent.indexOf('Opera') == -1);
	if(isIE) {
		// filter for MSIE 6.x and 5.5
		var ie6xFilter = /^.*MSIE [6]\.[0-9].*$/;
		var ie55Filter = /^.*MSIE [5].*$/;
		if (ie6xFilter.test(navigator.userAgent) || ie55Filter.test(navigator.userAgent)) {
			if (hoverSource) {
				document.write('<img src="images/blank.gif" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='+imgSource+');" onmouseover="this.filters(0).src=\''+hoverSource+'\';" onmouseout="this.filters(0).src=\''+imgSource+'\';" width="'+width+'" height="'+height+'" alt="'+title+'" title="'+title+'" border="0">');
			}
			else {
				document.write('<img src="images/blank.gif" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='+imgSource+');" width="'+width+'" height="'+height+'" alt="'+title+'" title="'+title+'" border="0">');
			}
		}
		else {
			if (hoverSource) {
				document.write('<img src="'+imgSource+'" onmouseover="this.src=\''+hoverSource+'\';" onmouseout="this.src=\''+imgSource+'\';" width="'+width+'" height="'+height+'" alt="'+title+'" title="'+title+'" border="0">');	 
			}
			else {
				document.write('<img src="'+imgSource+'" width="'+width+'" height="'+height+'" alt="'+title+'" title="'+title+'" border="0">');	 
			}
		}
	}
	else {
		if (hoverSource) {
			document.write('<img src="'+imgSource+'" onmouseover="this.src=\''+hoverSource+'\';" onmouseout="this.src=\''+imgSource+'\';" width="'+width+'" height="'+height+'" alt="'+title+'" title="'+title+'" border="0">');	 
		}
		else {
			document.write('<img src="'+imgSource+'" width="'+width+'" height="'+height+'" alt="'+title+'" title="'+title+'" border="0">');	 
		}
	}
}