//CORE SCRIPTS FOR BLOG ATD3 DESIGN

/************************
*THIS IS THE BLOGS VERSION, same as the atd version as of Nov. 30, 2007
*SIGNIFICANT MODIFICATIONs MARCH 30 2008, not the same as atd version
*/

var ATD3Core = 
{
	init: function() //call and initializes all functions for ATD3 design
	{
		preloadRollovers.init();
		ATD3Core.hoverSwitch();
		LightBox.init();
		ScrollBar.init();
		BlogHeadlines.init();
		BlogNoteCards.init();
	},
	
	hoverSwitch: function() //switches the src of all images with class 'hoverSwitch' from off to ON and back again
	{
		if (document.getElementsByClassName('hoverSwitch'))
		{
			var imageToSwitch = document.getElementsByClassName('hoverSwitch'); //sets up event listeners on all elements with 'hoverSwitch' class
			for (var i = 0; i < imageToSwitch.length; i++)
			{
				Event.observe(imageToSwitch[i], "mouseover", ATD3Core.swapImageOn.bindAsEventListener(imageToSwitch[i]));
				Event.observe(imageToSwitch[i], "mouseout", ATD3Core.swapImageOff.bindAsEventListener(imageToSwitch[i]));
				//Event.observe(imageToSwitch[i], "click", ATD3Core.swapImageOff.bindAsEventListener(imageToSwitch[i]));
			}
		}
	},
	
	swapImageOn: function() //replaces ...off... for ...ON...
	{
		var sourceString = this.src;
		var newSource = sourceString.replace("Off", "ON");
		this.src = newSource;
	}, 
	
	swapImageOff: function() //replaces ...ON... with ...Off...
	{
		var sourceString = this.src;
		var newSource = sourceString.replace("ON", "Off");
		this.src = newSource;
	}
};

Event.observe(window, 'load', ATD3Core.init);



//PRELOAD IMAGES FOR ROLLOVERS
var preloadRollovers =
{
	init: function()
	{
		if (document.images)
		{
			var imageList = new Array();
			var offImageSrc = new Array();
			var onImageSrc = new Array();
			var offStateImageElements = $$('img.hoverSwitch'); //get off-state image objects, i want to load ON states
			
			for (var i = 0; i < offStateImageElements.length; i++)
			{
				offImageSrc[offImageSrc.length] = offStateImageElements[i].src; //make array of off image sources
				onImageSrc[onImageSrc.length] = offImageSrc[i].replace("Off", "ON"); //make array of ON image sources by replacing 'Off' with 'ON'
			}
			
			var preloadedImages = new Array(); //initialize array for preloaded images
			for (var j = 0; j < onImageSrc.length; j++) //run throught all ON sources, creating image for each
			{
				preloadedImages[j] = document.createElement('img');
				preloadedImages[j].setAttribute('src',onImageSrc[j]);
				//imageList[imageList.length] = preloadedImages[j];
			}
			//alert(imageList);	
		}
	}
};









//START search button hove script
// copyright 1999-2001 Idocs, Inc. http://www.idocs.com/tags/
// Distribute this script freely, but keep this 
// notice with the code.
var submitRolls = new Object();

function submitroll(src, oversrc, name)
{
this.src=src;
this.oversrc=oversrc;
this.name=name;
this.alt="Search";
this.write=submitroll_write;
}

