// JavaScript Document

var MIN_PAGE_HEIGHT = 700;

// Outputs the top menu
function top_menuOutputLoggedOut()
{
	document.write('<div id="top_menu_container" style="float: right">');
	document.write('<span class="top_menu_item_login"><a href="/fifzine/login">Login/sign up</a></span>');
	document.write('<span class="top_menu_item"><a href="/fifzine/">Home</a></span>');
	document.write('<span class="top_menu_item"><a href="/fifzine/links">Links</a></span>');
	document.write('<span class="top_menu_item"><a href="/fifzine/about">About</a></span>');
	document.write('<span class="top_menu_item"><a href="/fifzine/terms">Terms</a></span>');
	document.write('<span class="top_menu_item"><a href="/fifzine/contact">Contact</a></span>');
	document.write('<span class="top_menu_item"><a href="/fifzine/faq">FAQ</a></span>');
	document.write('</div>');
}

function top_menuOutputLoggedIn()
{
	document.write('<div id="top_menu_container" style="float: right">');
	document.write('<span class="top_menu_item_login"><a href="/fifzine/logout">Logout</a></span>');
	document.write('<span class="top_menu_item"><a href="/fifzine/">Home</a></span>');
	document.write('<span class="top_menu_item"><a href="/fifzine/links">Links</a></span>');
	document.write('<span class="top_menu_item"><a href="/fifzine/about">About</a></span>');
	document.write('<span class="top_menu_item"><a href="/fifzine/terms">Terms</a></span>');
	document.write('<span class="top_menu_item"><a href="/fifzine/contact">Contact</a></span>');
	document.write('<span class="top_menu_item"><a href="/fifzine/faq">FAQ</a></span>');
	document.write('</div>');
}

function top_menuResize()
{
	var parent1 = document.getElementById("content_area");
	if (parent1 == null) {
		return;
	}

	var thisChild = parent1.firstChild;
	var totalWidth = parseInt(getDIVWidth("side_bar")) + 10;

	while ( thisChild )
	{
		if ( thisChild.nodeType == 1 )
		{
			if (thisChild.className.indexOf("_col") != -1)
			{
				totalWidth += parseInt(getStyle(thisChild, "width"));
				totalWidth += 10;
			}
		}
		thisChild = thisChild.nextSibling;
	}

	totalWidth -= 20;
	totalWidth < 800 ? totalWidth = 800 : total_width = totalWidth;

	// Compensate for times when the columns might flow under each other and therefore the calculation for the top menu will be wrong.  Usually a <= 1024 thing...
	if ((totalWidth > 800) && (screen.width <= 1024))
	{
		totalWidth = 800;
	}
	// Compensate for full screen pages where the menu would be off the right hand side
	else if (totalWidth > 1200)
	{
		totalWidth = 1000;
	}


	var topmenu = document.getElementById("top_menu");
	topmenu.style.width = totalWidth + "px";
}

// Actually scrolls the graphic to the version with or without the ">" before the menu item.  For example, "MAGAZINE" and "> MAGAZINE".
function side_menuSwapImage(element, flag, level)
{
	//return;

	if (flag == 1)
	{
		if (level == 1)
		{
			element.style.backgroundPosition = "0px -13px";
		}

		if (level == 2)
		{
			element.style.backgroundPosition = "0px -18px";
		}
	}

	if (flag == 0)	// always 0px, the non-selected item in the graphic is at the top...
	{
		element.style.backgroundPosition = "0px 0px";
	}
}

