var map, box;
var draggable = false, resizable = false
var mouseX, mouseY, drawnX, drawnY, diffX, diffY
var typecontrol = new GMapTypeControl(true)

window.onload = function() {

 // Make the variable box global
 box = document.getElementById("mapa-leiho");
 // Register mouse move listener
 document.onmousemove = watchMouse;
 // Load a map initially
 // loadMap(54.78333, 9.43333, 'Flensburg');
}


window.onunload = function() {

 // Make sure that GUnload() is called when necessary on unload
 if(box.style.visibility == "visible")
  GUnload();
}


 // Mouse move listener
function watchMouse(e) {

  // Include possible scroll values
  var sx = window.scrollX || document.documentElement.scrollLeft|| 0;
  var sy = window.scrollY || document.documentElement.scrollTop|| 0;

  if(!e) e = window.event; // IEs event definition
  mouseX = e.clientX + sx;
  mouseY = e.clientY + sy;

  /* Direction of mouse movement
  *  deltaX: -1 for left, 1 for right
  *  deltaY: -1 for up, 1 for down
  */
  var deltaX = mouseX - diffX;
  var deltaY = mouseY - diffY;
  // Store difference in global variables
  diffX = mouseX;
  diffY = mouseY;

  if(resizable) { // The resize button is being held
   changeMapSize(deltaX, deltaY);
  }

  else if(draggable) { // The box is being dragged
   box.style.left= (mouseX - drawnX) + "px";
   box.style.top = (mouseY - drawnY) + "px";
  }
  return false;
}


function dragstart(e) { // Calculate mouse position for dragging

 draggable = true;
 drawnX = mouseX - parseInt(box.style.left);
 drawnY = mouseY - parseInt(box.style.top);

 /* Avoid selecting the content
  * of the box while dragging
 */
 if(e.cancelable) { e.preventDefault(); }
 if(window.event) { window.event.returnValue = false; }

 // The box is being dropped
 box.onmouseup = function() { draggable = false; }
}


function loadMap(lat, lng, name) {

 if(GBrowserIsCompatible()) {

  var point = new GLatLng(lat, lng);
  map = new GMap2(document.getElementById("map"));
  map.setCenter(point, scale, G_NORMAL_MAP);
  map.addControl(new GSmallZoomControl());
  map.addMapType(G_SATELLITE_MAP);
  map.addMapType(G_PHYSICAL_MAP);
  map.addControl(new GMapTypeControl());

  // http://www.powerhut.co.uk/googlemaps/custom_markers.php

  var taldeIcon = new GIcon(G_DEFAULT_ICON);
  taldeIcon.image = serverUrl + 'js/marker-icons/home.png';
  taldeIcon.iconSize = new GSize(32,32);
  taldeIcon.shadow = serverUrl + 'js/marker-icons/home-shadow.png';
  taldeIcon.shadowSize = new GSize(48,32);
  taldeIcon.iconAnchor = new GPoint(16,32);
  taldeIcon.infoWindowAnchor = new GPoint(16,0);
  taldeIcon.imageMap = [25,4,25,5,26,6,27,7,28,8,28,9,29,10,30,11,31,12,31,13,31,14,31,15,31,16,29,17,29,18,29,19,29,20,29,21,29,22,29,23,29,24,29,25,28,26,25,27,21,28,17,29,11,29,9,28,7,27,4,26,3,25,3,24,3,23,3,22,3,21,3,20,3,19,3,18,3,17,3,16,0,15,0,14,0,13,0,12,1,11,2,10,2,9,3,8,4,7,4,6,5,5,6,4];

  var hereIcon = new GIcon();
  hereIcon.image = serverUrl + 'js/marker-icons/here.png';
  hereIcon.iconSize = new GSize(32,32);
  hereIcon.shadow = serverUrl + 'js/marker-icons/here-shadow.png';
  hereIcon.transparent = 'markers/transparent.png';
  hereIcon.shadowSize = new GSize(48,32);
  hereIcon.iconAnchor = new GPoint(16,32);
  hereIcon.infoWindowAnchor = new GPoint(16,0);
  hereIcon.imageMap = [24,2,25,3,26,4,26,5,26,6,26,7,26,8,26,9,26,10,26,11,26,12,26,13,26,14,30,15,31,16,31,17,31,18,31,19,30,20,29,21,28,22,27,23,25,24,24,25,23,26,22,27,21,28,20,29,19,30,18,31,15,31,14,30,13,29,12,28,10,27,9,26,8,25,7,24,6,23,5,22,4,21,3,20,2,19,1,18,1,17,1,16,1,15,5,14,5,13,5,12,5,11,5,10,5,9,5,8,5,7,5,6,5,5,5,4,5,3,6,2];

  var herriIcon = new GIcon();
  herriIcon.image = serverUrl + 'js/marker-icons/herri.png';
  herriIcon.iconSize = new GSize(32,32);
  herriIcon.shadow = serverUrl + 'js/marker-icons/herri-shadow.png';
  herriIcon.shadowSize = new GSize(48,32);
  herriIcon.iconAnchor = new GPoint(16,32);
  herriIcon.infoWindowAnchor = new GPoint(16,0);
  herriIcon.imageMap = [18,2,19,3,20,4,20,5,23,6,24,7,25,8,25,9,25,10,25,11,25,12,25,13,25,14,25,15,26,16,26,17,26,18,26,19,26,20,27,21,29,22,30,23,30,24,31,25,31,26,31,27,31,28,31,29,31,30,28,31,5,31,3,30,2,29,2,28,2,27,2,26,2,25,2,24,3,23,4,22,5,21,6,20,6,19,6,18,7,17,7,16,7,15,7,14,8,13,8,12,8,11,8,10,8,9,8,8,8,7,9,6,11,5,13,4,13,3,14,2];

  var ekimenIcon = new GIcon();
  ekimenIcon.image = serverUrl + 'js/marker-icons/ekimen.png';
  ekimenIcon.iconSize = new GSize(32,32);
  ekimenIcon.shadow = serverUrl + 'js/marker-icons/ekimen-shadow.png';
  ekimenIcon.transparent = 'markers/transparent.png';
  ekimenIcon.shadowSize = new GSize(48,32);
  ekimenIcon.iconAnchor = new GPoint(16,32);
  ekimenIcon.infoWindowAnchor = new GPoint(16,0);
  ekimenIcon.imageMap = [23,2,24,3,25,4,26,5,27,6,27,7,27,8,27,9,27,10,27,11,27,12,27,13,27,14,26,15,26,16,25,17,24,18,23,19,22,20,22,21,22,22,22,23,22,24,22,25,22,26,22,27,22,28,22,29,21,30,21,31,13,31,12,30,11,29,11,28,11,27,11,26,11,25,11,24,11,23,11,22,11,21,11,20,11,19,10,18,9,17,8,16,7,15,6,14,6,13,6,12,6,11,6,10,6,9,6,8,6,7,6,6,6,5,7,4,8,3,10,2];

  var marker = new GMarker(point, {draggable:mugigarri, icon:hereIcon});
  if(mugigarri){
    GEvent.addListener(marker, "dragend", function() {
      var it = marker.getLatLng();
      $("#edit-latitude").val(it.y);
      $("#edit-longitude").val(it.x);
      /*
      $.getJSON(serverUrl + "kokatu", {nid:nid, sid:sid, lat:it.y, lon:it.x}, function(data){
        marker.openInfoWindowHtml(data.msg);
      });*/
    });
  } else {
    GEvent.addListener(marker, "mouseover", function() {
      marker.openInfoWindowHtml(name);
    });
    GEvent.addListener(marker, "mouseout", function() {
      map.closeInfoWindow();
    });
  }
  map.addOverlay(marker);

  if(points.length > 0){
    for(var i in points){
      switch(points[i].type){
        case 'herri': icon = herriIcon; break;
        case 'talde': icon = taldeIcon; break;
        case 'ekimen': icon = ekimenIcon; break;
        default: icon = hereIcon;
      }
      addMarker(points[i], icon);
    }
  }

  // Add the self created ResizeControl
  map.addControl(new ResizeControl());
  box.style.visibility = "visible";
  // Add control to switch map types if mapdiv was broad enough
  if(typecontrol.visible) map.addControl(typecontrol);
 }
}

