var map;
var geocoder;

$(document).ready(function() {
    $('#addressInput').keyup(function(e) {
        if (e.keyCode == 13) {
            searchLocations();
        }
    });
    
    if (GBrowserIsCompatible()) {
        geocoder = new GClientGeocoder();
        map = new GMap2(document.getElementById('map'));
        map.addControl(new GSmallMapControl());
        map.addControl(new GMapTypeControl());
        map.setCenter(new GLatLng(40, -100), 4);
    }
    
    if ($('#addressInput').val()) {
        searchLocations();
    } else {
        var lat = $('#addressInput').attr('lat');
        var lon = $('#addressInput').attr('lon');

        if (lat && lon) {
            var center = new GLatLng(lat, lon, true);
            searchLocationsNear(center, 500);
        }
    }
});

function searchLocations() {
    var address = document.getElementById('addressInput').value;
    geocoder.getLatLng(address, function(latlng) {
        if (!latlng) {
            var sidebar = document.getElementById('sidebar');
            sidebar.innerHTML = '';
            sidebar.innerHTML = 'No results found.';
            map.setCenter(new GLatLng(40, -100), 4);
        } else {
            searchLocationsNear(latlng);
        }
    });
}

function searchLocationsNear(center, radius) {
    if (typeof radius === 'undefined') {
        radius = document.getElementById('radiusSelect').value;
    }
    var searchUrl = '/locatestores.yaws?lat=' + center.lat().toFixed(3) + '&lon=' + center.lng().toFixed(3) + '&d=' + radius;
    GDownloadUrl(searchUrl, function(data) {
        var xml = GXml.parse(data);
        var markers = xml.documentElement.getElementsByTagName('marker');
        map.clearOverlays();

        var sidebar = document.getElementById('sidebar');
        sidebar.innerHTML = '';
        if (markers.length == 0) {
            sidebar.innerHTML = 'No results found.';
            map.setCenter(new GLatLng(40, -100), 4);
            return;
        }

        var bounds = new GLatLngBounds();
        for (var i = 0; i < markers.length; i++) {
            var name = markers[i].getAttribute('name');
            var address = markers[i].getAttribute('address');
            var distance = parseFloat(markers[i].getAttribute('distance'));
            var phone = markers[i].getAttribute('phone');
            var url = markers[i].getAttribute('url');
            var point = new GLatLng(parseFloat(markers[i].getAttribute('lat')), parseFloat(markers[i].getAttribute('lng')));

            var marker = createMarker(point, name, address, phone, url);
            map.addOverlay(marker);
            var sidebarEntry = createSidebarEntry(marker, name, address, distance);
            sidebar.appendChild(sidebarEntry);
            bounds.extend(point);
        }
        map.setCenter(bounds.getCenter(), map.getBoundsZoomLevel(bounds));
    });
}

function createMarker(point, name, address, phone, url) {
    var marker = new GMarker(point);
    var html = '<b>' + name + '</b> <br/>' + address + '<br />' + phone + '<br />' + '<a href="' + url + '">' + url + '</a>';
    GEvent.addListener(marker, 'click', function() {
        marker.openInfoWindowHtml(html);
    });
    return marker;
}

function createSidebarEntry(marker, name, address, distance) {
    var div = document.createElement('div');
    var html = '<b>' + name + '</b> (' + distance.toFixed(1) + ')<br/>' + address;
    div.innerHTML = html;
    div.style.cursor = 'pointer';
    div.style.marginBottom = '5px';
    GEvent.addDomListener(div, 'click', function() {
        GEvent.trigger(marker, 'click');
    });
    GEvent.addDomListener(div, 'mouseover', function() {
        div.style.backgroundColor = '#eee';
    });
    GEvent.addDomListener(div, 'mouseout', function() {
        div.style.backgroundColor = '#fff';
    });
    return div;
}