//
// This is the JavaScript file.
//



function load() {
  if (GBrowserIsCompatible()) {
    map    = new GMap2(document.getElementById("map_canvas"));

    map.setCenter(new GLatLng(52.220228,-7.428131),10);
    map.addControl(new GLargeMapControl());
    map.addControl(new GMapTypeControl());

    GEvent.addListener(map,'click',handleClick);

    placemarkerList = new Array();
    iconList        = new Array();

    globalCategory = "townsandvillages";

    GDownloadUrl("generateCategories.php",createCategories);
    GDownloadUrl("generatePlacemarks.php",createPlacemarks);

    return;
  }
}


function handleClick(overlay,latlng) {
  if(latlng) {
    marker = new GMarker(latlng, {draggable:true});
    GEvent.addListener(marker,'click',function() {
      var html = "<table>" +
                 "<tr><td>Name:</td><td><input type='text' id='name' /></td></tr>" +
                 "<tr><td>Address:</td><td><input type='text' id='addr' /></td></tr>" +
                 "<tr><td>Info:</td><td><textarea id='info'/></textarea></td></tr>" +
                 "<tr><td></td><td><input type='button' " +
                 "  value='Save Placemark' onclick='saveData()' /></td></tr>" +
                 "</table>";

    marker.openInfoWindow(html);
    });

    map.addOverlay(marker);
  }
}


function saveData() {
  origname     = document.getElementById('name').value;
  origaddr     = document.getElementById('addr').value;
  originfo     = document.getElementById('info').value;

  var name     = escape(origname);
  var addr     = escape(origaddr);
  var info     = escape(originfo);
  var category = globalCategory;
  var latlng   = marker.getLatLng();
  var lat      = latlng.lat();
  var lng      = latlng.lng();

  var postBody = "name=" + name + "&addr=" + addr + "&info=" + info +
		 "&category=" + category + "&lat=" + lat + "&lng=" + lng;

  GDownloadUrl("/createPlacemark.php",function(data, responseCode) {
    if(responseCode == 200) {
      id = data;

      var text   = "<strong>" + origname + "</strong><br />" + origaddr;

      marker.closeInfoWindow();
      alert("Location Added - New Marker has id " + id);

      placemarkerList[category].push(marker);

      GEvent.clearListeners(marker,'click');

      GEvent.addListener(marker,'dragstart',
                         funcChangeMarkerPositionNotify(id,marker));
      GEvent.addListener(marker,'dragend',
                         funcChangeMarkerPosition(id,marker));
      GEvent.addListener(marker,'click',
                         function() {marker.openInfoWindowHtml(text);});
    }
    },
    postBody);



  return;
}


function deletePlacemark(id) {
  var postBody = "id=" + id;

  GDownloadUrl("/deletePlacemark.php",function(data, responseCode) {
    if(responseCode == 200) {
      map.removeOverlay(placemarkerList[globalCategory][id]);

      alert('Marker ' + id + ' removed successfully');
    } else {
      alert('Problem deleting the placemark.' + data);
    }
    },
    postBody);

  return;
}


function editPlacemark(id) {
  nameElement = document.getElementById('name' + id);
  addrElement = document.getElementById('addr' + id);
  infoElement = document.getElementById('info' + id);

  var postBody = "id=" + id + "&name=" + nameElement.value +
		 "&addr=" + addrElement.value + "&info=" + infoElement.value;

  GDownloadUrl("/editPlacemark.php",function(data, responseCode) {
    if(responseCode == 200) {
      alert('Marker ' + id + ' edited successfully');
    } else {
      alert('Problem editing the placemark.' + data);
    }
    },
    postBody);

  return;
}




