/***
	BALLET GENERAL JAVASCRIPT FUNCTIONS
	v1 - 2007-12-17
	   - started keeping track of versions and changes
	v2 - 2007-12-19
	   - changed the way the multi-bill nav works re: changing of photos.
	   - added new element to the balley array that will contain the main image URL for each ballet
	v3 - 2007-12-20
	   - added safety check in Media tab code, for when photos or video tab is not there
	v4 - 2008-01-03
	   - added left nav highlighting functionality
	v5 - 2008-01-17
	   - added activateTab() function, for inline links, so they can turn on a tab
	   - added URL check, looking at the hash (#) of the location field, and checking to see if it matches a tab ID
	v6 - 2008-02-11
	   - added table column striping for any tables with the class "subscribeTable"
	v7 - 2008-02-15
	   - turned photo credit into a rollover
	v8 - 2008-05-22
	   - fixed javascript bug that was showing up when there were no links in the left nav
	v9 - 2009-12-03
	   - replaced "getElementsByClassname", as it has been deprecated in Prototype 1.6+; use $$ instead
	***/
	
	var domainname = "http://national.ballet.ca";
	var domainnameAlt = "http://www.national.ballet.ca";
	var siteroot = "";
	
	
	// === BEGIN PROTOTYPE ASSIGNMENT === //
	
	// Window onload functions
	Event.observe(window, 'load', function() {
	
		// --- MAIN NAV --- //
		var mainNav = $("mainnav").getElementsByTagName('li');
		var mainNavAnchors = $("mainnav").getElementsByTagName('a');
		for (var i=0; i<mainNav.length; i++) {
			mainNav[i].onmouseover = function() {
				$(this).addClassName("roll");
			}
			mainNav[i].onmouseout = function() {
				$(this).removeClassName("roll");
			}
			mainNav[i].onclick = function() {
				var anchor = $(this).getElementsByTagName('a');
				document.location.href = anchor[0].getAttribute('href');
				//document.location.href = "http://national.ballet.ca" + anchor[0].getAttribute('href');
			}
		}
		
		// --- LEFT NAV --- //
		if ($("leftnav")) {
			if ($$("#leftnav ul ul li")) {
				// Grab all the li elements that are inside a embedded UL inside the left nav; if it's a UL inside a UL, then that's the 3rd level nav we want
				var navitems = $$("#leftnav ul ul li");
				for (var i=0;i<navitems.length;i++) {
					// Loop through all the LIs and check 'em against the current URL path.
					// If they we're in the same directory, then highlight that LI item
					var myAnchors = navitems[i].getElementsByTagName('a');
					//alert(myAnchors[0].getAttribute('href'));
					//alert(document.location.href);
					//alert(document.location.href.indexOf("" + myAnchors[0].getAttribute('href')));
					if (myAnchors.length > 0) {
						if (document.location.href.indexOf("" + myAnchors[0].getAttribute('href')) >= 0) {
							Element.addClassName(navitems[i], "on");
							break;
						}
					}
				}
			}
			if ($$("#leftnav ul li a.open")) {
				// Grab all anchors that are marked with the "open" class.  Should only return one item.
				var navitem = $$("#leftnav ul li a.open");
				if (navitem.length > 0) {
					var myHref = navitem[0].getAttribute('href');
					if (myHref.indexOf("http") < 0) {
						if (document.location.href.indexOf("www") > -1) {
							myHref = domainnameAlt + myHref;
						} else {
							myHref = domainname + myHref;
						}
					}
					if (myHref == "" + document.location.href) {
						Element.addClassName(navitem[0], "on");
					}
				}
			}
		}
		
		
		// --- TAB MENU, if it exists --- //
		if ($("tabmenu") != null) {
			// ---CONTENT TABS--- //
			var tabMenu = $("tabmenu").getElementsByTagName('a');
			for (var i=0; i<tabMenu.length; i++) {
				// Rollover
				tabMenu[i].onmouseover = function() {
					$(this).addClassName("roll");
				}
				// Rollout
				tabMenu[i].onmouseout = function() {
					$(this).removeClassName("roll");
				}
				// Clicked a tab menu
				tabMenu[i].onclick = function() {
					// Turn off all content areas
					for (var y=0; y<tabMenu.length; y++) {
						Element.removeClassName(tabMenu[y],"on");
						var veronique;
						if ((typeof balletSelected == "undefined") || (balletSelected == "")) {
							veronique = tabMenu[y].getAttribute("id") + "_content";
						} else {
							veronique = tabMenu[y].getAttribute("id") + "_" + balletSelected;
						}
						Element.removeClassName("" + veronique, "on");
					};
					// Change to 'on' state
					$(this).addClassName("on");
					// Turn selected content area on
					var stephen;
					if ((typeof balletSelected == "undefined") || (balletSelected == "")) {
						stephen = this.getAttribute("id") + "_content";
					} else {
						stephen = this.getAttribute("id") + "_" + balletSelected;
					}
					Element.addClassName("" + stephen, "on");
					
					return false;
				}
			}
			// Check the location hash, and activate the corresponding tab, if it exists
			if (document.location.hash != "") {
				var myHash = document.location.hash.substring(1,document.location.hash.length);
				// Make sure the tab exists
				var belinda;
				if ((typeof balletSelected == "undefined") || (balletSelected == "")) {
					belinda = "tab_" + myHash + "_content";
				} else {
					belinda = "tab_" + myHash + "_" + balletSelected;
				}
				if ($(belinda) != null) {
					activateTab(myHash);
				}
			}
		}
	
		/* FOR BIO AND PERFORMANCE PAGES ONLY */
		// --- MEDIA TABS --- //
		if ($("photos_tab") != null) {
			// Set up rollover and click functions for photo and video tabs
			$("photos_tab").onmouseover = function() {
				this.addClassName("roll");
			}
			$("photos_tab").onmouseout = function() {
				this.removeClassName("roll");
			}
			$("photos_tab").onclick = function() {
				mediaSelected = "photos";
				$("photos_tab").addClassName("on");
				$("photolist").addClassName("on");
				if ($("video_tab") != null) {
					$("video_tab").removeClassName("on");
					$("videolist").removeClassName("on");
				}
			}
		}
		if ($("video_tab") != null) {
			$("video_tab").onmouseover = function() {
				this.addClassName("roll");
			}
			$("video_tab").onmouseout = function() {
				this.removeClassName("roll");
			}
			$("video_tab").onclick = function() {
				mediaSelected = "video";
				if ($("photos_tab") != null) {
					$("photos_tab").removeClassName("on");
					$("photolist").removeClassName("on");
				}
				$("video_tab").addClassName("on");
				$("videolist").addClassName("on");
			}
		}
		/* END BIO AND PERFORMANCE PAGES */
			
		/* PERFORMANCE PAGE ONLY */
		// ---TRIPLE BILL NAV, if it exists--- //
		var balletNavTimeout;
		var balletNav;
		if ($("ballet_nav") && (balletArray.length>1)) {
			balletNav = $("ballet_nav").getElementsByTagName('a');
			// For all anchors in our multi-ballet nav, add functions
			for (var i=0; i<balletNav.length; i++) {
				// Rollover an item in the ballet nav
				balletNav[i].onmouseover = function() {
					$(this).addClassName("roll");
					if (balletNavTimeout) {
						clearTimeout(balletNavTimeout);
					}
				}
				// Rollout
				balletNav[i].onmouseout = function() {
					$(this).removeClassName("roll");
					balletNavTimeout = setTimeout("$('ballet_nav').setStyle({display: 'none'});$('ballet_nav_selected').removeClassName('on')",1000);
				}
				// Click a ballet nav item, make that ballet active
				balletNav[i].onclick = function() {
				
					// Kill the timeout, if it exists
					if (balletNavTimeout) {
						clearTimeout(balletNavTimeout);
					}

					// Change the "selected" anchor to off state
					$('ballet_nav_selected').removeClassName("on");
					// Make the drop down menu disappear
					$('ballet_nav').setStyle({display: 'none'});
					// Set the insides of the "selected" anchor to the text of the item you just picked
					$('ballet_nav_selected').innerHTML = $(this).innerHTML;
					
					// Hide all content divs
					for (var y=0; y<balletNav.length; y++) {
						var ballet = balletNav[y].getAttribute("rel");
							ballet = ballet.substring(ballet.indexOf('_')+1, ballet.indexOf('['));
						Element.removeClassName("ballet_"+ballet, "tab_contents_on");
					};
					
					// Reset tab menu and content divs
					for (var y=1; y<tabMenu.length; y++) {
						if (y==1) {
							// Turn on first item
							Element.addClassName(tabMenu[y],"on");
							// Change content
							for (var x=0; x<balletArray.length;x++) {
								Element.addClassName("" + tabMenu[y].getAttribute("id") + "_" + balletArray[x][0], "on");
							}
						} else {
							// Turn off all others
							Element.removeClassName(tabMenu[y],"on");
							for (var x=0; x<balletArray.length;x++) {
								Element.removeClassName("" + tabMenu[y].getAttribute("id") + "_" + balletArray[x][0], "on");
							}
						}
					}
					
					// Change global var for which ballet was selected
					var ballet = $(this).getAttribute('rel');
						balletSelected = ballet.substring(ballet.indexOf('_')+1, ballet.indexOf('['));

					//Set the photo and photo credit
					var lidia;
					for (var y=0;y<balletArray.length;y++) {
						if (balletArray[y][0] == balletSelected) {
							lidia = y;
							break;
						}
					}
					Element.setSrc("ballet_image",balletArray[lidia][2]);
					Element.setInnerHTML("main_image_credit","<p>"+balletArray[lidia][1]+"</p>");

					// Get tab options
					var tabs = $(this).getAttribute('rel');
						tabs = tabs.substring(tabs.indexOf('[')+1, tabs.indexOf(']'));
						tabs = tabs.split(",");
					// Show/hide tab buttons depending on the options
					for (var y=1; y<tabMenu.length; y++) {
						var warren = false;
						for (var x=0; x<tabs.length; x++) {
							if (tabMenu[y].getAttribute("id") == "tab_" + tabs[x]) {
								warren = true;
								break;
							}
						}
						if (warren == false) {
							Element.addClassName(tabMenu[y],"disabled");
						} else {
							Element.removeClassName(tabMenu[y],"disabled");
						}
					}
					
					// Turn on the content div for the selected ballet
					Element.addClassName("ballet_" + balletSelected, "tab_contents_on");
					
					return false;
				}
			}
		}
		
		var balletNavSelected;
		if ($("ballet_nav_selected")) {
			// Functions for the multi-ballet initiator item
			balletNavSelected = $("ballet_nav_selected");
			// Onclick to open the multi-ballet nav
			balletNavSelected.onclick = function() {
				// Kill the timeout, if it exists
				if (balletNavTimeout) {
					clearTimeout(balletNavTimeout);
				}
				// Open multi-ballet nav
				$('ballet_nav').setStyle({display: 'block'});
				$(this).addClassName("on");
				return false;
			}
			
			// Rollover and cancel the timeout, if it exists
			balletNavSelected.onmouseover = function() {
				if (balletNavTimeout) {
					clearTimeout(balletNavTimeout);
				}
			}
			// Rollout activate timeout to close menu
			balletNavSelected.onmouseout = function() {
				balletNavTimeout = setTimeout("$('ballet_nav').setStyle({display: 'none'});$('ballet_nav_selected').removeClassName('on')",1000);
			}
		}
		/* END PERFORMANCE PAGE ONLY */
	
	
		// --- PHOTO CREDITS --- //
		var photoCreditTimeout;
		// UPDATE - 2009-12-03 - getElementsByClassName has been deprecated in Prototype 1.6+; use $$ instead
		//var photoCreditBtns = document.getElementsByClassName('photocredit_btn');
		var photoCreditBtns = $$('.photocredit_btn');
		for (var i=0;i<photoCreditBtns.length;i++) {
			if (photoCreditBtns[i].getAttribute('rel') != "") {
				var pairedCredit = document.getElementById(""+photoCreditBtns[i].getAttribute('rel'));
				/* photoCreditBtns[i].onclick = function() {
					Element.setStyle(pairedCredit,"display: block");
				} */
				photoCreditBtns[i].onmouseout = function() {
					photoCreditTimeout = setTimeout("$('" + this.getAttribute('rel')+"').setStyle({display: 'none'});",500);
				}
				photoCreditBtns[i].onmouseover = function() {
					Element.setStyle(pairedCredit,{display: 'block'});
					clearTimeout(photoCreditTimeout);
				}
				pairedCredit.onmouseover = function() {
					clearTimeout(photoCreditTimeout);
				}
				pairedCredit.onmouseout = function() {
					photoCreditTimeout = setTimeout("$('" + this.getAttribute('id')+"').setStyle({display: 'none'});",500);
				}
				
			}
		}
		
		
		// --- SUBSCRIBE TABLE COL STRIPING --- //
		// UPDATE - 2009-12-03 - getElementsByClassName has been deprecated in Prototype 1.6+; use $$ instead
		//var subscribeTables = document.getElementsByClassName('subscribeTable');
		var subscribeTables = $$('.subscribeTable');
		for (var i=0;i<subscribeTables.length;i++) {
			var myTable = subscribeTables[i];
			var myTRs = subscribeTables[i].getElementsByTagName('tr');
			for (var y=0;y<myTRs.length;y++) {
				var myTDs = myTRs[y].getElementsByTagName('td');
				for (var x=0;x<myTDs.length;x++) {
					if (x % 2 == 0) {
						Element.addClassName(myTDs[x], "even");
					}
				}
			}
		}

	});
	




