$(document).ready(function(){
   // Your code here
   
   var tab1 = $('#creeperTab1');
   var tab2 = $('#creeperTab2');
   
   var mapVirginia = $('#creeperMaps li.virginiaMap');
   var mapRegion = $('#creeperMaps li.regionMap');
   var mapTrail = $('#creeperMaps li.trailMap');
   
   var mapVATab = $('#mapVirginiaTab');
   var mapRETab = $('#mapRegionTab');
   var mapTRTab = $('mapTrailTab');
   
   function removeTabClasses(){	   
	   $("a#creeperTabButton1").removeClass('active');
	   $("a#creeperTabButton2").removeClass('active');
	   
	   $("a#creeperTabButton1").removeClass('inactive');
	   $("a#creeperTabButton2").removeClass('inactive');
   }
   
   function toggleContent(targetButton){
		if(targetButton == 'creeperTabButton1'){

			tab1.css('display','block');
			tab2.css('display','none');
			
		} else {
			
			tab1.css('display','none');
			tab2.css('display','block');
			
		}
   }
   
   function removeMapTabClasses(){
	   mapVATab.removeClass('active');
	   mapRETab.removeClass('active');
	   mapTRTab.removeClass('active');
	   
	   
	   mapVirginia.removeClass('show');
	   mapRegion.removeClass('show');
	   mapTrail.removeClass('show');
	   
	   mapVirginia.addClass('hide');
	   mapRegion.addClass('hide');
	   mapTrail.addClass('hide');
	   	   
   }
   
   /*
<li class="mapTrail tab" id="mapTrailTab"><a href="javascript:null(0)">Trail</a></li>
<li class="mapVirginia tab" id="mapVirginiaTab"><a href="javascript:null(0)">Virginia</a></li>
<li class="mapRegional tab active" id="mapRegionTab"><a href="javascript:null(0)">Regional</a></li>
*/
   
   
   function showMap(targetButton){
		if(targetButton.attr('id') == 'mapVirginiaTab'){
			//alert('Virginia');
			mapVirginia.removeClass('hide');
	   		mapVirginia.addClass('show');
			targetButton.addClass('active');
		}
		
		if(targetButton.attr('id') == 'mapRegionTab'){
			mapRegion.removeClass('hide');
	   		mapRegion.addClass('show');
			targetButton.addClass('active');
		}
		
		if(targetButton.attr('id') == 'mapTrailTab'){
			mapTrail.removeClass('hide');
	   		mapTrail.addClass('show');
			mapTrail.addClass('active');
		}
	
	   
   }
   
   $("#creeperTabButtons a").click(function(event){
		
		removeTabClasses();
		$(this).siblings().addClass('inactive');
		$(this).addClass("active"); 
		
		toggleContent($(this).attr('id'));
		  
   })
   
   
   $("#mapTabs li a").click(function(event){
	   
	    removeMapTabClasses()
		
	    var tabPushed = $(this).parent();
	 
	 	//alert(tabPushed.attr('class'));
		
		showMap(tabPushed);  
	   
   })
   
   
   
   
 });