/* <![CDATA[ */
// The speed of the sub navigation division's animated slide
var subnav_speed = 800;
// The name of the button which causes the subnavigation to descend
var subnav_button = "nav_button_technical"
// The name of the subnavigation divider
var subnav_div = "subnav_technical"
// The name of the gallery div
var subnav_gallery = "technical_subnav_gallery"

$(document).ready(function (){

  // Begin to dynamically load the galleria script, which is needed for the navigation tab pictures
  $.getScript("scripts/jquery.galleria.js");
  $.getScript("scripts/photo_gallery.js");

  // A function to turn a tab active, given its id
  // Set as a callback function when the slider is started/finished to give synchronous effect
  function tabActivate(tab) {
      // Next activate the tab sent in
      $("#" + $("#" + tab).attr("id")).addClass("active").removeClass("inactive");
      // Get a handle on the appropriate content div
      var content = $("#" + $("#" + tab).attr("name") + "_content");
      // Get a handle on the appropriate content_area div
      var content_area = $("#content_area");
      // Fill in the content div with the corresponding content
      content_area.html(content.html());
      // Now make the content area as big as the content
      resizeToFitContent();
      // And fade in the content
      content_area.fadeIn(subnav_speed);
  }

  function resizeToFitContent() {
      $("#content").height(parseInt($("#content_area").height()) + 
                           parseInt($(".section_header").css("height")) +
                           parseInt($("#content_area").css("padding-bottom")));
  }

  // Add the inactive class to the auto-opened tab button
  // Otherwise it won't be registered with the event handler
  // Adding this class dynamically enforces download of the active button first
  $("#nav_button_environmental").addClass("inactive");

  // Set up the behavior of an inactive button being clicked
  $(".main_navigation.inactive").click( 
    function () { 
        // First turn all buttons formerly active to inactive
        $("a.active").addClass("inactive").removeClass("active");
		// Get a handle on the tab id. Javascript keeps the -this- pointer as a reference, cannot send in callback
		tab = $(this).attr("id");
        // Hide the current content area, for fadein later
        $("#content_area").hide();
        // Now, if this tab is the chosen tab to lower the subnavigation
		if (tab == subnav_button) {
			    $("#technical_subnav_gallery").attr("href", "#");
                $("#" + subnav_div + "_main").addClass("active").removeClass("inactive");
		        $("#" + subnav_div).slideDown(subnav_speed, function(){ tabActivate(tab); } /* Callback function */);
	}
	// Otherwise it's another main nav button
        // If the subnavigation is currently visible (not hidden)
        else if (!$("#" + subnav_div).is(":hidden")) {
	        // Disable all subnavigation tabs
	        $(".sub_navigation").addClass("inactive").removeClass("active");
		// Then slide it up
		$("#" + subnav_div).slideUp(subnav_speed, function(){ tabActivate(tab); } /* Callback function */);		
	}
	// Otherwise subnav is not down, it's safe to immediately set the content
	else { tabActivate(tab); }
    }
  );

  // Remove the class from the button
  $("#nav_button_environmental").removeClass("inactive");

  // Hide the current content area, for fadein later
  $("#content_area").hide();
  // And finally activate the environmental tab
  tabActivate("nav_button_environmental");

  // Set up the behavior on click of any of the subnavigation links
  $(".sub_navigation").click(
    function () {
        $("#content_area").hide();
        // Disable all subnavigation tabs
        $(".sub_navigation").addClass("inactive").removeClass("active");
        // Then enable this one
        $(this).addClass("active").removeClass("inactive");
	$("#content_area").empty().append($("#" + $(this).attr("name") + "_content").html());
	if ($(this).attr("name") == subnav_gallery) { startGallery(); }
        // Now make the content area as big as the content
        resizeToFitContent();
	$("#content_area").fadeIn(subnav_speed);
    }
  );
});
/* ]]> */