function addMarker(p, icon){
  var point = new GLatLng(Number(p.latitude), Number(p.longitude));
  // icon.image = iconPath + p.type + "-map-icon.png";
  var m = new GMarker(point, {icon:icon});
  GEvent.addListener(m, "mouseover", function() {
    m.openInfoWindowHtml(p.title);
  });
  GEvent.addListener(m, "mouseout", function() {
    map.closeInfoWindow();
  });
  GEvent.addListener(m, "click", function() {
    document.location = serverUrl + "node/" + p.nid;
  });
  map.addOverlay(m);
}

function hideMap() {

 box.style.visibility = "hidden";
 GUnload();
}


function ResizeControl(){};
ResizeControl.prototype= new GControl();

ResizeControl.prototype.initialize=function(map) {

 var resizeButton = document.createElement("div");
 resizeButton.style.width = "20px";
 resizeButton.style.height = "20px";
 resizeButton.style.backgroundImage = "url('resize.gif')";

 resizeButton.onmousedown = function() { resizable = true; }
 document.onmouseup = function() { resizable = false; }
 var container = map.getContainer();
 container.appendChild(resizeButton);

  /* Move the 'Terms of Use' 25px to the left
  * to make sure that it's fully readable
  */
 var terms = container.childNodes[2];
 terms.style.marginRight = "25px";
 return resizeButton;
}


ResizeControl.prototype.getDefaultPosition=function() {
 return new GControlPosition(G_ANCHOR_BOTTOM_RIGHT,new GSize(0,0));
}


 // Resizes the map's width and height by the given increment
 function changeMapSize(dx, dy) {

  var mapdiv = map.getContainer();
  var width = parseInt(mapdiv.style.width);
  var height =  parseInt(mapdiv.style.height);

 /* Take care that the map's width or height do not get
  * a negative value. Unexpected things will happen.
 */
  if(width < 100) { width = 100; }
  if(height < 50) { height = 50; }

  if(width > 400) {
   map.addControl(typecontrol); // Switch map types
   typecontrol.visible = true;
  }
  else {
   map.removeControl(typecontrol);
   typecontrol.visible = false;
  }

  mapdiv.style.width = (width + dx) + "px";
  mapdiv.style.height= (height + dy) + "px";
  map.checkResize();
 }