//addEvent(window, 'load', initGeneratedImages);
addEvent(window, 'load', setColumnHeight);
addEvent(window, 'load', initButtonHover);
addEvent(window, 'load', initYearBrowser);
//addEvent(window, 'load', initAlphabet);

var font_size_ems = new Array('0.7','0.9','1.0','1.5','2.0','2.5','3');
var font_size_init = 3;
	
/**
 * Dynamically add images to certain content upon loading. This is for the benefit
 * of Internet Explorer, but all modern browsers may play. Called on window load.
 *
 * @param	void
 * @return	void
 * @author	brian ally, zijn digital - brian@zijn-digital.com
 **/

function initGeneratedImages()
{
	/* quit if this function has already been called (Opera, i'm looking at you)
	 */
    if (arguments.callee.done) return;

	/* The following array holds an object for each sort of generated image.
	 * tag:			the tag type to search for
	 * class_name:	the class name of the tag to filter
	 * img_src:		the source path of the generated image
	 * hover_src:	if the element's hover state should change the image, put the path here
	 * insert_at_end: if the image should be inserted at the end of the node instead of the beginning 
	 */
	var collection = Array(
							{
								tag: 'a',
								class_name: 'SearchOther',
								img_src: '/cm/images/interface/buttons/arrow_right.png',
								hover_src: '/cm/images/interface/buttons/arrow_right_hover.png'
							},
							{
								tag: 'a',
								class_name: 'Enlarge',
								img_src: '/cm/images/interface/buttons/btn_enlarge.png',
								hover_src: '/cm/images/interface/buttons/btn_enlarge_hover.png'
							},
							{
								tag: 'a',
								class_name: 'BoxLink',
								img_src: '/cm/images/interface/buttons/arrow_right.png',
								hover_src: '/cm/images/interface/buttons/arrow_right_hover.png'
							},
							{
								tag: 'a',
								class_name: 'BackToTop',
								img_src: '/cm/images/interface/buttons/arrow_to_top.png',
								hover_src: '/cm/images/interface/buttons/arrow_to_top_hover.png'
							},
							{
								tag: 'a',
								class_name: 'ViewAll',
								img_src: '/cm/images/interface/buttons/arrow_right.png',
								hover_src: '/cm/images/interface/buttons/arrow_right_hover.png'
							},
							{
								tag: 'a',
								class_name: 'PrevLink',
								img_src: '/cm/images/interface/buttons/arrow_left.png',
								hover_src: '/cm/images/interface/buttons/arrow_left_hover.png'
							},
							{
								tag: 'a',
								class_name: 'NextLink',
								img_src: '/cm/images/interface/buttons/arrow_right.png',
								hover_src: '/cm/images/interface/buttons/arrow_right_hover.png'
							},
							{
								tag: 'a',
								class_name: 'MoreLink',
								img_src: '/cm/images/interface/buttons/arrow_right.png',
								hover_src: '/cm/images/interface/buttons/arrow_right_hover.png'
							},
							{
								tag: 'a',
								class_name: 'CloseWindow',
								img_src: '/cm/images/interface/buttons/arrow_right_white.png',
								hover_src: '/cm/images/interface/buttons/arrow_right_blue.png'
							}
						   )

	for (i in collection)
	{
		var items = cm_getElementsByClassName(collection[i].tag, collection[i].class_name);
		
		if (items.length)
		{
			var img;
			
			for (j in items)
			{
				var t = items[j];
				/* create the image
				 */
				img = document.createElement('img');
				img.setAttribute('src', collection[i].img_src);
				
				// if there is a hover state, add a couple of extra attributes & functions to handle that
				/* 
				if (collection[i].hover_src)
				{
					// can't use setAttribute here
					 
					img.hover_src = collection[i].hover_src;
					img.tmp_src = '';
					
					// insert the image
					 
		
//					items[j].insertBefore(img, items[j].firstChild);
					
					// need to use dual anonymous functions in order to pass the params properly
					 
					items[j].onmouseover = (function(el, str)
					{
						return function()
						{
							el.src = str;
						}
					} (items[j].firstChild, items[j].firstChild.hover_src));
					
					items[j].onmouseout = function(el, str)
					{
						return function()
						{
							el.src = str;
						}
					} (img, img.src);
				}
				else if(collection[i].insert_at_end)
				{
//					items[j].appendChild(img, items[j].lastChild);
				}
				else
				{
//					items[j].insertBefore(img, items[j].firstChild);
				}
				*/
			}
		}
	}
	
	/* flag this function so it don't run twice
	 */
    arguments.callee.done = true;
}


