// kml2gmaps.js
// $Id$

var kml2gmaps = {};

// initial setup
var icon = new GIcon();
icon.image = "http://labs.google.com/ridefinder/images/mm_20_red.png";
icon.shadow = "http://labs.google.com/ridefinder/images/mm_20_shadow.png";
icon.iconSize = new GSize(12, 20);
icon.shadowSize = new GSize(22, 20);
icon.iconAnchor = new GPoint(6, 20);
icon.infoWindowAnchor = new GPoint(5, 1);
kml2gmaps.icon = icon;

// initializer (should be called after loading this document)
kml2gmaps.init = function(map, menu, url) {
  this.reset();

  var gmap = new GMap2(map);
  gmap.addControl(new GLargeMapControl());
  gmap.addControl(new GMapTypeControl());
  this.map = gmap;

  this.menu = menu;

  var name = 'kml2gmaps';
  var proxy = 'http://app.drk7.jp/xml2json/';
  var script = document.createElement('script');
  script.charset = 'utf-8';
  script.src = proxy + '&var=' + name + '&url=' + encodeURIComponent(url);
  document.body.appendChild(script);
};

// finalizer
kml2gmaps.reset = function() {
  if (this.map) {
    this.map.clearOverlays();
    delete this.map;
  }
  if (this.data) delete this.data;
  if (this.menu) this.menu.innerHTML = '';
}

// create a marker and add an item to 'menu'
kml2gmaps.createMarker = function(point, index, name, desc) {
  var letter = String.fromCharCode("A".charCodeAt(0) + index);
  var marker = new GMarker(point, this.icon);
  var msg = name ? '<b>' + name + '</b>' + (desc ? '<p>' + desc + '</p>' : '') : 'Marker <b>' + letter + '</b>';
  msg = '<div class="popup">' + msg + '</div>';

  var li = document.createElement("li");
  li.innerHTML = '<img src="' + this.icon.image + '"> ' + name;

  var f = function() { marker.openInfoWindowHtml(msg); li.style.background = '#DDE'; };
  var g = function() { li.style.background = 'transparent'; }
  GEvent.addListener(marker, "click", f);
  GEvent.addListener(marker, "infowindowclose", g);
  li.onmousedown = f;
  li.onmouseover = function() { li.style.marginLeft = '2px'; }
  li.onmouseout = function() { li.style.marginLeft = '0px'; }

  this.menu.appendChild(li);
  return marker;
};

// onload initializer (should be called after receiving xml2json reply)
kml2gmaps.onload = function(data) {
  var placemarks = data['Folder'] ? data['Folder']['Placemark'] :
    { 'Point': data['Placemark'] };

  var i = 0;
  for (var name in placemarks) {
    var placemark = placemarks[name];

    var point = null;
    if (placemark['Point'] && placemark['Point']['coordinates']) {
      var c = placemark['Point']['coordinates'].split(',');
      point = new GLatLng(parseFloat(c[1]), parseFloat(c[0]));
    } else if (placemark['LookAt']) {
      point = new GLatLng(parseFloat(placemark['LookAt']['latitude']),
			  parseFloat(placemark['LookAt']['longitude']));
    }

    if (point) {
      if (!i) this.map.setCenter(point, 14);

      var desc = placemark['description'] ? placemark['description'] : '';
      var marker = this.createMarker(point, i, name, desc);
      this.map.addOverlay(marker);

      if (++i >= 20) break;
    }
  }
};