function submitroll_write()
{
var thisform = 'document.forms[' + (document.forms.length - 1) + ']';
submitRolls[this.name] = new Object();
submitRolls[this.name].over = new Image();
submitRolls[this.name].over.src = this.oversrc;
submitRolls[this.name].out = new Image();
submitRolls[this.name].out.src = this.src;

document.write
	(
	'<A onMouseOver="if (document.images)document.images[\'' + this.name + "'].src=submitRolls['" + this.name + '\'].over.src"' + 
	' onMouseOut="if (document.images)document.images[\'' + this.name + "'].src=submitRolls['" + this.name + '\'].out.src"' + 
	' HREF="javascript:'
	);

if (this.sendfield)
	{
	if (! this.sendvalue)
		this.sendvalue = 1;
	document.write(thisform, ".elements['", this.sendfield, "'].value='", this.sendvalue, "';");
	}

document.write(thisform + '.submit();void(0);"');
if (this.msg)document.write(' onClick="return confirm(\'' , this.msg, '\')"');
document.write('>');

document.write('<IMG SRC="' + this.src + '" ALT="' + this.alt + '" BORDER=0 NAME="' + this.name + '"');
if (this.height)document.write(' HEIGHT=' + this.height);
if (this.width)document.write(' WIDTH='  + this.width);
if (this.otheratts)document.write(' ' + this.otheratts);
document.write('></A>');
if (this.sendfield)
	{
	document.write('<INPUT TYPE=HIDDEN NAME="' + this.sendfield + '">');
	document.forms[document.forms.length - 1].elements[this.sendfield].value='';
	}
}
//End search button hover script






//myLightBox 10-14-07

var LightBox = 
{
	counter: 0,
	
	init: function()
	{
		if (document.getElementsByClassName('lightBox'))
		{
			var lightBoxLinkElements = document.getElementsByClassName('lightBox');  //sets click listender to all links of class .lightBox
			for (var i = 0; i < lightBoxLinkElements.length; i++)
			{
				Event.observe(lightBoxLinkElements[i], 'click', LightBox.animate.bindAsEventListener(lightBoxLinkElements[i]));
			}
		}
	},
	
	animate: function(e)
	{
		var linkId = $w(this.className)[0];  //get first class name of the link clicked, ex: someText, by get string of names, split into array by whitespace, take the first one
		var textId = linkId + 1;  // id of text that matches link, ex: someText1
		var textElement = $(textId);  //get div element by id that matches link, contains the hidden text
		
		var innerContent = textElement.innerHTML;  //get html inside the hidden text, dom node work is too hard
		var displayBox = $("box");  //get lightbox display div
		displayBox.innerHTML = innerContent;  //put html content from hidden div into lightbox div
		
		new Effect.Appear('screen', {duration:0.5, from:0.0, to:0.7});
		
		new Effect.Appear('box', {duration:0.5, from:0.0, to:1.0});
		
		ATD3Core.hoverSwitch(); //re-call image switcher to make work on hover boxes images
		var clickCloseDiv = $('box').select('div.clickClose')[0]; //get div.clickClose
		Event.observe(clickCloseDiv, 'click', LightBox.close.bindAsEventListener(LightBox));
		
		//preventing the default action of the click
		//Event.stop(e);
	},
	
	close: function(e)
	{
		new Effect.Fade('screen', {duration:0.5, from:0.7, to:0.0});
		new Effect.Fade('box', {duration:0.5, from:1.0, to:0.0});
	}
	
};