/**
 * pre-load button images, set up mouse events, and replace images
 * with 8-bit ones for sucky browsers. Called on window load.
 *
 * @param	void
 * @return	void
 * @author	brian ally, zijn digital - brian@zijn-digital.com
 **/
function initButtonHover()
{
	if (arguments.callee.done) return;

	var collection = Array(
		{
			el_id: 'btn_open',
			hover_src: '/cm/images/interface/buttons/btn_open_24bit_hover.png',
			ie_src: '/cm/images/interface/buttons/btn_open_8bit.png',
			ie_hover_src: '/cm/images/interface/buttons/btn_open_8bit_hover.png',
			reg_event: 'click',
			event_handle: 'toggleThisIssue'
		},
		{
			el_id: 'btn_close',
			hover_src: '/cm/images/interface/buttons/btn_close_24bit_hover.png',
			ie_src: '/cm/images/interface/buttons/btn_close_8bit.png',
			ie_hover_src: '/cm/images/interface/buttons/btn_close_8bit_hover.png',
			reg_event: 'click',
			event_handle: 'toggleThisIssue'
		},
		{
			el_id: 'btn_search_tips_close',
			hover_src: '/cm/images/interface/buttons/btn_close_24bit_hover.png',
			ie_src: '/cm/images/interface/buttons/btn_close_8bit.png',
			ie_hover_src: '/cm/images/interface/buttons/btn_close_8bit_hover.png',
			reg_event: 'click',
			event_handle: 'toggleSearchTips'
		},
		{
			el_id: 'btn_email_form_close',
			hover_src: '/cm/images/interface/buttons/btn_close_24bit_hover.png',
			ie_src: '/cm/images/interface/buttons/btn_close_8bit.png',
			ie_hover_src: '/cm/images/interface/buttons/btn_close_8bit_hover.png',
			reg_event: 'click',
			event_handle: 'toggleEmailForm'
		},
		{
			el_id: 'btn_email_thanks_close',
			hover_src: '/cm/images/interface/buttons/btn_close_24bit_hover.png',
			ie_src: '/cm/images/interface/buttons/btn_close_8bit.png',
			ie_hover_src: '/cm/images/interface/buttons/btn_close_8bit_hover.png',
			reg_event: 'click',
			event_handle: 'toggleEmailThanks'
		},
		{
			el_id: 'btn_letter_to_editor_close',
			hover_src: '/cm/images/interface/buttons/btn_close_24bit_hover.png',
			ie_src: '/cm/images/interface/buttons/btn_close_8bit.png',
			ie_hover_src: '/cm/images/interface/buttons/btn_close_8bit_hover.png',
			reg_event: 'click',
			event_handle: 'toggleEmailEditor'
		},
		{
			el_id: 'btn_archive_search',
			hover_src: '/cm/images/interface/buttons/btn_archive_search_hover.png'
		},
		{
			el_id: 'btn_archive_browse',
			hover_src: '/cm/images/interface/buttons/btn_archive_browse_hover.png'
		},
		{
			el_id: 'font_increase',
			hover_src: '/cm/images/interface/buttons/font_increase_hover.png'
		},
		{
			el_id: 'font_decrease',
			hover_src: '/cm/images/interface/buttons/font_decrease_hover.png'
		},
		{
			el_id: 'btn_filter_search',
			hover_src: '/cm/images/interface/buttons/btn_search_hover.png'
		},		

		{
			class_set:
				{
					tag: 'input',
					class_name: 'BuyBundleButton',
					hover_src: '/cm/images/interface/buttons/btn_bundle_hover.png'
				}
		},
		{
			class_set:
				{
					tag: 'input',
					class_name: 'BtnClose',
					hover_src: '/cm/images/interface/buttons/close_hover.png'
				}
		}
	);
		
	for (i in collection)
	{
		if (collection[i].el_id)
		{
			var el = document.getElementById(collection[i].el_id);
		
			if (el)
			{
				/* replace 24bit for 8bit if IE
				 */
				if (window.event && collection[i].ie_src)
				{
					el.src = collection[i].ie_src;
				}
				
				if (collection[i].hover_src)
				{

					
					var hover_src = (window.event && collection[i].ie_hover_src) ? collection[i].ie_hover_src : collection[i].hover_src;

					el.onmouseover = (function(el, str)
						{
							return function()
							{
								el.src = str;
							}
						} (el, hover_src));
						
					el.onmouseout = (function(el, str)
						{
							return function()
							{
								el.src = str;
							}
						} (el, el.src));
				}
			
				if (collection[i].reg_event)
				{
					addEvent(el, collection[i].reg_event, eval(collection[i].event_handle));
				}
			}
		}
		else if (collection[i].class_set)
		{
			var set = cm_getElementsByClassName(collection[i].class_set.tag, collection[i].class_set.class_name);

			for (var j = 0; j < set.length; j++)
			{
		
				set[j].onmouseover = (function(el, str)
				{
					return function()
					{
						el.src = str;
					}
				} (set[j], collection[i].class_set.hover_src));
		
				set[j].onmouseout = function(el, str)
				{
					return function()
					{
						el.src = str;
					}
				} (set[j], set[j].src);
			}
		}
	}

	arguments.callee.done = true;
}