// Allows inline links to activate a tab
// tabID should be the same value as $tabdata[x]["key"] or, if you're looking at the HTML, the unique name found in the content <div>'s.  It'll look
// something like "tab_[key]_content".
function activateTab(tabID) {
	var tabMenu = $("tabmenu").getElementsByTagName('a');
	var christine;
	if ((typeof balletSelected == "undefined") || (balletSelected == "")) {
		christine = "tab_" + tabID + "_content";
	} else {
		christine = "tab_" + tabID + "_" + balletSelected;
	}
	if ($(christine) != null) {
		// Turn off all content areas
		for (var y=0; y<tabMenu.length; y++) {
			Element.removeClassName(tabMenu[y],"on");
			var veronique;
			if ((typeof balletSelected == "undefined") || (balletSelected == "")) {
				veronique = tabMenu[y].getAttribute("id") + "_content";
			} else {
				veronique = tabMenu[y].getAttribute("id") + "_" + balletSelected;
			}
			Element.removeClassName("" + veronique, "on");
		};
		// Change to 'on' state
		$("tab_" + tabID).addClassName("on");
		// Turn selected content area on
		Element.addClassName("" + christine, "on");
	}
}

// Pop up window for the Donor Chart
function popDonorRecognition() {
	var width = '712';
	var height = '500';
	var windowFeatures = ',resizable=0,toolbar=1,status=1,scrollbars=1';
	var x = Math.round((screen.availWidth - width) / 2);
	var y = Math.round((screen.availHeight - height) / 2);
	windowFeatures = 'left=' + x + ',top=' + y + ',width=' + width + ',height=' + height + windowFeatures;

	// Pop open the generic window with the requested URL
	var popTheWindow;
	popTheWindow = window.open(domainname + siteroot + '/donate/donorbenefits/', 'donorRecognition', windowFeatures);
	popTheWindow.focus();
}

// Pop up window for the colouring book
function popColouringBook(imagePath) {
	var x = Math.round((screen.availWidth - width) / 2);
	var y = Math.round((screen.availHeight - height) / 2);
	var myWindow;
	myWindow = window.open(domainname + siteroot + imagePath, 'colouringBook','width=370,height=500,resizable=0,toolbar=0,status=1,scrollbars=1,left=' + x + ',top=' + y);
	myWindow.focus();
}

function rollover (imagename, objectsrc) {
	if (document.images) {
	document.images[imagename].src=eval(objectsrc+".src")
	}
}