// Outputs the side menu, including the mouseovers for the image "swapping".
function side_menuOutput(logged_in, active)
{
	if (logged_in == 1)
	{
		// Side menu : log out
		document.write('<div id="side_menu_logout" class="side_menu_top_level_item" style="background-image: url(/fifzine/images/structure/side_menu_logout.gif);" onmouseover="side_menuSwapImage(this, 1, 1);" onmouseout="side_menuSwapImage(this, 0, 1);" onclick="side_menuSelect(this);"></div>');
			document.write('<div class="side_menu_item_container">');
				// The submenu items in here, also graphics with mouseovers
			document.write('</div>');
	}
	else
	{
		// Side menu : log in
		document.write('<div id="side_menu_login" class="side_menu_top_level_item" style="background-image: url(/fifzine/images/structure/side_menu_login.gif);" onmouseover="side_menuSwapImage(this, 1, 1);" onmouseout="side_menuSwapImage(this, 0, 1);" onclick="side_menuToggle(this);"></div>');
		document.write('<div id="side_menu_login_container" class="side_menu_item_container">');
			document.write('<form id="login" class="side_menu_form" action="j_acegi_security_check" method="post" name="login_form">');
				document.write('<div class="side_menu_second_level_login"><img src="/fifzine/images/structure/heading_username.gif"></div>');
				document.write('<input type="text" class="side_menu_login_text_field" name="j_username" value="">');
				
				document.write('<div class="side_menu_second_level_login"><img src="/fifzine/images/structure/heading_password.gif"></div>');
				document.write('<input type="password" class="side_menu_login_text_field" name="j_password" value="">');
				
				document.write('<div class="side_menu_second_level_login">Remember Me</div>');
				document.write('<input type="checkbox" name="_acegi_security_remember_me"/>');
				
				document.write('<div class="side_menu_second_level_login">');
					document.write('<input type="image" src="/fifzine/images/structure/heading_search_go.gif">');
				document.write('</div>');
				document.write('<div class="side_menu_second_level_login">');
					document.write('<a href="/fifzine/register"><img src="/fifzine/images/structure/heading_join_fifzine.gif"></a>');
				document.write('</div>');
				document.write('<div class="side_menu_second_level_login">');
					document.write('<a href="/fifzine/reset"><img src="/fifzine/images/structure/heading_forgot_password.gif"></a>');
				document.write('</div>');
			document.write('</form>');
		document.write('</div>');
	}




	// Side menu : fifzine minutes
	document.write('<div id="side_menu_fifzineminutes" class="side_menu_top_level_item" style="background-image: url(/fifzine/images/structure/side_menu_fifzine_minutes.gif);" onmouseover="side_menuSwapImage(this, 1, 1);" onmouseout="side_menuSwapImage(this, 0, 1);" onclick="side_menuToggle(this);"></div>');
	document.write('<div id="side_menu_fifzineminutes_container" class="side_menu_item_container">');
		document.write('<div id="side_menu_fifzineminutes_minutes" class="side_menu_second_level_item" style="background-image: url(/fifzine/images/structure/side_menu_minutes_minutes.gif);" onmouseover="side_menuSwapImage(this, 1, 2);" onmouseout="side_menuSwapImage(this, 0, 2);" onclick="side_menuSelect(this);"></div>');
		document.write('<div id="side_menu_fifzineminutes_most" class="side_menu_second_level_item" style="background-image: url(/fifzine/images/structure/side_menu_minutes_most.gif);" onmouseover="side_menuSwapImage(this, 1, 2);" onmouseout="side_menuSwapImage(this, 0, 2);" onclick="side_menuSelect(this);"></div>');
		document.write('<div id="side_menu_fifzineminutes_random" class="side_menu_second_level_item" style="background-image: url(/fifzine/images/structure/side_menu_minutes_random.gif);" onmouseover="side_menuSwapImage(this, 1, 2);" onmouseout="side_menuSwapImage(this, 0, 2);" onclick="side_menuSelect(this);"></div>');
	document.write('</div>');
	
	// Side menu : your portfolio
	document.write('<div id="side_menu_yourportfolio" class="side_menu_top_level_item" style="background-image: url(/fifzine/images/structure/side_menu_your_portfolio.gif);" onmouseover="side_menuSwapImage(this, 1, 1);" onmouseout="side_menuSwapImage(this, 0, 1);" onclick="side_menuToggle(this);"></div>');
	document.write('<div id="side_menu_yourportfolio_container" class="side_menu_item_container">');
		document.write('<div id="side_menu_yourportfolio_overview" class="side_menu_second_level_item" style="background-image: url(/fifzine/images/structure/side_menu_portfolio_overview.gif);" onmouseover="side_menuSwapImage(this, 1, 2);" onmouseout="side_menuSwapImage(this, 0, 2);" onclick="side_menuSelect(this);"></div>');
		document.write('<div id="side_menu_yourportfolio_livechat" class="side_menu_second_level_item" style="background-image: url(/fifzine/images/structure/side_menu_portfolio_live_chat.gif);" onmouseover="side_menuSwapImage(this, 1, 2);" onmouseout="side_menuSwapImage(this, 0, 2);" onclick="side_menuSelect(this);"></div>');
		document.write('<div id="side_menu_edit_profile" class="side_menu_second_level_item" style="background-image: url(/fifzine/images/structure/side_menu_edit_profile.gif);" onmouseover="side_menuSwapImage(this, 1, 2);" onmouseout="side_menuSwapImage(this, 0, 2);" onclick="side_menuSelect(this);"></div>');
		document.write('<div id="side_menu_yourportfolio_edit" class="side_menu_second_level_item" style="background-image: url(/fifzine/images/structure/side_menu_portfolio_edit.gif);" onmouseover="side_menuSwapImage(this, 1, 2);" onmouseout="side_menuSwapImage(this, 0, 2);" onclick="side_menuSelect(this);"></div>');
	document.write('</div>');
	
	// Side menu : explore
	document.write('<div id="side_menu_explore" class="side_menu_top_level_item" style="background-image: url(/fifzine/images/structure/side_menu_explore.gif);" onmouseover="side_menuSwapImage(this, 1, 1);" onmouseout="side_menuSwapImage(this, 0, 1);" onclick="side_menuSelect(this);"></div>');
	document.write('<div class="side_menu_item_container">');
		// The submenu items in here, also graphics with mouseovers
	document.write('</div>');
	
	// Side menu : magazine
	document.write('<div id="side_menu_magazine" class="side_menu_top_level_item" style="background-image: url(/fifzine/images/structure/side_menu_magazine.gif);" onmouseover="side_menuSwapImage(this, 1, 1);" onmouseout="side_menuSwapImage(this, 0, 1);" onclick="side_menuToggle(this);"></div>');
	document.write('<div id="side_menu_magazine_container" class="side_menu_item_container">');
		document.write('<div id="side_menu_magazine_currentissue" class="side_menu_second_level_item" style="background-image: url(/fifzine/images/structure/side_menu_magazine_current_issue.gif);" onmouseover="side_menuSwapImage(this, 1, 2);" onmouseout="side_menuSwapImage(this, 0, 2);" onclick="side_menuSelect(this);"></div>');
		document.write('<div id="side_menu_magazine_archive" class="side_menu_second_level_item" style="background-image: url(/fifzine/images/structure/side_menu_magazine_archive.gif);" onmouseover="side_menuSwapImage(this, 1, 2);" onmouseout="side_menuSwapImage(this, 0, 2);" onclick="side_menuSelect(this);"></div>');
	document.write('</div>');


	// Side menu : about
	document.write('<div id="side_menu_about" class="side_menu_top_level_item" style="background-image: url(/fifzine/images/structure/side_menu_about.gif);" onmouseover="side_menuSwapImage(this, 1, 1);" onmouseout="side_menuSwapImage(this, 0, 1);" onclick="side_menuSelect(this);"></div>');
	document.write('<div class="side_menu_item_container">');
		// The submenu items in here, also graphics with mouseovers
	document.write('</div>');


	if (active != undefined && active != "")
	{
		var element = document.getElementById(active);
		side_menuToggle(element);
	}
}

// Expands a side menu top level item to show its sub-menu
function side_menuToggle(element)
{
	//return;

	var parent_id = element.getAttribute("id");
	var container = document.getElementById(parent_id + "_container");

	
	if (getStyle(container, "display") == "none")
	{
		container.style.display = "block";
		side_menuSetSpacerHeightSlide(1);
	}
	else if (getStyle(container, "display") == "block")
	{
		container.style.display = "none";
		side_menuSetSpacerHeightSlide(1);
	}
}