/**
 * Set up hover effects for certain buttons.
 *
 * @param	void
 * @return	void
 **/
function initButtons()
{
    if (arguments.callee.done) return;
	
	var btn_open = document.getElementById('btn_open');
	var btn_close = document.getElementById('btn_close');
	var btn_archive_search = document.getElementById('btn_archive_search');
	var btn_archive_browse = document.getElementById('btn_archive_browse');

	/* may wish to add an onclick handler for these below
	 */
	var search_buttons = cm_getElementsByClassName('input', 'SearchButtonSmall');
	var bundle_buttons = cm_getElementsByClassName('input', 'BuyBundleButton');
	var alphabet_buttons = cm_getElementsByClassName('input', 'SearchAlphabet');
	var btn_font_increase = document.getElementById('font_increase');
	var btn_font_decrease = document.getElementById('font_decrease');
	var btn_login_submit = document.getElementById('login_submit');
	var btn_article_subscribe = document.getElementById('article_subscribe');
	var btn_article_purchase = document.getElementById('article_purchase');
	var btn_article_purchase_pack = document.getElementById('article_purchase_pack');
	
	if (btn_open) addEvent(btn_open, 'click', toggleThisIssue);
	if (btn_close) addEvent(btn_close, 'click', toggleThisIssue);
	
	if (btn_archive_search)
	{
		btn_archive_search.hover_src = '/cm/images/interface/buttons/btn_archive_search_hover.png';

		btn_archive_search.onmouseover = (function(el, str)
		{
			return function()
			{
				el.src = str;
			}
		} (btn_archive_search, btn_archive_search.hover_src));
		
		btn_archive_search.onmouseout = function(el, str)
		{
			return function()
			{
				el.src = str;
			}
		} (btn_archive_search, btn_archive_search.src);
	}
	
	if (btn_archive_browse)
	{
		btn_archive_browse.hover_src = '/cm/images/interface/buttons/btn_archive_browse_hover.png';

		btn_archive_browse.onmouseover = (function(el, str)
		{
			return function()
			{
				el.src = str;
			}
		} (btn_archive_browse, btn_archive_browse.hover_src));
		
		btn_archive_browse.onmouseout = function(el, str)
		{
			return function()
			{
				el.src = str;
			}
		} (btn_archive_browse, btn_archive_browse.src);
	}
	
	/* small, grey search buttons
	 */
	for (var i = 0; i < search_buttons.length; i++)
	{
		search_buttons[i].hover_src = '/cm/images/interface/buttons/btn_search_hover.png';
		
		search_buttons[i].onmouseover = (function(el, str)
		{
			return function()
			{
				el.src = str;
			}
		} (search_buttons[i], search_buttons[i].hover_src));
		
		search_buttons[i].onmouseout = function(el, str)
		{
			return function()
			{
				el.src = str;
			}
		} (search_buttons[i], search_buttons[i].src);
	}
	
	/* navigation buttons for article bundles selection
	 */
	for (var i = 0; i < bundle_buttons.length; i++)
	{
		bundle_buttons[i].hover_src = '/cm/images/interface/buttons/btn_bundle_hover.png';
		//bundle_buttons[i].tmp_src = '';
		
		bundle_buttons[i].onmouseover = (function(el, str)
		{
			return function()
			{
				el.src = str;
			}
		} (bundle_buttons[i], bundle_buttons[i].hover_src));
		
		bundle_buttons[i].onmouseout = function(el, str)
		{
			return function()
			{
				el.src = str;
			}
		} (bundle_buttons[i], bundle_buttons[i].src);
	}

	/* archive search by author
	 */
	for (var i = 0; i < alphabet_buttons.length; i++)
	{
		alphabet_buttons[i].hover_src = '/cm/images/interface/buttons/btn_alphabet_' + String.fromCharCode(i+97) + '_hover.png';
		//bundle_buttons[i].tmp_src = '';
		
		alphabet_buttons[i].onmouseover = (function(el, str)
		{
			return function()
			{
				el.src = str;
			}
		} (alphabet_buttons[i], alphabet_buttons[i].hover_src));
		
		alphabet_buttons[i].onmouseout = function(el, str)
		{
			return function()
			{
				el.src = str;
			}
		} (alphabet_buttons[i], alphabet_buttons[i].src);
		
	}
    arguments.callee.done = true;
}

