function _msie_replace_png_imgs() {
	var i, elements;

	elements = document.getElementsByTagName( "img" );
	for ( i = 0; i < elements.length; i++ ) {
		var img = elements[i];
		if ( img.src.toLowerCase().search(/\.png$/ ) < 0 ) continue;

		img.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + img.src	+ "', sizingMethod='image')";
		img.src = "img/spacer.gif";
	}
}

if ( window.attachEvent && navigator.appName == "Microsoft Internet Explorer" ) window.attachEvent ( "onload", _msie_replace_png_imgs );

function _showRecipe ( recipe ) {
	nWide = 800;
	xPosition = ( screen.width - nWide ) / 2 - 10;
	if ( screen.width <= ( nWide + 20 ) ) {
		nWide = screen.width - 40;
		xPosition = 0;
	}
	nHigh = screen.height - 40;
	yPosition = 0;

	args = "width=" + nWide + "," 
	+ "height=" + nHigh + "," 
	+ "location=no," 
	+ "menubar=no,"
	+ "resizable=yes,"
	+ "scrollbars=yes,"
	+ "status=yes," 
	+ "titlebar=no,"
	+ "toolbar=no,"
	+ "hotkeys=no,"
	+ "screenx=" + xPosition + ","  //NN Only
	+ "screeny=" + yPosition + ","  //NN Only
	+ "left=" + xPosition + ","     //IE Only
	+ "top=" + yPosition;           //IE Only
	
	url = "recipes/" + recipe + ".php";
	recipeWindow = window.open( url, 'recipe', args );
	recipeWindow.focus();
}

back_on = new Image();
back_on.src = "img/back_on.png";
home_on = new Image();
home_on.src = "img/home_on.png";
next_on = new Image();
next_on.src = "img/next_on.png";

back_off = new Image();
back_off.src = "img/back_off.png";
home_off = new Image();
home_off.src = "img/home_off.png";
next_off = new Image();
next_off.src = "img/next_off.png";

var page = 0;
var maxPages = 11;
var em = 18     // line-height in pixels
var mainTop = -1;
var rectHeight = 22 * em;
var rectTop = 0;
var rectBottom = rectHeight;

var offset, windowWidth, windowHeight, windowOffset;

function _centerBox () {
	if ( navigator.appName == "Netscape" || navigator.appName == "Opera" ) {
		windowHeight = window.innerHeight;
		windowWidth = window.innerWidth;
	} else if ( document.documentElement.clientWidth ) {
		windowHeight = document.documentElement.clientHeight;
		windowWidth = document.documentElement.clientWidth;
	} else {
		windowHeight = document.body.clientHeight;
		windowWidth = document.body.clientWidth;
	}

	vOffset = Math.floor (( windowHeight - rectHeight ) / 2 );
	vOffset = ( vOffset > 10 ) ? vOffset : 10 ;
	dBox.top = ( vOffset - 149 ) + 'px';
	dTop.top = ( vOffset - 135 ) + 'px';
	mainTop = ( mainTop == -1 ) ? vOffset : vOffset - rectTop;
	dMain.top = mainTop + 'px';
	dOverlay.top = vOffset + 'px';
	dBottom.top = ( vOffset + rectHeight + 10 ) + 'px';
	dButtons.top = ( vOffset + rectHeight + 10 + 60 ) + 'px';
	dCopy.top = ( vOffset + rectHeight + 10 + 20 + 90 ) + 'px';

	hOffset = Math.floor (( windowWidth - 605 ) / 2 );
	hOffset = ( hOffset > 10 ) ? hOffset : 10 ;
	dBox.left = ( hOffset - 20 ) + 'px';
	dTop.left = hOffset + 'px';
	dMain.left = ( hOffset + 5 ) + 'px';
	dOverlay.left = hOffset + 'px';
	dBottom.left = hOffset + 'px';
	dButtons.left = hOffset + 'px';
	dCopy.left = hOffset + 'px';

	dBox.visibility = "visible";
	dTop.visibility = "visible";
	dMain.visibility = "visible";
	dBottom.visibility = "visible";
	dButtons.visibility = "visible";
	dCopy.visibility = "visible";

	_showButton ();
}

function _showButton () {
	sBackButton.display = ( page ) ? "inline" : "none" ;
	sNextButton.display = ( page < maxPages ) ? "inline" : "none" ;
}

function _back() {
	page--;
	_showButton();
	mainTop = mainTop + rectHeight;
	dMain.top = mainTop + 'px';
	rectTop = rectTop - rectHeight;
	rectBottom = rectBottom - rectHeight;
	dMain.clip = "rect(" + rectTop + "px 595px " + rectBottom + "px 0px)";
	_showPage ( 1, -0.1 );
}

function _next () {
	page++;
	_showButton();
	mainTop = mainTop - rectHeight;
	dMain.top = mainTop + 'px';
	rectTop = rectTop + rectHeight;
	rectBottom = rectBottom + rectHeight;
	dMain.clip = "rect(" + rectTop + "px 595px " + rectBottom + "px 0px)";
	_showPage ( 1, -0.1 );
}

function _showPage ( opacity, delta ) {
	dOverlay.visibility = "visible";
	dOverlay.opacity = opacity;
	dOverlay.filter = "progid:DXImageTransform.Microsoft.Alpha( opacity = " + ( opacity * 100 ) + " )";
	opacity = opacity + delta;
	if ( opacity >= 0 && opacity <= 1) {
		setTimeout ( "_showPage ( " + opacity + ", " + delta + " )", 10 );
	} else {
		dOverlay.visibility = "hidden";
	}
}

function _moveIt() {
	if ( navigator.appName == "Netscape" || navigator.appName == "Opera" ) {
		windowWidth = window.innerWidth;
		windowHeight = window.innerHeight;
		windowOffset = window.pageYOffset;
	} else if ( document.documentElement.clientWidth ) {
		windowWidth = document.documentElement.clientWidth;
		windowHeight = document.documentElement.clientHeight;
		windowOffset = document.documentElement.scrollTop;
	} else {
		windowWidth = document.body.clientWidth;
		windowHeight = document.body.clientHeight;
		windowOffset = document.body.scrollTop;
	}
	offset = Math.floor (( windowWidth - 400 ) / 2 );
	offset < 0 ? offset = 10 : offset;
	dPopUp.style.left = offset + 'px';
	offset = Math.floor (( windowHeight - 300 ) / 2 );
	offset < 0 ? offset = 10 : offset;
	dPopUp.style.top = eval( windowOffset + offset ) + 'px';
}

function _showIt ( name ) {
	_moveIt();
	dPopUp.innerHTML = '<img src="img/' + name + '.jpg">';
	dPopUp.style.visibility = "visible";
}

function _hideIt() {
	dPopUp.style.visibility = "hidden";
}

if ( window.addEventListener ) {
	window.addEventListener ( "load", _centerBox, false );
	window.addEventListener ( "resize", _centerBox, false );
	window.addEventListener ( "resize", _moveIt, false );
	window.addEventListener ( "scroll", _moveIt, false );
} else {
	window.attachEvent ( "onload", _centerBox );
	window.attachEvent ( "onresize", _centerBox );
	window.attachEvent ( "onresize", _moveIt );
	window.attachEvent ( "onscroll", _moveIt );
}