function side_menuSelect(element)
{
	switch (element.id)
	{
		

		// Magazine > Current Issue
		case "side_menu_magazine_currentissue": {
			document.location.href = "/fifzine/magazine";
		}
		break;

		// Magazine > Archive
		case "side_menu_magazine_archive": {
			document.location.href = "/fifzine/archive";
		}
		break;

		// Fifzine Minutes > Fifzine Minutes
		case "side_menu_fifzineminutes_minutes": {
			document.location.href = "/fifzine/minutes";
		}
		break;

		// Fifzine Minutes > Fifzine Most
		case "side_menu_fifzineminutes_most": {
			document.location.href = "/fifzine/mostever";
		}
		break;

		// Fifzine Minutes > Random
		case "side_menu_fifzineminutes_random": {
			document.location.href = "/fifzine/random";
		}
		break;

		// Fifzine Minutes > Explore
		case "side_menu_explore": {
			document.location.href = "/fifzine/explore";
		}
		break;

		// Your Portfolio
		case "side_menu_yourportfolio": {
			document.location.href = "/fifzine/portfolios";
		}
		break;

		// Your Portfolio > Overview
		case "side_menu_yourportfolio_overview": {
			document.location.href = "/fifzine/portfolios";
		}
		break;

		// Your Portfolio > Live Chat
		case "side_menu_yourportfolio_livechat": {
			document.location.href = "/fifzine/network";
		}
		break;

		// Your Portfolio > Edit Profile
		case "side_menu_edit_profile": {
			document.location.href = "/fifzine/profile/";
		}
		break;

		// Your Portfolio > Edit
		case "side_menu_yourportfolio_edit": {
			document.location.href = "/fifzine/updateProject";
		}
		break;

		// About
		case "side_menu_about": {
			document.location.href = "/fifzine/about";
		}
		break;

		// Logout
		case "side_menu_logout": {
			document.location.href = "/fifzine/logout";
		}
		break;

	}
}

function post_loadAdjustments()
{
	// First we need to check the screen size and adjust the className for each of the columns...
	adjustColumnsForWidth();
	// The new moving menu function, now includes the moving logo as well...
	side_menuSetSpacerHeightSlide();
	// Resize the top menu to the width of the page...
	top_menuResize();
}

function side_menuSetSpacerHeight()
{
	// Unused but here just in case it's called somewhere.  To be removed once tested.
}

var global_scroll_y;
var global_window_height;
var global_min = -1;

function side_menuSetSpacerHeightSlide(force)
{
	var scroll_y;
	var window_height;
	var padding = 30;	// conditional on browser type

	if (self.pageYOffset) // all except Explorer
	{
		scroll_y = self.pageYOffset;
	}
	else if (document.documentElement && document.documentElement.scrollTop)
		// Explorer 6 Strict
	{
		scroll_y = document.documentElement.scrollTop;
	}
	else if (document.body) // all other Explorers
	{
		scroll_y = document.body.scrollTop;
	}

	if (self.innerHeight) // all except Explorer
	{
		window_height = self.innerHeight;
		padding = 50;
	}
	else if (document.documentElement && document.documentElement.clientHeight)
		// Explorer 6 Strict Mode
	{
		window_height = document.documentElement.clientHeight;
	}
	else if (document.body) // other Explorers
	{
		window_height = document.body.clientHeight;
	}

	if ((scroll_y != global_scroll_y) || (window_height != global_window_height) || force != undefined)
	{
		var spacerHeight = getDIVHeight("side_spacer");
		var logo_height = getDIVHeight("side_logo");
		var menu_height = getDIVHeight("side_menu");

		var spacer = document.getElementById("side_spacer");
		spacer.style.height = window_height - padding - logo_height - menu_height + "px";

		spacer = document.getElementById("side_logo_spacer");
		spacer.style.height = scroll_y + "px";

		global_scroll_y = scroll_y;
		global_window_height = window_height;
	}

	setTimeout(side_menuSetSpacerHeightSlide, 30);
}

function getDIVHeight(element)
{
	var a = document.getElementById(element);

	return a.offsetHeight;
}

function getDIVWidth(element)
{
	var a = document.getElementById(element);

	return a.offsetWidth;
}

function getStyle(oElm, strCssRule)
{
	var strValue = "";

	if (document.defaultView && document.defaultView.getComputedStyle)
	{
		try {
			strValue = document.defaultView.getComputedStyle(oElm, "").getPropertyValue(strCssRule);
		}
		catch (err)
		{
			if (strCssRule == "display")
			{
				strValue = "none";
			}
			else
			{
				oElm.style.display = "block";
				strValue = document.defaultView.getComputedStyle(oElm, "").getPropertyValue(strCssRule);
				oElm.style.display = "none";
			}
		}
		// getComputedStyle doesn't work with Safari if the element is display:none so check for a non-valid return.  Then show
		// the element, read it again, hide the element and return the result.  It might still be null in which case it was 
		//supposed to be.
	}
	else if (oElm.currentStyle)
	{
		strCssRule = strCssRule.replace(/-(w)/g, function (strMatch, p1){
			return p1.toUpperCase();
		});
		strValue = oElm.currentStyle[strCssRule];
	}

	return strValue;
}

function findPos(obj)
{
	var curleft = curtop = 0;

	if (obj.offsetParent)
	{
		curleft = obj.offsetLeft;
		curtop = obj.offsetTop;

		while (obj = obj.offsetParent)
		{
			curleft += obj.offsetLeft;
			curtop += obj.offsetTop;
		}
	}
	return [curleft,curtop];
}

function thumbnailPopupOutput()
{
    document.write('<div id="thumbnail_popup" class="thumbnail_popup_portrait" onmouseout="return thumbnailPopupClose(this, event);" onclick="return thumbnailPopupClose(this);">');
	document.write('	<div id="thumbnail_popup_picture" class="thumbnail_popup_picture"><img src="images/pictures/picture0008.jpg"></div>');
	document.write('	<div id="thumbnail_popup_title" class="thumbnail_popup_title"> The Icelandic Pop Warrior Returns </div>');
	document.write('	<div id="thumbnail_popup_category" class="thumbnail_popup_sub_title"> Photography </div>');
	document.write('	<div id="thumbnail_popup_author" class="thumbnail_popup_author"> Alexander Gader </div>');
	document.write('	<div id="thumbnail_popup_media_icon" class="media_icon">');
	document.write('	</div>');		
	document.write('	<div class="clock"> ');
	document.write('		<div class="clock_image"><img src="images/structure/clock.gif"></div>');
	document.write('		<div id="thumbnail_popup_clock" class="clock_time">100h : 22h : 15m</div>');
	document.write('	</div>');
	document.write('	<br clear="all">');
	document.write('	<div id="thumbnail_popup_links" class="thumbnail_popup_links">');
	document.write('		<div id="thumbnail_popup_remove_content" class="thumbnail_popup_links_link"><a href="#"><img src="images/structure/remove_content.gif"></a></div>');
	document.write('		<div id="thumbnail_popup_edit_content" class="thumbnail_popup_links_link"><a href="#"><img src="images/structure/edit_content.gif"></a></div>');
	document.write('	</div>');
	document.write('</div>');
}