//SCROLL BAR SCRIPT
var ScrollBar = 
{
	articleSlider: "",
	blogSlider: "",
	searchResultsSlider: "",
	
	init: function()
	{
		if($('handle'))
		{
			// vertical slider control
			var slider = new Control.Slider('handle', 'track', {
				axis: 'vertical',
				onSlide: function(v) { ScrollBar.scrollVertical(v, $('articleListContainer'), slider);  },
				onChange: function(v) { ScrollBar.jumpVertical(v, $('articleListContainer'), slider); }
			});
			
			Event.observe('scrollBarDown', 'click', ScrollBar.clickDownValue.bindAsEventListener(slider));
			Event.observe('scrollBarUp', 'click', ScrollBar.clickUpValue.bindAsEventListener(slider));
	
			// disable vertical scrolling if text doesn't overflow the div
			if ($('articleListContainer').scrollHeight <= $('articleListContainer').offsetHeight) {
				slider.setDisabled();
				$('wrapSlider').hide();
			}
		}
		else if($('artHandle'))
		{
			// vertical slider control
			ScrollBar.articleSlider = new Control.Slider('artHandle', 'artTrack', {
				axis: 'vertical',
				onSlide: function(v) { ScrollBar.scrollVertical(v, $('articleText'), ScrollBar.articleSlider);  },
				onChange: function(v) { ScrollBar.jumpVertical(v, $('articleText'), ScrollBar.articleSlider); }
			});
			
			MouseWheel.init(ScrollBar.articleSlider); //send slider element to MouseWheel object
					
			// disable vertical scrolling if text doesn't overflow the div
			if ($('articleText').scrollHeight <= $('articleText').offsetHeight) {
				ScrollBar.articleSlider.setDisabled();
				$('articleSliderContainer').hide();
			}
		}	
		else if($('blogHandle'))
		{
			// vertical slider control
			ScrollBar.blogSlider = new Control.Slider('blogHandle', 'blogTrack', {
				axis: 'vertical',
				onSlide: function(v) { ScrollBar.scrollVertical(v, $('blogText'), ScrollBar.blogSlider);  },
				onChange: function(v) { ScrollBar.jumpVertical(v, $('blogText'), ScrollBar.blogSlider); }
			});
			
			MouseWheel.init(ScrollBar.blogSlider); //send slider element to MouseWheel object

					
			// disable vertical scrolling if text doesn't overflow the div
			if ($('blogText').scrollHeight <= $('blogText').offsetHeight) {
				ScrollBar.blogSlider.setDisabled();
				$('blogSliderContainer').hide();
			}	
		}
		else if($('searchResultsHandle'))
		{
			// vertical slider control
			ScrollBar.searchResultsSlider = new Control.Slider('searchResultsHandle', 'searchResultsTrack', {
				axis: 'vertical',
				onSlide: function(v) { ScrollBar.scrollVertical(v, $('searchResultsText'), ScrollBar.searchResultsSlider); },
				onChange: function(v) { ScrollBar.jumpVertical(v, $('searchResultsText'), ScrollBar.searchResultsSlider); }
			});
			
			MouseWheel.init(ScrollBar.searchResultsSlider); //send slider element to MouseWheel object

					
			// disable vertical scrolling if text doesn't overflow the div
			if ($('searchResultsText').scrollHeight <= $('searchResultsText').offsetHeight) {
				ScrollBar.searchResultsSlider.setDisabled();
				$('searchResultsSliderContainer').hide();
			}	
		}
	},
	
	clickDownValue: function()
	{	
		this.setValueBy(0.25);
		if (typeof event == "undefined") // IE bug fix for assigning event
		{
			event = window.event;
		}
		if (typeof event.preventDefault != "undefined") //if not IE run first, if IE run second to cancel default action
		{
			event.preventDefault();
		}
		else
		{
			event.returnValue = false;
		}
	},
	
	clickUpValue: function()
	{
		this.setValueBy(-0.25);
		if (typeof event == "undefined") // IE bug fix for assigning event
		{
			event = window.event;
		}
		if (typeof event.preventDefault != "undefined") //if not IE run first, if IE run second to cancel default action
		{
			event.preventDefault();
		}
		else
		{
			event.returnValue = false;
		}
	},
	
	scrollVertical: function(value, element, slider) // scroll the element vertically based on its width and the slider maximum value
	{
		element.scrollTop = Math.round(value/slider.maximum*(element.scrollHeight-element.offsetHeight));
	},
	
	jumpVertical: function(value, element, slider) //handles clicking in the slidebar
	{
		var sliderValue = Math.round(value/slider.maximum*(element.scrollHeight-element.offsetHeight));//set value of slider location
		//alert(sliderValue);
		var originOffset = element.scrollTop; //set origin, start offset location
		var currentOffset = element.scrollTop; //track current location of overflow
		
		
		var factor = 1;//set decceleration variable based on whether using mouse wheel or scroll bar, prevent stutter on mouse wheel
		if (MouseWheel.shouldItListen == 1)
		{
			factor = 1;
		}
		else if (MouseWheel.shouldItListen == 0)
		{
			factor = 3;
		}
	
		var frameRate = 25; //framerate for animation
		
		if (sliderValue > originOffset) // if the slider moves down and the text hasn't or oposite
		{
			animateUp();
		}
		else if (sliderValue < originOffset)
		{
			animateDown();
		}
		
		function animateUp()
		{
			currentOffset += (sliderValue - currentOffset) / factor;
			
			if (sliderValue > originOffset && Math.round(currentOffset) >= sliderValue)
			{
				currentOffset = sliderValue;
			}
			else
			{
				var timeUp = setTimeout(animateUp, 1000 / frameRate);
			}
			
			element.scrollTop = Math.round(currentOffset);
		}
			
		function animateDown()
		{
			currentOffset -= (currentOffset - sliderValue) / factor;
			
			if (sliderValue < originOffset && Math.round(currentOffset) <= sliderValue)
			{
				currentOffset = sliderValue;
			}
			else
			{
				var timeDown = setTimeout(animateDown, 1000 / frameRate);
			}
			
			element.scrollTop = Math.round(currentOffset);
		}
	},
	
	standardJumpUp: function(value)
	{
		if (value < 0.2)
			{
				slider.setValue(0.2);
			}
		else if (value < 0.4 && value >= 0.2)
			{
				slider.setValue(0.4);
			}
		else if (value < 0.6 && value >= 0.4)
			{
				slider.setValue(0.6);
			}
		else if (value < 0.8 && value >= 0.6)
			{
				slider.setValue(0.8);
			}
		else if (value < 1.0 && value >= 0.8)
			{
				slider.setValue(1.0);
			}
	}

	
};