function createCategories(data) {
  var xml = GXml.parse(data);

  var categorydiv = document.getElementById("div_category_list");

  var categories = xml.documentElement.getElementsByTagName("category");

  for(var i = 0; i < categories.length; i++) {
    var catcode = categories[i].getAttribute("code");
    var catname = categories[i].getAttribute("name");

    var catpar = document.createElement('p');
    catpar.setAttribute('id','par_cat_' + catcode);
    catpar.setAttribute('class','placemarkcategory');
    catpar.innerHTML = catname;

    var catdiv = document.createElement('div');
    catdiv.setAttribute('id','div_cat_' + catcode);

    GEvent.addDomListener(catdiv,'click',funcChangeCategory(catcode));

    catdiv.appendChild(catpar);
    categorydiv.appendChild(catdiv);

    var icon = createCategoryIcon(catcode);

    iconList[catcode] = icon;
  }

  return;
}


function createCategoryIcon(catcode) {
  var icon = new GIcon(G_DEFAULT_ICON);

  icon.image      = '/images/' + catcode + '48.png';
  icon.iconSize   = new GSize(48,48);
  icon.shadowSize = new GSize(48,48);

  return icon;
}




function funcChangeCategory(catcode) {
  return function() {displayCategory(catcode);};
}


function createPlacemarks(data) {
  var xml = GXml.parse(data);

  var placemarks = xml.documentElement.getElementsByTagName("marker");

  for(var i = 0; i < placemarks.length; i++) {
    var id       = placemarks[i].getAttribute("id");
    var name     = placemarks[i].getAttribute("name");
    var addr     = placemarks[i].getAttribute("address");
    var info     = placemarks[i].getAttribute("info");
    var lat      = placemarks[i].getAttribute("lat");
    var lng      = placemarks[i].getAttribute("lng");
    var category = placemarks[i].getAttribute("category");
    
    if(!placemarkerList[category]) {
      placemarkerList[category] = new Array();
    }

    var marker = createMarker(new GLatLng(lat,lng),id,name,addr,info,category);

    placemarkerList[category][id] = marker;

    map.addOverlay(marker);
  }

  displayCategory(globalCategory);

  return;
}



function displayCategory(category) {

  var catpar = document.getElementById("par_cat_" + globalCategory);
  catpar.setAttribute('class','placemarkcategory');

  catpar = document.getElementById("par_cat_" + category);
  catpar.setAttribute('class','placemarkcategory-selected');

  globalCategory = category;

  for(var catindex in placemarkerList) {
    for(var i in placemarkerList[catindex]) {
      var marker = placemarkerList[catindex][i];

      if(catindex == category) {
	marker.show();
      } else {
	marker.hide();
      }
    }
  }

  return;
}


function createMarker(latlng,id,name,address,info,category) {
  var marker = new GMarker(latlng,
                           {icon: iconList[category],
                            draggable: true,
                            bouncy: false});

  var text   = "<input type='text' id='name" + id + "' value='" + name    + "' /><br />" +
               "<input type='text' id='addr" + id + "' value='" + address + "' /><br />" +
               "<textarea          id='info" + id + "'>" + info + "</textarea><br />" +
               "<input type='button' id='deletebutton" + id + "' " +
               "  value='Delete Placemark' onclick='deletePlacemark(" + id + ")' />" +
               "<input type='button' id='editbutton" + id + "' " +
               "  value='Edit Placemark' onclick='editPlacemark(" + id + ")' />";

  GEvent.addListener(marker,'dragstart',funcChangeMarkerPositionNotify(id));
  GEvent.addListener(marker,'dragend',funcChangeMarkerPosition(id,marker));
  GEvent.addListener(marker,'click',function() {marker.openInfoWindowHtml(text);});


  return marker;
}


function funcChangeMarkerPositionNotify(id) {
  return function() {alert("You are moving marker " + id);};
}


function funcChangeMarkerPosition(id,marker) {
  return function() {
    var newLatLng = marker.getLatLng();
    alert("Changing coordinates of marker " + id + " to " + newLatLng);

    var lat = newLatLng.lat();
    var lng = newLatLng.lng();

    var postBody = "id=" + id + "&lat=" + lat + "&lng=" + lng;

    GDownloadUrl("/updatePlacemark.php",function(data, responseCode) {
      if(responseCode == 200) {
        alert("Marker " + id + " updated");
      }
    },
    postBody);
  };
}