// The popup show/hide:

function showPop(pop) {
//	document.getElementById(pop).style.visibility = 'visible';
//	document.getElementById('pop00').style.visibility = 'hidden';
//	return true;
	
	if (document.getElementById) { // DOM3 = IE5, NS6
		document.getElementById(pop).style.display = 'block';
		document.getElementById('pop00').style.display = 'none';
	}
	else {
		if (document.layers) { // NS 4
			document.id.display = 'block';
		}
		else { // IE 4
			document.all.id.style.display = 'block';
		}
	}
}    

function hidePop(pop) {
//	document.getElementById(pop).style.visibility = 'hidden';
//	document.getElementById('pop00').style.visibility = 'visible';
//	return true;
	
	if (document.getElementById) { // DOM3 = IE5, NS6
		document.getElementById(pop).style.display = 'none';
		document.getElementById('pop00').style.display = 'block';
	}
	else {
		if (document.layers) { // NS 4
			document.id.display = 'none';
		}
		else { // IE 4
			document.all.id.style.display = 'none';
		}
	}
}



// this function is needed to work around 
// a bug in IE related to element attributes
function hasClass(obj) {
     var result = false;
     if (obj.getAttributeNode("class") != null) {
         result = obj.getAttributeNode("class").value;
     }
     return result;
}   

function stripe(id) {

    // the flag we'll use to keep track of 
    // whether the current row is odd or even
    var even = false;
  
    // if arguments are provided to specify the colours
    // of the even & odd rows, then use the them;
    // otherwise use the following defaults:
    var evenColor = arguments[1] ? arguments[1] : "#fff";
    var oddColor = arguments[2] ? arguments[2] : "#eee";
  
    // obtain a reference to the desired table
    // if no such table exists, abort
    var table = document.getElementById(id);
    if (! table) { return; }
    
    // by definition, tables can have more than one tbody
    // element, so we'll have to get the list of child
    // <tbody>s 
    var tbodies = table.getElementsByTagName("tbody");

    // and iterate through them...
    for (var h = 0; h < tbodies.length; h++) {
    
     // find all the &lt;tr&gt; elements... 
      var trs = tbodies[h].getElementsByTagName("tr");
      
      // ... and iterate through them
      for (var i = 0; i < trs.length; i++) {

        // avoid rows that have a class attribute
        // or backgroundColor style
        if (! hasClass(trs[i]) &&
            ! trs[i].style.backgroundColor) {
 		  
          // get all the cells in this row...
          var tds = trs[i].getElementsByTagName("td");
        
          // and iterate through them...
          for (var j = 0; j < tds.length; j++) {
        
            var mytd = tds[j];

            // avoid cells that have a class attribute
            // or backgroundColor style
            if (! hasClass(mytd) &&
                ! mytd.style.backgroundColor) {
        
              mytd.style.backgroundColor =
                even ? evenColor : oddColor;
            
            }
          }
        }
        // flip from odd to even, or vice-versa
        even =  ! even;
      }
    }
  }


// Drop-Down

function kadabra(zap) {
  if (document.getElementById) {
     var abra = document.getElementById(zap).style;
     if (abra.display == "block") {
        abra.display = "none";
     } else {
        abra.display = "block";
     }
    return false
  } else {
    return true
  }
}

function randomImage() {
	var num = 0;
	var image = new Array();

	image[num++] = "<a href=\"/events/holiday_festival.html\"><img src=\"/images/banner-holiday06.jpg\" alt=\"A Holiday Festival\" /></a>";

	image[num++] = "<a href=\"/events/orchestra_young_artist_competition.html\"><img src=\"/images/banner-yaco2007.jpg\" alt=\"DC Metro-Area Young Artist Competition 2007\" /></a>";

	image[num++] = "<a href=\"/audio/streaming_mp3.html\"><img src=\"/images/banner-bandstand.jpg\" alt=\"Army Bandstand\" /></a>";
		
	var increment = Math.floor(Math.random() * num);

	var cool = image[increment];

	var div = document.getElementById("feature-image");
	div.innerHTML = "";
	div.innerHTML = cool;
}

