//Loading Symbol
var loading = '<br><br><br><br><br><center><img src="/z-archive/images/loading.gif" border="0"></center>';

//Variables for google maps API
var t = [];
var x = [];
var y = [];
var h = [];

function addPlaces() {
  var address = $("#address").val();
  $.ajax({
    'url': "/API/geocode_zip_code.php",
    'global': false,
    'type': "POST",
    'data': {'address':address},
    'success': function (data) { processPlaces(data); }
  });
}

function processPlaces(data) {
    $('#mapContent').html('');
    // SPLIT LISTINGS INTO ROWS
    listing_array = data.split('~=2=~');
    listing_data2 = listing_array[0].split('~=1=~');
    //Loop out results
    for (i=0; i < listing_array.length; i++) {
      // SPLIT LISTING ROWS INTO CELLS
      listing_data = listing_array[i].split('~=1=~');
      t.push(listing_data[0]);
      x.push(listing_data[1]);
      y.push(listing_data[2]);
      h.push(listing_data[3]);

      $('#mapContent').append('<div style="text-align:center">');
      $('#mapContent').append(listing_data[3]);
      $('#mapContent').append('</div>');
    }
    initialize();
}

function initialize() {
    
    var map_options = {
        center: new google.maps.LatLng(28.0207631,-82.2240993),
        zoom: 9,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };

    var google_map = new google.maps.Map(document.getElementById("map_canvas"), map_options);

    var info_window = new google.maps.InfoWindow({
        content: 'loading',
        maxHeight: 500
    });
    
    // Create new markers
    for (var i = 0; i < t.length; i++) {
        
        //Give first marker a different color
        if(i==0) {
            var pinColor = "009900";   
        } else {
            var pinColor = "FE7569";    
        }
        
        //Define marker images and shadows
        var pinImage = new google.maps.MarkerImage("https://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=%E2%80%A2|" + pinColor,
            new google.maps.Size(21, 34),
            new google.maps.Point(0,0),
            new google.maps.Point(10, 34)
        );
        var pinShadow = new google.maps.MarkerImage("https://chart.apis.google.com/chart?chst=d_map_pin_shadow",
            new google.maps.Size(40, 37),
            new google.maps.Point(0, 0),
            new google.maps.Point(12, 35)
        );
        
        //Load markers
        var m = new google.maps.Marker({
            map: google_map,
            icon: pinImage,
            shadow: pinShadow,   
            animation: google.maps.Animation.DROP,
            title:     t[i],
            position:  new google.maps.LatLng(x[i],y[i]),
            html:      h[i]
        });
        
        //Add a click listener to each marker.
        google.maps.event.addListener(m, 'click', function() {
            info_window.setContent(this.html);
            info_window.open(google_map, this);
        });
    }
}