/*HANDLE THE MOUSE WHEEL MOVEMENT TO SCROLL TEXT AREAS
*activated inside the init function of scrollbar Object
*each individual handle calls its own mouse wheel script
*/


var MouseWheel =
{
	delta: 0,
	shouldItListen: 0,
	theSlider: "",
	
	init: function(slider)
	{
		if ($$('div.scrollableArea'))
		{
			var textElement = $$('div.scrollableArea'); //get the area to be scrolled
			MouseWheel.theSlider = slider; //assign slider to global variable
			
			//initilize wheel tracking only when over articleText div
			Event.observe(textElement[0], 'mouseover', MouseWheel.startListening);
			Event.observe(textElement[0], 'mouseout', MouseWheel.stopListening);
			
			//set up event listener for mouse wheel
			// mozilla
				Event.observe(textElement[0], 'DOMMouseScroll', MouseWheel.wheel, false);
			// IE/Opera
				Event.observe(textElement[0], 'mousewheel', MouseWheel.wheel, false);
		}	
		
	},
	
	startListening: function() //used to modify decceleration factor of animation
	{
		MouseWheel.shouldItListen = 1;
	},
	
	stopListening: function() //used to modify decceleration factor of animation
	{
		MouseWheel.shouldItListen = 0;
	},
	
	wheel: function(event) //handle wheel's number generation for cross browser usability
	{	
		if (!event) event = window.event;
		
		if (event.wheelDelta) {
			MouseWheel.delta = event.wheelDelta/120; 
			if (window.opera) MouseWheel.delta = MouseWheel.delta; //took minus out to correct Operas direction
		} else if (event.detail) {
			MouseWheel.delta = -event.detail/3;
		}
		
		if (MouseWheel.delta)
			MouseWheel.handle(MouseWheel.delta);
		
		if (event.preventDefault)//try to prevents default browser scrolling
		{
			event.preventDefault();
		}
		else
		{
			event.returnValue = false;
		}
		Event.stop(event); //prototype method that stops default action
	},
	
	handle: function(deltaValue) //takes value and sends it to scroller to make text area move
	{
		if (MouseWheel.shouldItListen == 1)
		{
			var valueForSlider = -deltaValue/100;
			
			MouseWheel.theSlider.setValueBy(valueForSlider);//increase or decrease slider by the supplied value
		}
	}
};