function thumbnailNetworkPopupOutput()
{
	document.write('<div id="thumbnail_popup_network" class="thumbnail_popup_network" onmouseout="return thumbnailNetworkPopupClose(this, event);" onclick="thumbnailNetworkPopupClose(this);">');
	document.write('	<div class="thumbnail_popup_network_picture_container">');
	document.write('		<div id="thumbnail_popup_network_picture" class="thumbnail_popup_network_picture"><img src="images/structure/profile_generic_sm.gif"></div>');
	document.write('	</div>');
	document.write('	<div class="thumbnail_popup_network_text_container">');
	document.write('		<div id="thumbnail_popup_network_author" class="thumbnail_popup_network_author"> Alexander Gnaediger </div>');
	document.write('		<div id="thumbnail_popup_network_category" class="thumbnail_popup_network_sub_title"> Photography </div>');
	document.write('	</div>');
	document.write('	<br clear="all">');
	document.write('	<div id="thumbnail_popup_network_links" class="thumbnail_popup_network_links">');
	document.write('		<div id="thumbnail_popup_network_send_message" class="thumbnail_popup_network_links_link"><a href="#"><img src="images/structure/send_message.gif"></a></div>');
	document.write('		<div id="thumbnail_popup_network_view_profile" class="thumbnail_popup_network_links_link"><a href="#"><img src="images/structure/view_profile.gif"></a></div>');
	document.write('		<div id="thumbnail_popup_network_remove_user" class="thumbnail_popup_network_links_link"><a href="#"><img src="images/structure/remove_user.gif"></a></div>');
	document.write('	</div>');
	document.write('</div>');
}

// Two variables to save the currently highlighted thumbnail and thumbnail number in
var current_thumbnail = current_thumbnail_number = current_popup = 0;
var globalPopupTop, globalPopupLeft, globalPopupWidth, globalPopupHeight;
var globalCurrentThumbnailTop, globalCurrentThumbnailLeft, globalCurrentThumbnailWidth, globalCurrentThumbnailHeight;


function thumbnailOnClick(element, title, category, author, clock_days, clock_hours, clock_mins, picture_url, orientation, media_icon, content_url, edit_content_url, remove_content_url)
{
	// Get the object for the thumbnail popup
	var thumbnail_popup = document.getElementById("thumbnail_popup");
	var authorLink = "/fifzine/artists/" + author;

	// Make sure the popup is valid
	if (thumbnail_popup == null)
	{
		return;
	}

	switch (orientation)
	{
		case 's':
			thumbnail_popup.className = "thumbnail_popup";
			break;

		case 'l':
			thumbnail_popup.className = "thumbnail_popup_landscape";
			break;

		case 'p':
			thumbnail_popup.className = "thumbnail_popup_portrait";
			break;

		default:
			thumbnail_popup.className = "thumbnail_popup";
			break;
	}

	// Change the picture
	var img = document.getElementById("thumbnail_popup_picture");

	// Change the title
	a = document.getElementById("thumbnail_popup_title");
	if (content_url != undefined)
	{
		a.innerHTML = "<a href='" + content_url + "'>" + title + "</a>";
		img.innerHTML = "<a href='" + content_url + "'><img src='"+picture_url+"' onload='repositionPopup();'></a>";
	}
	else
	{
		a.innerHTML = title;
		img.innerHTML = "<img src='"+picture_url+"' onload='repositionPopup();'></a>";
	}

	// Change the category
	a = document.getElementById("thumbnail_popup_category");
	a.innerHTML = category;

	// Change the media icon
	a = document.getElementById("thumbnail_popup_media_icon");
	a.innerHTML = "<img src='images/structure/" + media_icon + "_icon.jpg'>";

	// Change the author
	a = document.getElementById("thumbnail_popup_author");
	a.innerHTML = "<a href='" + authorLink + "'>"+author+"</a>";

	// Change the clock
	a = document.getElementById("thumbnail_popup_clock");
	a.innerHTML = clock_days + "d : " + clock_hours + "h : " + clock_mins + "m";


	try {
		// Change the fifzine clock
		a = document.getElementById("fifzine_clock_days");
		a.innerHTML = clock_days;
		a = document.getElementById("fifzine_clock_hours");
		a.innerHTML = clock_hours;
		a = document.getElementById("fifzine_clock_minutes");
		a.innerHTML = clock_mins;
	}
	catch (err) {
	}

	var pos = new Array;
	// Find the position of the clicked thumbnail so we can open the popup relative to it, even though the popup is actually absolute and overlaid on the thumbnail(s)
	pos = findPos(element);

	if ((edit_content_url == undefined && remove_content_url == undefined) || (edit_content_url == 'null' && remove_content_url == 'null'))
	{
		a = document.getElementById("thumbnail_popup_links");
		a.style.display = 'none';
	}
	else
	{
		a = document.getElementById("thumbnail_popup_links");
		a.style.display = 'block';

		if (edit_content_url != undefined && edit_content_url != 'null')
		{
			a = document.getElementById("thumbnail_popup_edit_content");
			a.style.display = 'inline';
			a.innerHTML = '<a href="' + edit_content_url + '"><img src="images/structure/edit_content.gif"></a>';
		}
		else
		{
			a = document.getElementById("thumbnail_popup_edit_content");
			a.style.display = 'none';
		}

		if (remove_content_url != undefined && remove_content_url != 'null')
		{
			a = document.getElementById("thumbnail_popup_remove_content");
			a.style.display = 'inline';
			a.innerHTML = '<a href="' + remove_content_url + '"><img src="images/structure/remove_content.gif"></a>';
		}
		else
		{
			a = document.getElementById("thumbnail_popup_remove_content");
			a.style.display = 'none';
		}
	}

	// Append _selected the end of the className to highlight it
	element.className = element.className + "_selected";

	if (current_thumbnail)
	{
		// Take _selected off the end of the className to unhighlight it
		current_thumbnail.className = current_thumbnail.className.substring(0, current_thumbnail.className.lastIndexOf("_selected"));

		if (current_thumbnail_number)
		{
			// Take _selected off the end of the className to unhighlight it
			current_thumbnail_number.className = current_thumbnail_number.className.substring(0, current_thumbnail_number.className.lastIndexOf("_selected"));
		}
	}

	// As long as a child node can be found (i.e. the DIV with the number in it)
	if (element.hasChildNodes())
	{
		var found_something = 0;

		for (var i = 0; i < element.childNodes.length; i++)
		{
			// find the first DIV which will be the number...because there's only one child DIV
			if (element.childNodes[i].nodeName == "DIV" && element.childNodes[i].className == "thumbnail_number")
			{
				// Append _selected the end of the className to highlight it
				element.childNodes[i].className = element.childNodes[i].className + "_selected";

				// Save the thumbnail number reference, so we don't have to search for it again when it's unhighlighted
				current_thumbnail_number = element.childNodes[i];

				found_something = 1;
			}
		}

		if (found_something == 0)
		{
			current_thumbnail_number = 0;
		}
	}
	else
	{
		current_thumbnail_number = 0;
	}

	// Show it briefly
	thumbnail_popup.style.display = "block";

	thumbnail_popup_width = thumbnail_popup.offsetWidth;
	thumbnail_popup_height = thumbnail_popup.offsetHeight;

	// Hide it again
	thumbnail_popup.style.display = "none";

	var c = document.getElementById("side_bar");
	var sidebar_width = parseInt(getStyle(c, "width"));
	// Show the thumbnail popup and set its position to relative to the clicked thumbnail
	if (pos[0] + 20 - thumbnail_popup_width < sidebar_width)
	{
		thumbnail_popup.style.left = pos[0] + 20 + "px";
	}
	else
	{
		thumbnail_popup.style.left = pos[0] + 20 - thumbnail_popup_width + "px";
	}
	
    var port = viewport();
    var scroll = scrollOffset();
    var maxy = port.height + scroll.y;
    
    var y = pos[1] + 50;
    if (y > maxy - (thumbnail_popup_height + 2)) {
        y = maxy - (thumbnail_popup_height + 2);
    }

    thumbnail_popup.style.top = y + "px";
	thumbnail_popup.style.display = "block";

	globalPopupTop = parseInt(thumbnail_popup.style.top) - 1;
	globalPopupLeft = parseInt(thumbnail_popup.style.left) - 1;
	globalPopupWidth = parseInt(thumbnail_popup_width) + 2;
	globalPopupHeight = parseInt(thumbnail_popup_height) + 2;

	globalCurrentThumbnailTop = pos[1] - 1;
	globalCurrentThumbnailLeft = pos[0] - 1;
	globalCurrentThumbnailWidth = element.offsetWidth;
	globalCurrentThumbnailHeight = element.offsetHeight;

	thumbnailMouseMoveStart();
	//element.onmouseout = thumbnailPopupCloseViaThumbnailEvent;

	// Save the highlighted thumbnail so we can unhighlight it when either another thumbnail is clicked, or the popup is closed
	current_thumbnail = element;
	current_popup = "popup";
}

