$(document).ready(function () {

    $("#worldImageMap area").mouseover(function () {
        mouseOverContinent($(this).attr('id'), $(this).attr('alt'));
    }).mouseout(function () {
        mouseOutContinent($(this).attr('id'));
    });


    $(".continentImageMap area").mouseover(function () {
        mouseOverCountry($(this).attr('id'), $(this).attr('alt'));
    }).mouseout(function () {
        mouseOutCountry($(this).attr('id'));
    });

    $("#worldImageMap area").click(function () {
        detatchWorldMap();
        hideWorldImages();
        showReturnToMapLink();
        showSelectedContinentMap($(this).attr('id'));
        return false;
    });


    $('#returnToWorldMap').click(function () {
        attatchWorldMap();
        hideContinentMaps();
        showWorldImages();
        hideRegionLists();
        hideCloseListButton();
        hideReturnToMapLink();
    });


    $('.continentImageMap area').click(function () {
        var selectedList = '#' + $(this).attr('id') + '-list';

        hideRegionLists();
        $(selectedList).fadeIn("slow", function () {
            $('.scrollPane').jScrollPane();
        });

        showCloseListButton();
        return false;
    });

    $('#closeList').click(function () {
        hideRegionLists();
        hideCloseListButton();
        return false;
    });



    function detatchWorldMap() {
        $('.transparentMap').removeAttr('useMap');
    }

    function attatchWorldMap() {
        $('.transparentMap').attr('useMap', "#worldImageMap");
    }

    function hideRegionLists() {
        $('#regionLists > div').hide();
    }

    function showCloseListButton() {
        $('#closeList').show();
    }

    function hideCloseListButton() {
        $('#closeList').hide();
    }

    function hideWorldImages() {
        $('.worldMap').hide();
        $('.worldBg').hide();
        $('.continent').hide();
    }

    function showWorldImages() {
        $('.worldMap').show();
        $('.worldBg').show();
    }

    function hideReturnToMapLink() {
        $('#returnToWorldMap').hide();
    }

    function showReturnToMapLink() {
        $('#returnToWorldMap').show();
    }

    function mouseOverContinent(id, alt) {
        var continentMap = '.' + id + '-map';

        var img = '<img src="/Public/images/homepageMap/' + id + 'Shaded.png"  width="645px" height="400px" border="0" class="continent ' + id + '-map" alt="" />';

        $('#worldImageMap').after(img);

        $(continentMap).css('display', 'inline');

        $('#placeName').html(alt);
        $('#placeName').show();
    }

    function mouseOutContinent(id) {
        var continentMap = '.' + id + '-map';

        $(continentMap).remove();

        $('#placeName').hide();
        $('#placeName').html("");

        if (!$(continentMap).hasClass('selected')) {
            $(continentMap).css('display', 'none');
        }
    }

    function showSelectedContinentMap(continentId) {

        var backgroundImg = '<img src="/public/images/homepageMap/' + continentId + '.png" width="645px" height="400px" id="' + continentId + 'ContinentBg" class="continentMap" alt="" />';

        var continentImageMapId = '#' + continentId + 'ContinentImageMap';
        $(continentImageMapId).after(backgroundImg);



        var transparentContinentMap = '#' + continentId + 'Continent';
        var continentMap = '#' + continentId + 'ContinentBg';
        var continentImageMap = '#' + continentId + 'ContinentImageMap';

        $(transparentContinentMap).fadeIn("slow");
        $(continentMap).fadeIn("slow");
        $('.transparentMap').attr('usemap', continentImageMap);
    }

    function hideContinentMaps() {
        //$('.country').hide();
        $('.continentMap').fadeOut("slow", function () { $('.continentMap').remove(); });
    }

    function mouseOverCountry(id, alt) {
        var countryMap = '.' + id + '-map';

        var img = '<img src="/Public/images/homepageMap/' + id + '.png" width="645px" height="400px" border="0" class="continent ' + id + '-map" alt="" />';

        var continentId = $('.continentMap').attr('id');
        var continent = continentId.replace('ContinentBg', '');

        $('#' + continent + 'ContinentImageMap').after(img);

        $('#placeName').html(alt);
        $('#placeName').show();
    }

    function mouseOutCountry(id) {
        var countryMap = '.' + id + '-map';
        $('#placeName').hide();
        $('#placeName').html("");

        $(countryMap).fadeOut("slow", function () { $(countryMap).remove(); });

//        if (!$(countryMap).hasClass('selected')) {
//            $(countryMap).css('display', 'none');
//        }
    }

});