/*
 Older version from asylum - before including flyout copied on 12 June
	Fudge vs. Area 17 vs. Prototype & Scriptaculous

	written by Phil (phil at fudgestudios.com) and Mike "1312" (mike at fudgestudios.com)

	for Area 17 (www.area17.com)
	

	This javascript is the main javascript for the sites actions.
	
*/

// --------------------------------------------------------------------------------------------------------------
// set up variables

var isSafari = false;
var isSafari3 = false;
var isIE = false;
var isIE7 = false;	

// --------------------------------------------------------------------------------------------------------------
// what to do on DOM ready
document.observe("dom:loaded", runOnDOMready);
// what to do when body loaded
Event.observe(window, 'load', function() { runOnLoaded(); });

function runOnDOMready() {
	
	/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ some simple browser testing */
	// Safari versioning
	isSafari = Prototype.Browser.WebKit;
	// are we on safari 3? add a class (it over anti aliases everything which causes padding issues)
	// http://www.hedgerwow.com/360/dhtml/detect-safari3-by-js-css.html
	if( window.devicePixelRatio && window.getMatchedCSSRules && !window.Opera){
		isSafari3 = !!window.getMatchedCSSRules(document.documentElement,'');
	}
	if (isSafari) {	
		$$('body').invoke('addClassName', 'isSafari');
		if (isSafari3) { $$('body').invoke('addClassName', 'isSafari3'); }
	}
	// (ok so theres an assumption that any Safari thats not Safari3 is Safari2 here)		
	// IE versioning
	isIE = Prototype.Browser.IE;
	if (typeof document.body.style.maxHeight != "undefined") { if (!isSafari) { isIE7 = true; } }
	if (isIE) {	
		$$('body').invoke('addClassName', 'isIE');
		if (isIE7) { $$('body').invoke('addClassName', 'isIE7'); }
	}
	/* http://gmatter.wordpress.com/2006/10/20/detecting-ie7-in-javascript/ */
	// ### ok so theres an assumption that any IE thats not IE7 is IE6 here	
	
	
	/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ set up some adding of classes to things */	
	
	setUpClasses();		
	
	/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ do some roll over events */
	
	// class="image" (for input type=image)
	$$('.image').each(function(el){
		el.observe('mouseover', function(event) {
			var element = Event.element(event);
			element.addClassName('hover');
		});
		el.observe('mouseout', function(event) {
			var element = Event.element(event);
			element.removeClassName('hover');
		});
	});
		
		
		
	/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ apply the green number to the ordered list */
	
	if($$('.mostPopularArticles')) {
	//	alert("exists");
	}

	
	
	/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ navigation flyout */
	
	list = $('navPrimary').getElementsBySelector('ul');
	navItems = list[0].getElementsBySelector('li');
	$(navItems).each(function(el) {
		// get first list inside each list item
		el.observe('mouseover', function(event) {
			popOutSubMenu.delay(0.25,el);
		});		
		el.observe('mouseout', function(event) {
			innerList = el.getElementsBySelector('ul');			
			if(innerList.length > 0) {			
				innerList[0].style.display='none';
				innerList[0].up().removeClassName('hover');
			}
		});		
	})
	
	function popOutSubMenu(el) {
		el.observe('mouseover', function(event) {		
			innerList = el.getElementsBySelector('ul');
			if(innerList.length > 0) {
				//innerList[0].style.display='inline';
				innerList[0].style.display='block';
				innerList[0].up().addClassName('hover');
			}
		});	
	}
	
	
	
	/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ search options */
	
	$$('#searches ul li.first a').each(function(el){
		el.observe('click', function(event) {
			var element = Event.element(event);
			element.up().addClassName('current');
			$$('#searches ul li.second')[0].removeClassName('current');
			$('search-asylum').removeClassName('hide');
			$('search-web').addClassName('hide');
			Event.stop(event);
		});
	});
	$$('#searches ul li.second a').each(function(el){
		el.observe('click', function(event) {
			var element = Event.element(event);
			element.up().addClassName('current');
			$$('#searches ul li.first')[0].removeClassName('current');
			$('search-web').removeClassName('hide');
			$('search-asylum').addClassName('hide');
			Event.stop(event);
		});
	});
	
	
	
	/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ last article doesnt want an underline */
	
	if($$('div.article').length!=0) {
		var n = $$('div.article').length-1;
		$$('div.article')[n].addClassName('lastArticle');
		//$$('div.article:last').invoke('addClassName', 'lastArticle');	
		//$$('div.article:last-child').invoke('addClassName', 'lastArticle');
	}
	
	
	/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ top banner rollover */
	
	$$('div#banner div').each(function(el){
		el.observe('mouseover', function(event) {
			var element = Event.element(event);
			element.addClassName('hover');
		});
		el.observe('mouseout', function(event) {
			var element = Event.element(event);
			element.removeClassName('hover');
		});
	});
	
	
	/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ right banner rollover */
	
	$$('div.bannerHolder').each(function(el){
		el.observe('mouseover', function(event) {
			var element = Event.element(event);
			element.addClassName('hover');
		});
		el.observe('mouseout', function(event) {
			var element = Event.element(event);
			element.removeClassName('hover');
		});
	});
	
	

	/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ add behaviour to Most Commented Articles 
	
	if($('mostCommentedArticles')) {
		uls = $('mostCommentedArticles').getElementsBySelector('ul');
		uls2 = $(uls[0]).getElementsBySelector('ul');

		a = $(uls2)[2];
		newHeight = a.getHeight()+70;
		$('mostCommentedArticles').setStyle({
		  height: newHeight+'px'
		});
		a.style.display='inline';
		a.style.position='absolute';				
		a.addClassName("current");

		// add click event to all
		$(uls2).each(function(el) {			
			el.up().firstDescendant().observe('click', function(event) {

				duration = 30;
				linkList = el.up().getElementsBySelector('a');
				if (linkList.length > 0) {
					link = linkList[0];
					duration = link.readAttribute('duration');
				}

				linkList = el.getElementsBySelector('li');
				if (linkList.length == 0) {
					url = '/comments-flyout.xml?duration='+duration;

					new Ajax.Request(url,
					  {
					    method:'get',
					    asynchronous:false,
					    onSuccess: function(transport){
					      var response = transport.responseText || "no response text";
					      el.insert(response, el);
					    },
					    onFailure: function(){ }
					  });
				}

				// hide all ul's
				others = this.up().up().getElementsBySelector('ul');
				w=0;
				others.each(function(el) {
					el.previousSiblings()[0].removeClassName("current");
					el.style.display='none';
					if (w == 1) {
						$(el).style.left=10.4*w+"em";				
					} else if (w == 0) {
						$(el).style.left="20.8em";				
					}
					w++;
				})
				newHeight = $(this).nextSiblings()[0].getHeight()+70;
				$('mostCommentedArticles').setStyle({
				  height: newHeight+'px'
				});	
				this.nextSiblings()[0].style.display='inline';
				this.nextSiblings()[0].style.position='absolute';				
				this.addClassName("current");
				Event.stop(event)
			});			
		});
		
	}
	
*/	

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ less/more on social networking article footer */
	
	// shows and hides the more/less links in the social networking article footer
	$$('.socialNetworking li.more a').each(function(el) {
		el.observe('click',  function(event) {
			nextLi = el.up().up().next();
			if(nextLi.style.display=='' || nextLi.style.display=='none') {
				nextLi.style.display='inline';
				el.up().removeClassName('more');
				el.up().addClassName('less');
				el.update('Less');				
			} else {
				nextLi.style.display='none';
				el.up().removeClassName('less');				
				el.up().addClassName('more');				
				el.update('More');				
			}
			Event.stop(event);			
		});		
	});
	// close lists back up
	$$('.less').each(function(el) {
		el.observe('click',  function(event) {

			nextLi = this.up().next();
			alert(nextLi.className);
			Event.stop(event);			
		});
	});	
	
	
	/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ search ok button roll over */
	
	if ($$('div#searches input.image').length != 0) {
		$$('div#searches input.image').each(function(el){
			var imgSrc = el.readAttribute('src');
			el.observe('mouseover', function(event) {
				var element = Event.element(event);
				element.addClassName('hover');
				element.writeAttribute('src', '/images/sitewide/trans.gif');
			});
			el.observe('mouseout', function(event) {
				var element = Event.element(event);
				element.removeClassName('hover');
				element.writeAttribute('src', imgSrc);
			});
		});
	}


	/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ most popular articles bg number */
	
	if (($$('div.mostPopularArticles').length) != 0) {
		$$('div.mostPopularArticles ol li').each(function(el,s){
			//var className = s + 1;
			//className = "article" + className;
			//el.addClassName(className);
			var position = s * 183;
			position = "5px -" + position+"px";
			el.setStyle({ backgroundPosition: position });
		});
	}
	
	
	/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ center paginator on article comments */
	
	if (($$('div.comments div.paginator').length) != 0) {
		var ul = $$('div.comments div.paginator ul')[0];
		var ulWidth = ul.getWidth();
		//alert(ulWidth);
		var liWidth = 0;
		$$('div.comments div.paginator ul li').each(function(el,s) {
			liWidth = liWidth + el.getWidth();											  
		});
		//alert(liWidth);
		var paddingLeft = (ulWidth - liWidth)/2;
		paddingLeft = paddingLeft + "px";
		ul.setStyle({paddingLeft: paddingLeft });
	}
	
	
	/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ top slider funcs */
	
	
}

function runOnLoaded() {	
	/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ redoing for IE! */
	/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ set up some adding of classes to things */	
	if (isIE) {
		setUpClasses();	
	}
}

// --------------------------------------------------------------------------------------------------------------
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ application wide functions */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ (remember to test if the elements you are messing with exist) */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ ( eg. if (($$('body.homepage'))!=""){ } ) */

function setUpClasses() {
	$$('input[type=submit]').invoke('addClassName', 'submit');
	$$('input[type=radio]').invoke('addClassName', 'radio');
	$$('input[type=checkbox]').invoke('addClassName', 'checkBox');
	$$('input[type=image]').invoke('addClassName', 'image');
	$$('input[type=file]').invoke('addClassName', 'file');	
	$$('tr:nth-child(even)').invoke('addClassName', 'even');
	$$('li:nth-child(even)').invoke('addClassName', 'even');	
	$$('li:first-child').invoke('addClassName', 'first');
	$$('li:last-child').invoke('addClassName', 'last');		
}