function repositionPopup()
{
    var thumbnail_popup = document.getElementById("thumbnail_popup");
	var thumbnail_popup_height = parseInt(thumbnail_popup.offsetHeight) + 2;

    var port = viewport();
    var scroll = scrollOffset();
    var maxy = port.height + scroll.y;
    
    var y = globalCurrentThumbnailTop + 50;
    if (y > maxy - thumbnail_popup_height) {
        y = maxy - thumbnail_popup_height;
    }
	globalPopupHeight = parseInt(thumbnail_popup_height);

    thumbnail_popup.style.top = y + "px";
}

// Used for both types of popup
function thumbnailPopupCloseViaThumbnailEvent(e)
{
// NOTE

// THIS IS NOT USED NOW.  THE EVENT WHICH CLOSES A POP-UP IF YOU LEAVE A THUMBNAIL IS THE MOUSEMOVE EVENT.
// IT CHECKS THE CO-ORDINATES SO THAT THE BUBBLING (thumbnail corner number) ISN'T A PROBLEM, OR FAST
// MOUSE MOVEMENT

/*
	if (!e) e = window.event;
	var activated = eventTarget(e);

	var related = e.relatedTarget || e.toElement;

	// If the parent of the DIV we just left is the same as the DIV we just entered, don't do anything and cancel the bubbling.
	// Same for the opposite...
	// This is just for the number in the corner but would work for anything else which is a child of the thumbnail DIV.
	if ((activated.parentNode == related && activated.parentNode.className.indexOf("_selected") != -1) || (related.parentNode == activated && activated.parentNode.className.indexOf("_selected") != -1))
	{
		if (e.stopPropagation) {
			e.stopPropagation();
		} else {
			e.cancelBubble = true;
		}
		return;
	}

	if (related.id.indexOf("thumbnail_popup") == -1)
	{
		if (related.id == undefined || related.id == "")
		{
			if (related.parentNode.id.indexOf("thumbnail_popup") != -1)
			{
				return;
			}
		}

		e.onmouseout = null;
		if (current_popup == "popup")
		{
			//var element = document.getElementById("thumbnail_popup");	// main popup
			thumbnailPopupClose("thumbnail_popup");
		}
		else
		{
			//var element = document.getElementById("thumbnail_popup_network");	// network popup
			thumbnailNetworkPopupClose("thumbnail_popup_network");
		}
	}
*/
}

function pageWidth() {return window.innerWidth != null? window.innerWidth : document.documentElement && document.documentElement.clientWidth ?       document.documentElement.clientWidth : document.body != null ? document.body.clientWidth : null;} function pageHeight() {return  window.innerHeight != null? window.innerHeight : document.documentElement && document.documentElement.clientHeight ?  document.documentElement.clientHeight : document.body != null? document.body.clientHeight : null;} function posLeft() {return typeof window.pageXOffset != 'undefined' ? window.pageXOffset :document.documentElement && document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft ? document.body.scrollLeft : 0;} function posTop() {return typeof window.pageYOffset != 'undefined' ?  window.pageYOffset : document.documentElement && document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop ? document.body.scrollTop : 0;} function posRight() {return posLeft()+pageWidth();} function posBottom() {return posTop()+pageHeight();}
                    
