var displayState = [];      
function setup(){ 
     //get all regions 
     var rows = jQuery("li.region");      
     //loop through them           
     for(var i = 0; i<rows.length; i++){ 
          var rID = rows[i].id; 
          var toggle = jQuery("#"+rows[i].id+" .toggle_btn"); 
           
          var header = jQuery("#"+rows[i].id+" .collapse-header"); 
           
          toggle.show(); 
          //add click listener to toggle buttons                
          setClick(header, rID); 
          //add to display state 
          displayState[rID] = 0; 
          //toggle visibility of hideboxes to off 
          jQuery("#"+rID+" .hidebox").hide(); 
          jQuery("#"+rID+" .collapse_btn").hide(); 
     }           
} 
function setClick(target, setID){ 
     target.click(function () {                
          toggleRegion(setID);                          
     }); 
} 
function toggleRegion(regionID){      
     var collapse_btn = jQuery("#"+regionID+" .collapse_btn"); 
     var header = jQuery("#"+regionID+" .collapse-header"); 
     var expand_btn = jQuery("#"+regionID+" .expand_btn"); 
     var hidebox = jQuery("#"+regionID+" .hidebox"); 
      
 
      
     if(displayState[regionID]){ 
          //show 
          displayState[regionID] = 0; 
          collapse_btn.hide(); 
          hidebox.animate({height: 'toggle'}, 500); 
          expand_btn.show(); 
           
          header.addClass('closed'); 
          header.removeClass('open'); 
           
     } else { 
          //hide 
          displayState[regionID] = 1; 
          collapse_btn.show(); 
          hidebox.animate({height:'toggle'}, 500, 'easeInOutQuad'); 
          expand_btn.hide(); 
           
          header.removeClass('closed'); 
          header.addClass('open'); 
     } 
} 


$(document).ready(function() 
{
  setup();
});