/**
 * Initialises click event for 'browse by year' menu list links.
 *
 * @param	void
 * @return	void
 * @author	brian ally, zijn digital - brian@zijn-digital.com
 **/
function initYearBrowser()
{
	/* this holds the paths to the images for each state
	 */
	var paths = {
		closed: '/cm/images/interface/buttons/arrow_right.png',
		closed_hover: '/cm/images/interface/buttons/arrow_right_hover.png',
		open: '/cm/images/interface/buttons/arrow_down.png',
		open_hover: '/cm/images/interface/buttons/arrow_down_hover.png'
	};
	
	var links = cm_getElementsByClassName('a', 'BrowseYear');
	
	img = document.createElement('img');
	img.setAttribute('src', paths.closed);
		
	for (var i = 0; i < links.length; i++)
	{
		/* insert the image
		 */
		links[i].insertBefore(img.cloneNode(false), links[i].firstChild);

		/* now add rules for the mouse events
		 */
		if (links[i].parentNode.parentNode.className == 'BrowseOpen')
		{
			/* change the src if page is loading with a list open
			 */
			links[i].firstChild.src = paths.open;
			
			/* and, likewise, the mouse events
			 */
			links[i].onmouseover = (function(el, str)
			{
				return function()
				{
						el.src = str;
				}
			} (links[i].firstChild, paths.open_hover));
					
			links[i].onmouseout = function(el, str)
			{
				return function()
				{
					el.src = str;
				}
			} (links[i].firstChild, paths.open);
		
		}
		else
		{
			links[i].onmouseover = (function(el, str)
			{
				return function()
				{
						el.src = str;
				}
			} (links[i].firstChild, paths.closed_hover));
					
			links[i].onmouseout = function(el, str)
			{
				return function()
				{
					el.src = str;
				}
			} (links[i].firstChild, paths.closed);
		}

		links[i].onclick = function(el)
		{
			return function()
			{
				toggleYearBrowser(el, paths);
			}
		} (links[i]);
	}
}


/**
 * Set all columns to height of tallest. To be called upon window load.
 * Based on a script by: Paul@YellowPencil.com and Scott@YellowPencil.com
 *
 * @param	void
 * @return	void
 * @author	brian ally, zijn digital - brian@zijn-digital.com
 **/