function thumbnailPopupClose(element, event)
{
	if (typeof element == "object")
	{
		var event = event || window.event;
	
		if (event != undefined)
		{
			var target = eventTarget(event);
		
			var related = event.relatedTarget || event.toElement;
	
			// Moved from the popup to its thumbnail
			if (related == current_thumbnail)
			{
			
				if (event.stopPropagation) {
					event.stopPropagation();
				} else {
					event.cancelBubble = true;
				}
				return;
			}
	
			var contained;
			while (related.parentNode != document) {
				if (related.parentNode == element) {
					contained = true;
					break;
				}
				related = related.parentNode;
			}
	
			if (target != element || contained) {
				if (event.stopPropagation) {
					event.stopPropagation();
				} else {
					event.cancelBubble = true;
				}
				return;
			}
		}
	}
	else
	{
		element = document.getElementById(element);
	}

	// Hide the popup when the user clicks on it
	element.style.display = "none";

	document.onmousemove = null;

	// If a reference to the thumbnail which opened the popup was saved
	if (current_thumbnail)
	{
		// Take _selected off the end of the className to unhighlight it
		current_thumbnail.className = current_thumbnail.className.substring(0, current_thumbnail.className.lastIndexOf("_selected"));
		// If a thumbnail number reference has been saved
		if (current_thumbnail_number)
		{
			// Take _selected off the end of the className to unhighlight it
			current_thumbnail_number.className = current_thumbnail_number.className.substring(0, current_thumbnail_number.className.lastIndexOf("_selected"));
		}
	}

	try {
		// Change the fifzine clock
		var a = document.getElementById("fifzine_clock_hours");
		a.innerHTML = "0";
		a = document.getElementById("fifzine_clock_minutes");
		a.innerHTML = "0";
		a = document.getElementById("fifzine_clock_seconds");
		a.innerHTML = "0";
	}
	catch (err) {
	}

	// The popup was closed by clicking on it so there's not going to be a "current" thumbnail which has been highlighted, therefore clear the saved references
	current_thumbnail = 0;
	current_thumbnail_number = 0;
}

var mousemoveTimeout = 0;
var mousemoveTimeoutLimit = 50;	// 1/20th of a second

// The popup was first entered after opening
function thumbnailMouseMoveStart()
{
	mousemoveTimeout = 0;
	document.onmousemove = thumbnailMouseMove;
}

function thumbnailMouseMove(e)
{
	if (!e) var e = window.event;

	var d = new Date();

	if ((d.getTime() - mousemoveTimeout) > mousemoveTimeoutLimit)
	{
		if (e.clientX < (parseInt(globalPopupLeft) - posLeft()) || e.clientX > (parseInt(globalPopupLeft) - posLeft() + globalPopupWidth) || e.clientY < (parseInt(globalPopupTop) - posTop()) || e.clientY > (parseInt(globalPopupTop) - posTop() + globalPopupHeight))
		{
			if (e.clientX < (parseInt(globalCurrentThumbnailLeft) - posLeft()) || e.clientX > (parseInt(globalCurrentThumbnailLeft) - posLeft() + globalCurrentThumbnailWidth) || e.clientY < (parseInt(globalCurrentThumbnailTop) - posTop()) || e.clientY > (parseInt(globalCurrentThumbnailTop) - posTop() + globalCurrentThumbnailHeight))
			{
				var related = e.srcElement || e.target;
	
				if (current_popup == "popup")
				{
					if (related != current_thumbnail)
					{
						//var element = document.getElementById("thumbnail_popup");	// main popup
						thumbnailPopupClose("thumbnail_popup");
					}
				}
				else if (current_popup == "popup_network")
				{
					if (related != current_thumbnail_network)
					{
						//var element = document.getElementById("thumbnail_popup_network");	// network popup
						thumbnailNetworkPopupClose("thumbnail_popup_network");
					}
				}
	
				mousemoveTimeout = 0;
			}
		}
		else
		{
			mousemoveTimeout = d.getTime();
		}
	}
}


// Variable to save the currently highlighted thumbnail in
var current_thumbnail_network;

