window.addEvent('domready', function() {
	// Make sure that the correct hover state is displayed in the main menu
	// so that the shadows behind the hovered or active items are continuous
	$$('#mainnav li a').addEvent('mouseover', fSetMainnavBG);
	$$('#mainnav li a').addEvent('mouseout', fSetMainnavBG);


	if ($$('#twitpics div.simplepie ul li.rss_image')[0]) {
		// If TwitPic images were displayed on the page, fix the SRC attributes so that
		// the thumbnails are shown, complying with the TwitPic API
		$each($$('#twitpics div.simplepie ul li.rss_image a img'), function(oImage, iImage) {
			var sImgThumbSrc = "http://twitpic.com/show/thumb/" + (oImage.get('src').split("http://twitpic.com/")[1]);
			oImage.set('src', sImgThumbSrc);
		});

		// Set the TwitPic images to have mouseover/mouseout fade-in/fade-out effects
		fNavFadeFX('#twitpics ul');
	}

	if ($$('#rss-images div.simplepie ul li.rss_image')[0]) {
		// If Flickr images were displayed on the page, set them to
		// have mouseover/mouseout fade-in/fade-out effects
		// Set the TwitPic images to have mouseover/mouseout fade-in/fade-out effects
		fNavFadeFX('#rss-images ul');
	}

	if ($('twitter')) {
		$each($$('#twitter div.simplepie ul li'), function(oElement) {
			if (oElement.get('text') == "") {
				// oElement.dispose();
			}
		});
	}
});


// A function which is triggered by hovering a main menu item
// and checks to see which of the items should have their
// backgrounds set to display continuous shadows
function fSetMainnavBG(event) {
	// Only execute this function on menu items which aren't active and if
	// there is an active menu item on the page
	if (!this.hasClass('active') && $$('#mainnav li a.active')[0]) {
		// The backgrounds are set based on the kind of event which was fired
		switch(event.type) {
			case "mouseover":
				// Store references to the previous and next LI siblings of the main menu
				var oPreviousLI = this.getParent().getPrevious('li');
				var oNextLI = this.getParent().getNext('li');

				// If there was a next sibling and it is active, set the active menu item to a continuous shadow background
				if (oNextLI != null) {
					// Store a reference to the anchor element within this menu item
					var oSiblingAnchor = oNextLI.getChildren('a')[0];

					if (oSiblingAnchor.hasClass('active')) {
						oSiblingAnchor.setStyle('background-position', '0 -306px');
					}
				}

				// If there was a previous sibling and it is active, set the current menu item to a continuous shadow background
				if (oPreviousLI != null) {
					// Store a reference to the anchor element within this menu item
					var oSiblingAnchor = oPreviousLI.getChildren('a')[0];

					if (oSiblingAnchor.hasClass('active')) {
						this.setStyle('background-position', '0 -306px');
					}
				}
				break;

			case "mouseout":
				// Reset the background styles for all menu items
				$$('#mainnav li a').setStyle('background-position', '0 0');
				$$('#mainnav li a.active')[0].setStyle('background-position', '0 -153px');

				// Remove the style attributes afterwards to prevent the inline CSS styles
				// from overriding the external CSS styles
				$$('#mainnav li a').set('style', '');
				break;
		}
	}
}


// Implementing fade in and out on the employee navigation menu
// Arguments:
// @sElement - a string which references the element to animate
function fNavFadeFX(sElement) {
	$$(sElement).each(function(container) {
		container.getChildren().each(function(child) {
			var siblings = child.getParent().getChildren().erase(child);

			child.addEvents({
				mouseenter: function() {
					// The rest of the menu items should fade out when another item has focus
					siblings.tween('opacity', 0.5);
				},
				mouseleave: function() {
					// Without active menu items, moving the mouse off of an item should
					// cause all the menu items to fade in
					siblings.tween('opacity', 1);
				}
			});
		});
	});
}