function setColumnHeight()
{
	var cols = new Array(document.getElementById('center'), document.getElementById('main'), document.getElementById('left_side'), document.getElementById('right_side'));
	
	/* determine maximum height of all columns specified
	 */
	var maxHeight = 0;

	for (var i = 0; i < cols.length; i++)
	{
		if (!cols[i]) continue;
		
		maxHeight = Math.max(maxHeight, cols[i].offsetHeight);
	}
	
	/* set all columns to that maximum height
	 */
	for (var i = 0; i < cols.length; i++)
	{
		if (!cols[i]) continue;

		cols[i].style.height = maxHeight + 'px';

		/* if the browser is in standards-compliant mode, the height property
		 * sets the height excluding padding, so we figure the padding out by subtracting the
		 * old maxHeight from the new offsetHeight, and compensate!
		 * So it works in Safari AND in IE 5.x
		 */
		if (cols[i].offsetHeight > maxHeight)
		{
			cols[i].style.height = (maxHeight - (cols[i].offsetHeight - maxHeight)) + 'px';
		}
	}
}


/**
 * Preload images for alphabet buttons on archive advanced search page.
 *
 * @param	void
 * @return	void
 **/
function initAlphabet()
{
	if (arguments.callee.done) return;
	
	var alphabet_buttons = cm_getElementsByClassName('input', 'SearchAlphabet');
	
	/* archive search by author
	 */
	for (var i = 0; i < alphabet_buttons.length; i++)
	{
		alphabet_buttons[i].hover_src = '/cm/images/interface/buttons/btn_alphabet_' + String.fromCharCode(i+97) + '_hover.png';
		//bundle_buttons[i].tmp_src = '';
		
		alphabet_buttons[i].onmouseover = (function(el, str)
		{
			return function()
			{
				el.src = str;
			}
		} (alphabet_buttons[i], alphabet_buttons[i].hover_src));
		
		alphabet_buttons[i].onmouseout = function(el, str)
		{
			return function()
			{
				el.src = str;
			}
		} (alphabet_buttons[i], alphabet_buttons[i].src);
		
	}
    arguments.callee.done = true;
}


/**
 * wrapper to open/close the issue cover navigation widget
 *
 * @param	void
 * @return	boolean false, to cancel click event
 **/
function toggleThisIssue()
{
	return toggleDiv('this_issue_full');
}
/**
 * wrapper to close email popup form
 *
 * @param	void
 * @return	boolean false, to cancel click event
 **/
function toggleSearchTips()
{
	return toggleDiv('search_tips_pop');
}

/**
 * wrapper to close email popup form
 *
 * @param	void
 * @return	boolean false, to cancel click event
 **/
function toggleEmailForm()
{
	return toggleDiv('email_article_form');
}
/**
 * wrapper to close email popup thankyou msg
 *
 * @param	void
 * @return	boolean false, to cancel click event
 **/
function toggleEmailThanks()
{
	return toggleDiv('email_article_thanks');
}

/**
 * wrapper to close email to editor popup form
 *
 * @param	void
 * @return	boolean false, to cancel click event
 **/
function toggleEmailEditor()
{
	return toggleDiv('letter_to_editor');
}


/**
 * show/hide a div by toggling the display state.
 *
 * @param	string	id	the div id
 * @return	boolean false, to cancel click event
 **/
function toggleDiv(id)
{
	var obj = document.getElementById(id);
	
	if (obj)
	{
		/* to deal with first invocation after page load
		 */
		if ( (obj.style.display == '') && (obj.offsetWidth == 0) ) obj.style.display = 'none';
		
		/* now toggle it
		 */
		obj.style.display = (obj.style.display != 'none') ? 'none' : 'block';
	}
	return false;
}

/**
 * enable/disable a div by toggling the display state.
 *
 * @param	string	id	the div id
 * @return	boolean false, to cancel click event
 **/
function toggleEnableDiv(id)
{
	var obj = document.getElementById(id);
	
	if (obj)
	{
		obj.disabled = !(obj.disabled);			
	}
	return false;
}


/**
 * toggle answers in FAQ table
 *
 * @param	string	id		the id of the div holding the answer
 * @param	boolean	show	whether to show or hide the answer (and change some classes)
 * @return	boolean	false
 **/
function handleFAQ(id, show)
{
	/* first adjust style of clicked link
	 */
	var link = document.getElementById('faq_show_' + id);
		
	if (link)
	{
		link.className = (show ? 'FAQShowing' : '');
	}

	/* now show/hide the div
	 */
	toggleDiv('faq_' + id);
	

    var mainHeight = document.getElementById("main"); 
    mainHeight.style.height = "auto";	
	
	return false;
}