function thumbnailNetworkOnClick(element, username, author, category, link_url, picture_url, remove_user_url, view_profile_url, send_message_url)
{
	// Get the object for the thumbnail popup
	var thumbnail_popup_network = document.getElementById("thumbnail_popup_network");

	// Make sure the popup is valid
	if (thumbnail_popup_network == null)
	{
		return;
	}

	// Change the title
	var a = document.getElementById("thumbnail_popup_network_author");
	a.innerHTML = "<a href='/fifzine/profile/" + username + "'>" + author + "</a>";

	// Change the category
	a = document.getElementById("thumbnail_popup_network_category");
	a.innerHTML = category;

	if (picture_url != undefined)
	{
		// Change the picture
		var img = document.getElementById("thumbnail_popup_network_picture");

		if (link_url != undefined)
		{
			img.innerHTML = "<a href='" + link_url + "'><img src='"+picture_url+"'></a>";
		}
		else
		{
			img.innerHTML = "<img src='"+picture_url+"'>";
		}
	}

	var pos = new Array;
	// Find the position of the clicked thumbnail so we can open the popup relative to it, even though the popup is actually absolute and overlaid on the thumbnail(s)
	pos = findPos(element);

	if ((remove_user_url == undefined && view_profile_url == undefined && send_message_url == undefined) || (remove_user_url == 'null' && view_profile_url == 'null' && send_message_url == 'null'))
	{
		a = document.getElementById("thumbnail_popup_network_links");
		a.style.display = 'none';
	}
	else
	{
		a = document.getElementById("thumbnail_popup_network_links");
		a.style.display = 'block';

		if ((remove_user_url != undefined) && (remove_user_url != 'null'))
		{
			a = document.getElementById("thumbnail_popup_network_remove_user");
			a.style.display = 'inline';
			a.innerHTML = '<a href="' + remove_user_url + '"><img src="images/structure/remove_user.gif"></a>';
		}
		else
		{
			a = document.getElementById("thumbnail_popup_network_remove_user");
			a.style.display = 'none';
		}

		if ((view_profile_url != undefined) && (view_profile_url != 'null'))
		{
			a = document.getElementById("thumbnail_popup_network_view_profile");
			a.style.display = 'inline';
			a.innerHTML = '<a href="' + view_profile_url + '"><img src="images/structure/view_profile.gif"></a>';
		}
		else
		{
			a = document.getElementById("thumbnail_popup_network_view_profile");
			a.style.display = 'none';
		}

		if ((send_message_url != undefined) && (send_message_url != 'null'))
		{
			a = document.getElementById("thumbnail_popup_network_send_message");
			a.style.display = 'inline';
			a.innerHTML = '<a href="' + send_message_url + '"><img src="images/structure/send_message.gif"></a>';
		}
		else
		{
			a = document.getElementById("thumbnail_popup_network_send_message");
			a.style.display = 'none';
		}
	}

	// Append _selected the end of the className to highlight it
	element.className = element.className + "_selected";

	if (current_thumbnail_network)
	{
		// Take _selected off the end of the className to unhighlight it
		current_thumbnail_network.className = current_thumbnail_network.className.substring(0, current_thumbnail_network.className.lastIndexOf("_selected"));
	}

	// Show it briefly
	thumbnail_popup_network.style.display = "block";

	thumbnail_popup_network_width = thumbnail_popup_network.offsetWidth;
	thumbnail_popup_network_height = thumbnail_popup_network.offsetHeight;

	// Hide it again
	thumbnail_popup_network.style.display = "none";

	var c = document.getElementById("side_bar");
	var sidebar_width = parseInt(getStyle(c, "width"));
	// Show the thumbnail popup and set its position to relative to the clicked thumbnail
	if (pos[0] + 20 - thumbnail_popup_network_width < sidebar_width)
	{
		thumbnail_popup_network.style.left = pos[0] + 20 + "px";
	}
	else
	{
		thumbnail_popup_network.style.left = pos[0] + 20 - thumbnail_popup_network_width + "px";
	}

	if (pos[1] + thumbnail_popup_network_height > posBottom())
	{
		thumbnail_popup_network.style.top = pos[1] - thumbnail_popup_network_height + 50 + "px";
	}
	else
	{
		thumbnail_popup_network.style.top = pos[1] + 50 + "px";
	}

	thumbnail_popup_network.style.display = "block";

	globalPopupTop = parseInt(thumbnail_popup_network.style.top) - 1;
	globalPopupLeft = parseInt(thumbnail_popup_network.style.left) - 1;
	globalPopupWidth = parseInt(thumbnail_popup_network_width) + 2;
	globalPopupHeight = parseInt(thumbnail_popup_network_height) + 2;

	globalCurrentThumbnailTop = pos[1] - 1;
	globalCurrentThumbnailLeft = pos[0] - 1;
	globalCurrentThumbnailWidth = element.offsetWidth;
	globalCurrentThumbnailHeight = element.offsetHeight;

	thumbnailMouseMoveStart();
	//element.onmouseout = thumbnailPopupCloseViaThumbnailEvent;

	// Save the highlighted thumbnail so we can unhighlight it when either another thumbnail is clicked, or the popup is closed
	current_thumbnail_network = element;
	current_popup = "popup_network";
}

function thumbnailNetworkPopupClose(element, event)
{
	if (typeof element == "object")
	{
		var event = event || window.event;
	
		if (event != undefined)
		{
			var event = event || window.event;
			var target = eventTarget(event);
		
			var related = event.relatedTarget || event.toElement;
	
			// Moved from the popup to its thumbnail
			if (related == current_thumbnail_network)
			{
				if (event.stopPropagation) {
					event.stopPropagation();
				} else {
					event.cancelBubble = true;
				}
				return;
			}
			else
			{
			}
	
			var contained;
			while (related.parentNode != document) {
				if (related.parentNode == element) {
					contained = true;
					break;
				}
				related = related.parentNode;
			}
			
			if (target != element || contained) {
				if (event.stopPropagation) {
					event.stopPropagation();
				} else {
					event.cancelBubble = true;
				}
				return;
			}
		}
	}
	else
	{
		element = document.getElementById(element);
	}


	// Hide the popup when the user clicks on it
	element.style.display = "none";

	document.onmousemove = null;

	// If a reference to the thumbnail which opened the popup was saved
	if (current_thumbnail_network)
	{
		// Take _selected off the end of the className to unhighlight it
		current_thumbnail_network.className = current_thumbnail_network.className.substring(0, current_thumbnail_network.className.lastIndexOf("_selected"));
	}

	// The popup was closed by clicking on it so there's not going to be a "current" thumbnail which has been highlighted, therefore clear the saved references
	current_thumbnail_network = 0;
}

function linksSwapImage(element, flag)
{
	if (flag == 1)
	{
		if (element.src.indexOf('_sel') == -1)	// not already highlighted
		{
			element.src = element.src.substring(0, element.src.indexOf('.gif')) + "_sel.gif";
		}
	}
	else
	{
		if (element.src.indexOf('_sel') != -1)	// highlighted
		{
			element.src = element.src.substring(0, element.src.indexOf('_sel')) + ".gif";
		}
	}
}

var scrollStep = 8;
var scrollLastElement = 0;
var scrollLastDirection = 0;

function scrollChildAfterDelay()
{
	if (scrollLastElement != 0)
	{
		scrollChild(scrollLastElement, scrollLastDirection);
	}
}

function scrollChild(a, direction)
{
	var element = document.getElementById(a);
	var scroll_y = parseInt(getStyle(element, "top"));
	var container_computed_height = getDIVHeight(a + "_container");

	var child_computed_height = -(getDIVHeight(a)) + container_computed_height;

	scroll_y += (direction * scrollStep);

	if (scroll_y >= 0 || scroll_y <= child_computed_height)
	{
		return;
	}

	element.style.top = scroll_y + "px";

	if (direction != 0)
	{
		scrollLastElement = a;
		scrollLastDirection = direction;
		setTimeout(scrollChildAfterDelay, 100);
	}
	else
	{
		scrollLastElement = 0;
		scrollLastDirection = 0;
	}
}