function cal() {

	// Set varible to the current date
	var right_now = new Date();

	// set variable to current month number (0-11)
	var month_num = right_now.getMonth();
	
	// set varible to the current day value (1-31)
	var thedate = right_now.getDate();
	
	// create an array for the month name
	var month_name = new Array (
		"January ",
		"February ",
		"March ",
		"April ",
		"May ",
		"June ",
		"July ",
		"August ",
		"September ",
		"October ",
		"November ",
		"December ");
	
	// Create a varible right_year with the current year
	var right_year = right_now.getYear();
	
	if (right_year < 200) right_year += 1900;
	
	// create a varible to specify what the
	// last day for the current month is
	var theday = 0;
	
	if (
		month_num == 0 ||
		month_num == 2 ||
		month_num == 4 ||
		month_num == 6 ||
		month_num == 7 ||
		month_num == 9 ||
		month_num == 11 ) {
		endofmonth = 31;
	}
	
	if (
		month_num == 3 ||
		month_num == 5 ||
		month_num == 8 ||
		month_num == 10 ) {
		endofmonth = 30;
	}
	
	if (month_num == 1) {
		// This will check for a leap year
		// If the year is evenly divisible by four
		// or in the case of a new century evenly divisible
		// by 400 then the end of the February month should be the 29th
		
		right_year_divided = right_year/4;
		right_year_divided_string = new String(right_year_divided);
	
		var is_decimal = right_year_divided_string.indexOf('.');
		if (is_decimal != -1) {
			endofmonth = 28;
		} else {
			endofmonth = 29;
		}
		
		right_year_string = new String(right_year);
		
		var the_century = new String(right_year_string.charAt(2));
		the_century = the_century + new String(right_year_string.charAt(3));
		if (the_century == "00") {
			right_year_divided = right_year/400;
			right_year_divided_string= new String(right_year_divided);
			var is_decimal = right_year_divided_string.indexOf('.');
	
			if (is_decimal != -1) {
				endofmonth = 28;
			} else {
				endofmonth = 29;
			}
		}
	}


	var cal;

	// Start building the table
	cal = "<table summary=\"Monthly calendar with links to each days events\" cellspacing=\"0\" cellpadding=\"0\" border=\"0\">";
	
	// Place a caption with the month name and year
	cal += "<caption>";
	cal += month_name[month_num];
	cal += right_year ;
	cal += "</caption>";
	
	// Write the table header row
	cal += "<tr><th>S</th><th>M</th><th>T</th><th>W</th>";
	cal += "<th>Th</th><th>F</th><th>Sa</th></tr><tr>";
	
	// Figure out which day of the week the 1st of the
	// current month belongs to
	first_day = new Date(right_year,month_num,1)
	
	// Write the first row in the calendar with dates
	// Check which date of the month is the first to
	// fill it into the appropriate day of the week
	for (counter = 0; counter < 7; counter++) {
	
		// Check the counter aganst the first day of the month value (0 - 6)
	
		if (counter >= first_day.getDay() )  {
		
			// Start counter for the calendar days
			theday = theday + 1;
			
			// Highlight the day if it is 'the one'
			var theone = theday == thedate ? "<b>" + theday + "</b>" : theday;
		
			// Check if the current day is in the first week if so, place bold text
//			if (theday == thedate) {
//				cal += "<td><b>" + theday + "</b></td>";
//			} else {
				// If it's not the current date, output without bold text

				// Check to see if an event exists
				var myPop = 'pop-' + theday;
				var myDiv = document.getElementById(myPop);
				if ( myDiv ) {
					cal += "<td><a href=\"/event-calendar.html\" onmouseover=\"javascript:showPop('" + myPop + "')\" onmouseout=\"javascript:hidePop('" + myPop + "')\">" + theone + "</a></td>";
				} else {
					cal += "<td>" + theone + "</td>";
				}
//			}

		} else {
			// if there is no day yet output an empty cell
			cal += "<td>&nbsp;</td>";
		}
	}
	
	// End row for the first week of the month
	cal += "</tr>";
	
		// Loop for the rest of the weeks in the month
		for (weeks = 0; weeks < 5; weeks++) {
			cal += "<tr>";
	
			// loop for the days with the remaining weeks
			for (week = 0; week < 7; week++) {
		
				// counter for the day of the month
				theday = theday + 1;

				// Highlight the day if it is 'the one'
				var theone = theday == thedate ? "<b>" + theday + "</b>" : theday;


				// if the couter = the current date display in bold
//				if (theday == thedate) {
//					cal += "<td><b>" + theday + "</b></td>";
//				} else {
	
				// if the counter is higher then than the number of days
				// in the month then display a blank cell
				if (theday > endofmonth) {
					cal += "<td>&nbsp;</td>";
				} else {
					// If it's not the current date, output without bold text

					// Highlight the day if it is 'the one'
//					var theone = theday == thedate ? "<b>" + theday + "</b>" : theday;

					// Check to see if an event exists
					var myPop = 'pop-' + theday;
					var myDiv = document.getElementById(myPop);
					if ( myDiv ) {
						cal += "<td><a href=\"/event-calendar.html\" onmouseover=\"javascript:showPop('" + myPop + "')\" onmouseout=\"javascript:hidePop('" + myPop + "')\">" + theone + "</a></td>";	
					} else {
						cal += "<td>" + theone + "</td>";
					}
				}
//			}
		}
		cal += "</tr>";
	}
	cal += "</table>";

	var div = document.getElementById("minical");
	div.innerHTML = "";
	// blast new HTML content into "popup" <div>
	div.innerHTML = cal;
}