var itemIndex = 0;
function swapPicture(id, on) {
    var img = document.getElementById(id);
    img.src = id + (on ? "-on" : "") + ".gif";
}
function preload(href) {
    var img = new Image();
    img.src = href;
}
function swapMenuPicture(id, on) {
    var img = document.getElementById("menu-" + id);
    img.src = "menu-" + id + (on ? "-on" : "") + ".gif";
}
function item(name, current, rs, href, href_rs) {
	if (rs) {
		name += "-rs";
		href = href_rs;
	}
    if (!href) {
		href = name + ".html";
    }

    // Preload images
    preload("menu-" + name + ".gif");
    preload("menu-" + name + "-on.gif");
    document.write(
        "<td" + (itemIndex == 0 ? " colspan=2" : "") +
        " style=\"padding-right:" + (itemIndex != 7 ? "3" : "3") + "px\">" +
        "<a href=\"" + href + "\">" +
        "<img id=\"menu-" + name + "\" src=\"menu-" + name + (name == current ? "-on" : "") + ".gif\" " +
        (name != current ?
            "onmouseover=\"swapMenuPicture('" + name + "', 1);\" " +
            "onmouseout=\"swapMenuPicture('" + name + "', 0);\">" : "") +
        "</a></td>");
    itemIndex++;
}

DEFAULT_HEIGHT = 524;
var last_height;

function frameOpen(current, height)
{
	if (!height) {
		height = DEFAULT_HEIGHT;
	}
	last_height = height;
	
	var rs = current.substring(current.length - 3) == "-rs";
	var other_language;
	if (rs) {
	    other_language = current.substring(0, current.length - 3);
	}
	else {
		other_language = current + "-rs";
	}
	
    document.write(
        "<table width=\"100%\" height=\"100%\" cellpadding=0 cellspacing=0><tr>" +
        "<td align=\"center\">" +
        "<table cellpadding=0 cellspacing=0><tr><td>" +
		"<table cellpadding=0 cellspacing=0 width=100%><tr>");
    item("index", current, rs);
    item("our-story", current, rs);
    item("wedding", current, rs);
    item("registry", current, rs);
    item("wedding-party", current, rs);
    item("out-of-towners", current, rs);
    item("rsvp", current, rs, "rsvp.php", "rsvp-rs.php");
    item("contact-us", current, rs);
	
	var flag_link = other_language + ".html";
	if (current == "rsvp" || current == "rsvp-rs") {
		flag_link = other_language + ".php";
	}
	item("flag", current, rs, flag_link, flag_link);
	
    document.write(
        "<td align=\"right\" colspan=2><img src=\"border-top.gif\"></td></tr></table>" +
		"</td></tr>" +
	    "<tr><td>" +
		"<table cellpadding=0 cellspacing=0 width=100%><tr>" +
		"<td valign=bottom style=\"width:17px\"><img src=\"border-left.gif\" height=\"" + height + "px\" width=\"17px\"></td>" +
        "<td width=100% valign=\"top\" align=\"center\">");
}

function frameClose() {
    document.write(
        "</td>" +
        "<td align=\"right\" style=\"width:20px\"><img src=\"border-right.gif\" height=\"" + last_height + "px\" width=\"20px\"></td>" +
		"</tr></table>" +
		"</td></tr>" +
        "<tr><td><img src=\"border-bottom.gif\"></td></tr>" +
        "</table>");
}

function Fade(id, count) {
	this.count = count;
	this.current = 0;
	this.img = document.getElementById(id);
	
	this.addTransparency = function (step) {
		if (this.img.style.opacity == undefined || this.img.style.opacity == "") {
			this.img.style.opacity = 1;
		}
		this.img.style.opacity = eval(this.img.style.opacity + " + " + step);
		if (this.img.filters) {
			if (!this.img.style.filter) {
				this.img.style.filter = "alpha()";
			}
			this.img.filters.alpha.opacity = this.img.style.opacity * 100;
		}
		return this.img.style.opacity;
	}

	this.step = function (step, end) {
		var transparency = this.addTransparency(step);
		if (transparency > 0 && transparency < 1) {
			var fade = this;
			setTimeout(function() {fade.step(step, end)}, 50);
		}
		else {
			setTimeout(end, 50);
		}
	}

	this.outStart = function () {
		this.current = (this.current + 1) % this.count;
		this.img.src = "index-" + this.current + ".jpg";
		var fade = this;
		setTimeout(function() {fade.outEnd()}, 250);
	}

	this.outEnd = function () {
		var fade = this;
		this.step(0.1, function() {fade.inStart()});
	}

	this.inStart = function () {
		var fade = this;
		setTimeout(function() {fade.inEnd()}, 2000);
	}

	this.inEnd = function () {
		var fade = this;
		this.step(-0.1, function() {fade.outStart()});
	}
	
	this.inStart();
}
