addLoadEvent(prepareArchive);

function changeArrow(id) {
	//checkpoints
	if (!document.getElementById) return false;
	if (!document.getElementById(id)) return false;
	
	var link = document.getElementById(id);
	var div  = document.getElementById("div." + id);
	
	if (div.style.display == "none") {
		link.style.background = "url(/imgs/icons/bullet_arrow_left.png) no-repeat 100% 50%";
	}
	else {
		link.style.background = "url(/imgs/icons/bullet_arrow_down.png) no-repeat 100% 50%";
	}
	
}

function hideNotCurrent(id) {
	var id = "div." + id;

	//checkpoints
	if (!document.getElementById) return false;
	if (!document.getElementById(id)) return false;

	obj = document.getElementById(id);

	//if div is currently set to be shown
	if (obj.style.display == "") {
		//hide the div
		obj.style.display = "none";
	}
}

function getCurrentMonthYear() {
	//checkpoints
	if (!document.getElementById) return false;
	if (!document.getElementById("posted_on")) return false;

	//get date of when the post was posted
	var date = document.getElementById("posted_on");

	/* date_value will contain something like this:
		"posted on December 20th, 2007" */
	var date_value = date.firstChild.nodeValue;

	/* year value will contain something like this:
		"2007"
	   we get it by removing all the characters from the string
	     except the last 4 */
	var year = date_value.substring(date_value.length-4);

	/* remove the first 10 characters from the string
	   i.e. we get something like this:
		"December 20th, 2007"  */
	var month = date_value.substring(10);

	/* remove any characters from "December 20th, 2007" 
		after the first space is found so we get "December" only */
	month = month.substring(0,month.indexOf(" "));

	var monthYear = month + year;

	return monthYear.toLowerCase();
}

function prepareArchive() {
	//checkpoints
	if (!document.getElementsByTagName) return false;
	if (!document.getElementsByTagName("a")) return false;

	//get month-year of the current post the user is viewing
	var curMonthYear = getCurrentMonthYear();
	
	//create array with all a tags
	var links = document.getElementsByTagName("a");
	//loop through array
	for (var i=0; i < links.length; i++) {
		//if link tag has class "month_year"
		if (links[i].className == "month_year") {
			
			//get the value of the "id" attribute of current element, eg "December2007"
			var monthYear = links[i].getAttribute("id");

			/* if the div containing posts of a particular 
			   month-year isn't the same month-year of the 
			   post we're viewing, hide the div */
			if (monthYear != curMonthYear) {
				hideNotCurrent(monthYear);
				changeArrow(monthYear);
			}

			//set action to when the link is clicked
			links[i].onclick = function() {
				var id = this.getAttribute("id");				

				showHide("div." +id);
				changeArrow(id);

				return false;
			}
		}
	}
}