var mjjames = window.mjjames || {};

mjjames.GettingToUs = function () {
    var _showSelector;
    var _churchLatLon;
    var _map;
    var _directionsService;
    var _directionsDisplay;

    var generateMapOverlay = function () {
        ///<summary>Generates an overlay for use in showing the mapping</summary>
        var message = '<p class="intro">To get directions to Emmanuel simply enter your postcode and click search</p>';
        //generate an overlay 
        $('<div class="overlayContainer"><div class="overlay"><a class="closeOverlay">X</a><div class="overlayContent"><div class="map"></div><div class="directions"><label>Your Postcode <input type="text" /> <button class="getDirections">Search</button></label><div class="results">' + message + '</div></div></div></div></div>')
            .appendTo("body");
        //return the actual overlay content container so that other things can use it
        return $("div.overlayContent div.map")[0];
    };

    var mappingInit = function () {
        ///<summary>Initialises Google Maps</summary>
        _churchLatLon = new google.maps.LatLng(53.490039, -2.984451)
        var myOptions = {
            zoom: 15,
            center: _churchLatLon,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        }
        _map = new google.maps.Map(generateMapOverlay(), myOptions);
        _directionsService = new google.maps.DirectionsService();
        _directionsDisplay = new google.maps.DirectionsRenderer();
        _directionsDisplay.setMap(_map);
        _directionsDisplay.setPanel($("div.overlayContent div.directions div.results")[0]);
        $("div.overlayContent .getDirections").click(performRouting);
        $("div.overlayContainer a.closeOverlay").click(mjjames.GettingToUs.ToggleMap);
    };

    var performRouting = function () {
        var start = $("div.overlayContent div.directions input").val();
        var end = _churchLatLon;
        var request = {
            origin: start,
            destination: end,
            travelMode: google.maps.DirectionsTravelMode.DRIVING
        };
        _directionsService.route(request, function (response, status) {
            if (status == google.maps.DirectionsStatus.OK) {
                _directionsDisplay.setDirections(response);
            }
        });
    };

    var toggleMap = function () {
        ///<summary></summary>

        var $container = $("div.overlayContainer");
        if ($container.length === 0) {
            mappingInit();
        }
        else {
            $container.toggle();
        }
        return false;
    };

    var bindMaps = function () {
        $(_showSelector).click(mjjames.GettingToUs.ToggleMap);
    };

    var loadGoogle = function () {
        ///<summary></summary>
        var script = document.createElement("script");
        script.type = "text/javascript";
        script.src = "http://maps.google.com/maps/api/js?sensor=false&callback=mjjames.GettingToUs.MappingCallback";
        document.body.appendChild(script);
    };

    return {
        init: function (showSelector) {
            loadGoogle();
            _showSelector = showSelector;
        },
        MappingCallback: bindMaps,
        ToggleMap: toggleMap
    };
} ();