// COSTANTS;
var center_lat;
var center_lng;
var START_ZOOM = 15;
var map;

function init()
{
    if (GBrowserIsCompatible()) {
           
        // map object instance creation
        map = new GMap2(document.getElementById("map"));
         
        // adding map controls       
        // map.addControl(new GSmallMapControl());
        map.addControl(new GLargeMapControl());
        map.addControl(new GScaleControl());
        // map.addControl(new GSmallZoomControl());
        map.addControl(new GMapTypeControl());
        map.enableScrollWheelZoom();
        // visualization start center
        map.setCenter(new GLatLng(win_center_lat, win_center_lng), START_ZOOM);
        
        listMarkers(new GLatLng(win_center_lat, win_center_lng));
        
        GEvent.addListener(map,'click',function(overlay,point) {
            // if there's no overlay under the click, fetch new markers near the click and redraw
            if(overlay == null){
                map.clearOverlays(); 
                listMarkers(point); //pass in the point for the center
            }
            // otherwise draw the info window and don't redraw markers
        });
    }
}

//loads markers from server
function listMarkers(point) {

    //remove the existing markers
    //map.clearOverlays();

    //create the boundary for the data to provide initial filtering
    var bounds = map.getBounds();
    var southWest = bounds.getSouthWest();
    var northEast = bounds.getNorthEast();
    var url = '/map/nearby_markers?ne=' + northEast.toUrlValue() + '&sw=' + southWest.toUrlValue()+'&ll='+point.toUrlValue();

    //log the URL for testing
    //GLog.writeUrl(url);
    
    //retrieve the points using Ajax
    var request = GXmlHttp.create();
    //tell the request where to retrieve data from
    request.open('GET', url, true);
    //tell the request what to do when the state changes
    request.onreadystatechange = function() {
        if (request.readyState == 4) {
            
            //parse the result to JSON,by evaluating it, the response should be an array of markers
            //alert(request.responseText); //DEBUG to see what returns the server
            markers=eval( "(" + request.responseText + ")" );
            for (var i = 0 ; i < markers.length ; i++) {
                var marker=markers[i];
                var lat=marker.lat;
                var lng=marker.lng;
                var enc=marker.enc;
                var encryption="None";
                
                //defines antenna colour
                var icon_colour='/images/antenna_green_icon.png';
                if (enc==2) {icon_colour='/images/antenna_red_icon.png'; encryption="WPA"}
                else if (enc==1) {icon_colour='/images/antenna_orange_icon.png'; encryption="WEP"}            
                
                //check for lat and lng so MSIE does not error
                //on parseFloat of a null value
                if (lat && lng) { 
                    var latlng = new GLatLng(parseFloat(lat),parseFloat(lng));
                    var html = '<div><b>essid</b> '
                        + marker.essid
                        + '</div><div><b>bssid</b> '
                        + marker.bssid
                        +'</div><div><b>Latitude</b> '
                        +marker.lat
                        +'</div><div><b>Longitude</b> '
                        +marker.lng
                        + '<div><b>Encryption</b> '
                        +encryption
                        + '</div>';
                    marker = addMarkerToMap(latlng, html, icon_colour); 
                    map.addOverlay(marker);
                }
            }
        }
    }
    request.send(null);
}

//draws markers
function addMarkerToMap(latlng, html, icon_colour) {
    
    //personalized icon
    var icon = new GIcon();

    icon.image = icon_colour;
    icon.iconSize = new GSize(30, 30);
    icon.iconAnchor = new GPoint(15, 30);
    icon.infoWindowAnchor = new GPoint(15, 15);
    
    var marker = new GMarker(latlng,icon);
    GEvent.addListener(marker, 'click', function() {
        var markerHTML = html;
        marker.openInfoWindowHtml(markerHTML);
    });
    return marker;
}