/*MANAGES THE TABBED NOTE CARDS WIDGET*/
var BlogNoteCards =
{
	init: function()
	{
		BlogNoteCards.TabbedBrowsing();
		BlogNoteCards.SetItUp();
		BlogNoteCards.NoteCardCategorySelector();
		BlogNoteCards.PreloadImages();
	},

	NoteCardCategorySelector: function()
	{
		if ($('categoryGridHolder'))
		{
			//creates hover backgound effect and click to link
			var gridArray = $('categoryGridHolder').select('div.catGrid');
			var gridArrayLength = gridArray.length;
			for(var i = 0; i < gridArrayLength; i++)
			{
				Event.observe(gridArray[i], 'mouseover', function(e){
					this.addClassName('hovered');
				});
				Event.observe(gridArray[i], 'mouseout', function(e){
					this.removeClassName('hovered');
				});
				gridArray[i]._url = gridArray[i].getAttribute('title');
				gridArray[i].removeAttribute('title');
				Event.observe(gridArray[i], 'click', function(e){
					window.location = this._url;
				});
			}
		}
	},
	
	TabbedBrowsing: function()
	{
		if($('noteCardTabs'))
		{
			var navTabsArray = $('noteCardTabs').select('div'); //array of 3 tabs
			var navTabsArrayLength = navTabsArray.length;
			var tabImagesArray = $('noteCardTabs').select('img'); //array or 3 tab images
			// set up on, off, current source propperties on each image element
			for (var k = 0; k < tabImagesArray.length; k++)
			{
				if (tabImagesArray[k].getAttribute('src').indexOf('Current') != -1) //if it is current image, base variables off of that
				{
					tabImagesArray[k]._currentSrc = tabImagesArray[k].getAttribute('src'); 
					tabImagesArray[k]._offSrc = tabImagesArray[k]._currentSrc.replace("Current", "Off");
					tabImagesArray[k]._onSrc = tabImagesArray[k]._offSrc.replace("Off", "ON");
				} 
				else //it the "Off" image so assign based on that
				{
					tabImagesArray[k]._offSrc = tabImagesArray[k].getAttribute('src');
					tabImagesArray[k]._currentSrc = tabImagesArray[k]._offSrc.replace("Off", "Current");
					tabImagesArray[k]._onSrc = tabImagesArray[k]._offSrc.replace("Off", "ON");
				}
			}
			
			function toggleColorON(e) //turns tab to 'on' image changing color of tab
			{
				if(this.hasClassName('back'))
				{
					var thisImage = this.select('img')[0];
					thisImage.setAttribute('src', thisImage._onSrc);
				}
			}
			function toggleColorOFF(e) //turns tab to 'off' image changing color of tab
			{
				if(this.hasClassName('back'))
				{
					var thisImage = this.select('img')[0];
					thisImage.setAttribute('src', thisImage._offSrc);
				}
			}
			
			function changeNoteCard(e) //change tabs and show related NoteCard
			{
				if(this.hasClassName('back'))
				{
					//add 'back' class, change images sources on all tabs, & and hide all NoteCards
					for(var j = 0; j < navTabsArrayLength; j++) 
					{
						var theImage = navTabsArray[j].select('img')[0];
						theImage.setAttribute('src', theImage._offSrc);
						navTabsArray[j].addClassName('back');
						$(navTabsArray[j].id.replace("Tab", "NoteCard")).addClassName('hiddenCard');
					}
					//then remove 'back' class,  change image source on clicked tab and display related NoteCard
					var theImage = this.select('img')[0];
					theImage.setAttribute('src', theImage._currentSrc);
					this.removeClassName('back');
					$(this.id.replace("Tab", "NoteCard")).removeClassName('hiddenCard');
					
					// set cookie to remember which tab was last clicked, name='tabTracker' value='clicked-tabs id' days='100'
					Cookies.createCookie('tabTracker', this.id, 5);
				}
			}
			
			for(var i =  0; i < navTabsArrayLength; i++) //set event listeners on each tab
			{
				Event.observe(navTabsArray[i], 'mouseover', toggleColorON.bindAsEventListener(navTabsArray[i]));
				Event.observe(navTabsArray[i], 'mouseout', toggleColorOFF.bindAsEventListener(navTabsArray[i]));
				Event.observe(navTabsArray[i], 'click', changeNoteCard.bindAsEventListener(navTabsArray[i]));
			}
		}
	},
	
	PreloadImages: function()
	{
		
		if (document.images)
		{
			var imageObject = new Array();
			var srcArray = [
				"/artman/images/ATDimages/AskMeghanON227x147.png",
				"/artman/images/ATDimages/MatchesON150x84.png",
				"/artman/images/ATDImages/blogImages/aboutNoteCard350x332.jpg",
				"/artman/images/ATDImages/blogImages/catHoverState104x145.jpg",
				"/artman/images/ATDImages/blogImages/categoriesNoteCard350x332.jpg",
				"/artman/images/ATDImages/blogImages/adminNoteCard350x332.jpg",
				"/artman/images/ATDImages/blogImages/aboutTabCurrent117x41.jpg",
				"/artman/images/ATDImages/blogImages/aboutTabON117x41.jpg",
				"/artman/images/ATDImages/blogImages/aboutTabOff117x41.jpg",
				"/artman/images/ATDImages/blogImages/categoriesTabCurrent116x41.jpg",
				"/artman/images/ATDImages/blogImages/categoriesTabON116x41.jpg",
				"/artman/images/ATDImages/blogImages/categoriesTabOff116x41.jpg",
				"/artman/images/ATDImages/blogImages/adminTabCurrent117x41.jpg",
				"/artman/images/ATDImages/blogImages/adminTabON117x41.jpg",
				"/artman/images/ATDImages/blogImages/adminTabOff117x41.jpg",
				"/artman/images/ATDImages/blogImages/aboutHereON45x18.jpg"];
			var srcArrayLength = srcArray.length;
			
			for(var j = 0; j < srcArrayLength; j++)
			{
				imageObject[j] = document.createElement('img');
				imageObject[j].setAttribute('src',srcArray[j]);
			}
		}
	},
	
	SetItUp: function()
	{
		var tabTrackerValue = Cookies.readCookie('tabTracker');
		if ((tabTrackerValue == 'categoryTab') || (tabTrackerValue == 'aboutTab'))
		{
			var adminImg = $('adminTab').select('img')[0]; //admin image
			var otherImg = $(tabTrackerValue).select('img')[0] //category of about image
			// add 'back' class to adminTab remove from the appropriate tab
			$(tabTrackerValue).removeClassName('back');
			$('adminTab').addClassName('back');
			otherImg.setAttribute('src', otherImg._currentSrc);
			adminImg.setAttribute('src', adminImg._offSrc);
			// reveal appropriate note card and hide admin note card 
			$(tabTrackerValue.replace("Tab", "NoteCard")).removeClassName('hiddenCard');
			$('adminNoteCard').addClassName('hiddenCard');
		}
		else{$('adminNoteCard').removeClassName('hiddenCard');}
	}
};



