$(function() {

    // Open up the layer popup
    $('#feature').click(function(e) {
        e.preventDefault();
	    preloadImages();
        showPopUp();
    });
    
    // Close the layer popup - two scenarios
    $('.closeBtn').click(function(e) {
        e.preventDefault();
        closePopUp(); 
    });
	$('#hiddenLayer').click(function() {
        closePopUp();
    });
    
    // Toggle between the layer popups
    $('.toggleBtn').click(function(e) {
	e.preventDefault();
        $(this).parent().fadeOut(500, function() {$(this).siblings().fadeIn(500);})
    });
    
    // Maps navigation
    $('#mapsNav ul li a').click(function(e) {
        var hrefVal = $(this).attr('href'),
            imageClassName = hrefVal.substr(1),
            targetDiv = this.id,
            listId = $(this).parent().attr('id');
            
        e.preventDefault();      
        $('#container > div').hide().find('span').remove();
        $('.' + targetDiv).prepend('<span class="'+ imageClassName +'"></span>')
                          .fadeIn(800);
        
        $('#mapsNav ul').find('a').removeClass('on');
        $('#mapsNav ul li#' + listId).find('a').addClass('on');
        
    });
    
    $('#container .title').css('opacity', '.7');
    $('#container .desc').css('opacity', '.7');    

});

function showPopUp() {
    var theWidth = $(document).width();
    var theHeight = $(document).height();
    
    $('#hiddenLayer').css({
        'width': theWidth,
        'height': theHeight,
        'opacity' : 0 
    }).animate({'opacity': .8}, 500);
        
    $('#popUp').fadeIn(500);
}

function closePopUp() {
    $('#popUp').fadeOut(500);
    $('#hiddenLayer').animate({'opacity': 0}, 500, function() {
        $(this).css({'width': 0, 'height': 0});
    });
}

function preloadImages() {
	var theImages = [];
    var imageList = ['map_1_2.jpg', 'map_2_1.jpg', 'map_2_2.jpg', 'map_3_1.jpg', 'map_3_2.jpg'];
    for(var i=0; i < imageList.length; i++) {
		theImages[i] = new Image();
        theImages[i].src = imageList[i];
    }
}