/**
 * Show/hide elements in the 'browse by year' menu.
 * The link sits inside a Definition Term element. Each term has it's own list. We need to
 * run through all of the other lists to find any others that are already showing and hide
 * them. Also, each DT link has an arrow image which must be replaced with the 'down' state
 * image. Mouseover rules are also adjusted.
 *
 * @param	object	link	the link that was clicked on
 * @param	object	paths	holds the paths to images for the various states 
 * @return	void
 * @author	brian ally, zijn digital - brian@zijn-digital.com
 **/
function toggleYearBrowser(link, paths)
{
	
	
	/* grab the link's grandparent list and the div holding all the definition lists
	 */
	var parent_list = link.parentNode.parentNode;
	var container = parent_list.parentNode;
	var lists = container.getElementsByTagName('dl');

	/* close all lists
	 */
	for (i in lists)
	{
		if (lists[i].className == 'BrowseOpen')
		{
			lists[i].className = 'BrowseClosed';
			
			/* switch out the arrow image for the 'closed' versino
			 */
			var old_link = lists[i].getElementsByTagName('dt')[0].getElementsByTagName('a')[0];

			old_link.getElementsByTagName('img')[0].src = paths.closed;
			
			/* now adjust rules for the mouse events
			 */
			old_link.onmouseover = (function(el, str)
			{
				return function()
				{
						el.src = str;
				}
			} (old_link.firstChild, paths.closed_hover));
					
			old_link.onmouseout = function(el, str)
			{
				return function()
				{
					el.src = str;
				}
			} (old_link.firstChild, paths.closed);
			
			/* if the link clicked on was already open, allow it to reamin closed now by returning
			 */
			if (lists[i] == parent_list) return false;
		}
	}
	
	/* open the target list
	 */
	parent_list.className = 'BrowseOpen';

	/* switch image
	 */
	link.firstChild.src = paths.open;
	
	/* switch mouse event rules
	 */
	link.onmouseover = (function(el, str)
	{
		return function()
		{
			el.src = str;
		}
	} (link.firstChild, paths.open_hover));
					
	link.onmouseout = function(el, str)
	{
		return function()
		{
			el.src = str;
		}
	} (link.firstChild, paths.open);
	
	return false;
}	


function changeFontSize(i){
	var fontObj = document.getElementById("body").childNodes[0]; 
	var size = fontObj.getAttribute("size");
	alert("changeFontSize");
	size += i;
	fontObj.setAttribute("size",size);
}


/*
 * Used on viewInstitution.ftl
 */
function addNewRange() {
	var tr = document.createElement('tr');

	var td1 = document.createElement('td');
	var td2 = document.createElement('td');
	var td3 = document.createElement('td');
	var td4 = document.createElement('td');
	var td5 = document.createElement('td');
	td1.innerHTML = "";
	td2.innerHTML = "<input type=\"hidden\" name=\"range_"+rangeCount+"_id\"  value=\"0\"/>" +
					"<input type=\"text\" name=\"range_"+rangeCount+"_lower\" class=\"iTextIP\" style=\"width: 150px;\" value=\"\"/>";
	td3.innerHTML = "<input type=\"text\" class=\"iTextIP\" style=\"width: 150px;\" id=\"range_"+rangeCount+"_upper\" name=\"range_"+rangeCount+"_upper\" value=\"\"/>";
	td4.innerHTML = "<input type=\"checkbox\" name=\"range_"+rangeCount+"_single\" class=\"iCheckbox\" onClick=\"toggleDisplay('range_"+rangeCount+"_upper');\"/>";
	td5.innerHTML = "";
	
	tr.appendChild(td1);
	tr.appendChild(td2);
	tr.appendChild(td3);
	tr.appendChild(td4);
	tr.appendChild(td5);
	
	var linkRow = document.getElementById("addNewRangeLinkRow");
	linkRow.parentNode.insertBefore(tr,linkRow);
	
	rangeCount++;
}

function toggleDisplay(id) {
	var element = document.getElementById(id);
	if (element.style.display != 'none')
		element.style.display  = 'none';
	else
		element.style.display = 'block';
}