function eventTarget(event) {
    var target;
    if (!event) event = window.event;  
    if (event.target) {
        target = event.target;  
    } else if (event.srcElement) {  
        target = event.srcElement;  
    }  
      
    if (target.nodeType == 3) {  
        target = target.parentNode;  
    }  
      
    return target;  
}


function viewport() {
  var width = 0, height = 0;
  if( typeof( window.innerWidth ) == 'number' ) {
    //Non-IE
    width = window.innerWidth;
    height = window.innerHeight;

	if (navigator.userAgent.indexOf("Firefox")!= -1)
	{
		height -= 16;
	}

  } else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
    //IE 6+ in 'standards compliant mode'
    width = document.documentElement.clientWidth;
    height = document.documentElement.clientHeight;
  } else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
    //IE 4 compatible
    width = document.body.clientWidth;
    height = document.body.clientHeight;
  }
  
  return {width:width, height:height};
}

function scrollOffset() {
  var scrOfX = 0, scrOfY = 0;
  if( typeof( window.pageYOffset ) == 'number' ) {
    //Netscape compliant
    scrOfY = window.pageYOffset;
    scrOfX = window.pageXOffset;
  } else if( document.body && ( document.body.scrollLeft || document.body.scrollTop ) ) {
    //DOM compliant
    scrOfY = document.body.scrollTop;
    scrOfX = document.body.scrollLeft;
  } else if( document.documentElement && ( document.documentElement.scrollLeft || document.documentElement.scrollTop ) ) {
    //IE6 standards compliant mode
    scrOfY = document.documentElement.scrollTop;
    scrOfX = document.documentElement.scrollLeft;
  }
  
  return {x:scrOfX, y:scrOfY};
}

function adjustColumnsForWidth()
{
	if (screen.width <= 1024)
	{
		var c = document.getElementById("content_area");	// all pages have a content_area DIV holding the columns
		var childCounter = 0;

		// See if there are any programmes in this container
		if (c.hasChildNodes())
		{
			// Loop through the nodes
			for (j = 0; j < c.childNodes.length; j++)
			{
				if (c.childNodes[j].nodeType == 1)
				{
					if (c.childNodes[j].className.indexOf("_col_") != -1)
					{
						c.childNodes[j].className += "_1024";
					}
				}
			}
		}
	}
}

function setFullScreenContentColumnWidth(column_name)
{
	var columnObject = document.getElementById(column_name);
	var imageObject = document.getElementById("full_screen_image");
	var sidebarWidth = parseInt(getDIVWidth("side_bar"));

	if (imageObject.width > columnObject.offsetWidth)
	{
		columnObject.style.width = (imageObject.width + 10) + "px";	// the class takes care of the margin around the image
	}

	var new_whole_page_width = sidebarWidth + 10 + imageObject.width + 40;

	if (new_whole_page_width > 1258)
	{
		var whole_pageObject = document.getElementById("whole_page");
		whole_pageObject.style.width = new_whole_page_width + "px";
	}
}

var lastElement, lastPartner;

function updateRelatedField(element, partner_element)
{
	lastElement = element;
	lastPartner = partner_element;

	// Needs to be a delay so the latest keypress is registered
	setTimeout(updateRelatedFieldTwo, 20);
}

function updateRelatedFieldTwo()
{
	var destination = document.getElementById(lastPartner);

	destination.innerHTML = destination.title + lastElement.value;	// use value because it's a form field
}

function getCookie(name)
{
	var start = document.cookie.indexOf( name + "=" );
	var len = start + name.length + 1;

	if ((!start) && (name != document.cookie.substring(0, name.length)))
	{
		return null;
	}

	if (start == -1) return null;

	var end = document.cookie.indexOf( ";", len);

	if (end == -1) end = document.cookie.length;

	return unescape(document.cookie.substring(len, end));
}

function setCookie(name, value, expires, path, domain, secure)
{
	var today = new Date();
	today.setTime( today.getTime() );

	if (expires)
	{
		expires = expires * 1000 * 60 * 60 * 24;
	}

	var expires_date = new Date(today.getTime() + (expires));

	document.cookie = name+"="+escape(value) +
    ((expires) ? ";expires="+expires_date.toGMTString() : "") + 
    ((path) ? ";path=" + path : "" ) +
    ((domain) ? ";domain=" + domain : "" ) +
    ((secure) ? ";secure" : "" );
}

function deleteCookie(name, path, domain)
{
	if (getCookie(name)) document.cookie = name + "=" +
    ((path) ? ";path=" + path : "") +
    ((domain) ? ";domain=" + domain : "") +
    "; expires=Thu, 01-Jan-1970 00:00:01 GMT";
}

function readCookiesAndSetDropdowns(prefix)
{
	var value, dropdown;

	value = getCookie(prefix+"resultsPerPageSelection");
	if (value)
	{
		dropdown = document.getElementById("resultsPerPageSelection");
		dropdown.value = value;
	}

	value = getCookie(prefix+"sortBySelection");
	if (value)
	{
		dropdown = document.getElementById("sortBySelection");
		dropdown.value = value;
	}
}

function saveCookiesAndSubmit(prefix)
{
	var dropdown = document.getElementById("resultsPerPageSelection");
	setCookie(prefix+"resultsPerPageSelection", dropdown.value, 3650);
	dropdown = document.getElementById("sortBySelection");
	setCookie(prefix+"sortBySelection", dropdown.value, 3650);
}

function modalShow()
{
// Include this next line to reset the cookie
/*
deleteCookie("fifzineDontShowBox");

	var check = getCookie("fifzineDontShowBox");

	if (check != 1)
	{
		tb_show('', '#TB_inline?height=532&width=736&inlineId=hiddenModalContent&modal=true', '');
	}
*/

	tb_show('', '#TB_inline?height=532&width=736&inlineId=hiddenModalContent&modal=true', '');
}

function modalCloseAndSetCookies(origin)
{
	if (document.forms.modal_form.dont_show.checked)
	{
		setCookie("fifzineDontShowBox", 1, 3650);
	}

	tb_remove();

	if (origin == 2)	// from the link
	{
		document.location.href = "/fifzine/login";
	}
}