/*BASIC COOKIES OBJECT WITH METHODS FOR READING, WRITING AND DELETING COOKIES*/
var Cookies = 
{
	createCookie: function(name,value,days) 
	{
		if (days) {
			var date = new Date();
			date.setTime(date.getTime()+(days*24*60*60*1000));
			var expires = "; expires="+date.toGMTString();
		}
		else var expires = "";
		document.cookie = name+"="+value+expires+"; path=/";
	},

	readCookie: function(name) 
	{
		var nameEQ = name + "=";
		var ca = document.cookie.split(';');
		for(var i=0;i < ca.length;i++) {
			var c = ca[i];
			while (c.charAt(0)==' ') c = c.substring(1,c.length);
			if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
		}
		return null;
	},

	eraseCookie: function(name) 
	{
		Cookies.createCookie(name,"",-1);
	}
};






/*MANAGES THE LATEST HEADLINES WIDGET*/
var BlogHeadlines = 
{
	init: function()
	{
		if ($('latestHeadlinesContainer'))
		{
			// retrieve div holding UL list and headlines, save attributes
			var headlineDiv = $('latestHeadlines');
			var headlineDivHeight = headlineDiv.getHeight(); 
			var headlineDivScrollHeight = headlineDiv.scrollHeight;
			// retrieve ul Element
			var ulElement = $('latestHeadlines').select('ul')[0];
			// retrieve div holding up, down, feed controls
			var controlsDiv = $('latestHeadlinesControls');
			
			//alert("div height: " + headlineDivHeight + "\n"
			//	+ "div scrollHeight: " + headlineDivScrollHeight + '\n'
			//	+ "ul top style: " + ulTopStyle);
			
			// retrieve up, down, rss feed buttons, back button, subscribeLinkList
			var downButton = $('latestHeadlinesControls').select('a.down')[0];
			var upButton = $('latestHeadlinesControls').select('a.up')[0];
			var rssFeedButton = $('latestHeadlinesControls').select('div.feedIcon')[0];
			var backButton = $('latestHeadlinesControls').select('div.closeSubscribe')[0];
			var subscribeList = $('latestHeadlinesControls').select('div.subscribeLinkList')[0]
			
			// hide up, down links if no overflow headlines
			if (headlineDiv.scrollHeight <= headlineDiv.offsetHeight)
			{
				downButton._marked = 1;  //mark so that it won't reappear when subscribe links hidden
				downButton.hide();
				upButton.hide();
			}
			else { //set event listeners on each button
				Event.observe(downButton, 'click', function(e){ //move list up
					var ulTopStyle = parseInt(ulElement.getStyle('top')); //must define here because it changes
					if (ulTopStyle >= -(headlineDivScrollHeight-headlineDivHeight))
					{
						new Effect.Move (ulElement,{ x:0, y:-(headlineDivHeight-15), mode: 'relative'}); //move list of titles
					}
					Event.stop(e);
				}, false);
				
				Event.observe(upButton, 'click', function(e){ //move list down
					var ulTopStyle = parseInt(ulElement.getStyle('top')); //get style.top of ul, updates each click
					if (ulTopStyle <= -headlineDivHeight)
					{
						new Effect.Move (ulElement,{ x:0, y:(headlineDivHeight-15), mode: 'relative'}); //move list of feed titles 
					}
					else if (ulTopStyle > -headlineDivHeight && ulTopStyle <= 0)
					{
						new Effect.Move (ulElement,{ x:0, y:(-ulTopStyle), mode: 'relative'}); //move list of  titles 
					}
					Event.stop(e);
				}, false);  
			}
			Event.observe(rssFeedButton, 'click', function(e){ //reveal rss syndication list
				new Effect.Morph(controlsDiv,{ //animate the controlsDiv to  move up over the list items
				  style:'height:160px; top:-2px;',
				  duration:0.8
				});
				new Effect.Morph(headlineDiv,{ //animate the headlineDiv to  dissapear, 0 height
				  style:'height:0px',
				  duration:0.8
				});
				// list of subscribe links appears, hide controls, reveal back button
				subscribeList.appear();
				upButton.fade();
				downButton.fade();
				rssFeedButton.fade();
				backButton.appear();
				
				//wire backButton w/ event listener to close feed subscribe pannel
				Event.observe(backButton, 'click', function(e){
					new Effect.Morph(controlsDiv,{ //animate the controlsDiv back to bottom
					  style:'height:15px; top:155px;',
					  duration:0.8
					});
					new Effect.Morph(headlineDiv,{ //animate the headlineDiv to expand to original height
					  style:'height:155px',
					  duration:0.8
					});
					// hide and show correct parts for original state
					subscribeList.fade();
					rssFeedButton.appear();
					backButton.fade();
					if (downButton._marked != 1) //if originally hidden, don't reappear
					{
						upButton.appear();
						downButton.appear();
					}
					Event.stop(e);
				}, false);
			});
		}
	}
};