function center_map_at(map, latitude, longitude){
    map.setCenter(new GLatLng(latitude, longitude), 13);
}

function Rectangle(bounds) {
  this.bounds_ = bounds;
}

Rectangle.prototype = new GOverlay();

// Creates the DIV representing this rectangle.
Rectangle.prototype.initialize = function(map) {
  // Create the DIVs representing our rectangle
  var insideDiv = document.createElement("div");
  var div = document.createElement("div");
  insideDiv.style.border = "1px solid #fff";
  insideDiv.style.padding = "0px";
  insideDiv.style.margin = "0px";
  div.style.border = "1px solid #000";
  div.style.padding = "0px";
  div.style.margin = "0px";
  div.style.position = "absolute";
  div.appendChild(insideDiv);

  // Our rectangle is flat against the map, so we add our selves to the
  // MAP_PANE pane, which is at the same z-index as the map itself (i.e.,
  // below the marker shadows)
  map.getPane(G_MAP_MAP_PANE).appendChild(div);
  
  this.map_ = map;
  this.div_ = div;
  this.insidediv_ = insideDiv;
}

// Remove the main DIV from the map pane
Rectangle.prototype.remove = function() {
  this.div_.parentNode.removeChild(this.div_);
}

// Copy our data to a new Rectangle
Rectangle.prototype.copy = function() {
  return new Rectangle(this.bounds_);
}

// Redraw the rectangle based on the current projection and zoom level
Rectangle.prototype.redraw = function(force) {
  // We only need to redraw if the coordinate system has changed
  if (!force) return;

  // Calculate the DIV coordinates of two opposite corners of our bounds to
  // get the size and position of our rectangle
  var c1 = this.map_.fromLatLngToDivPixel(this.bounds_.getSouthWest());
  var c2 = this.map_.fromLatLngToDivPixel(this.bounds_.getNorthEast());

  // Now position our DIV based on the DIV coordinates of our bounds
  var w = Math.abs(c2.x - c1.x);
  var h = Math.abs(c2.y - c1.y);

  var browser=navigator.appName;
  var version=navigator.appVersion;
 
  if (w > 1 && h > 1){
    this.div_.style.display = "";
    this.div_.style.width =  (w+2) + "px";
    this.div_.style.height = (h+2) + "px";
    this.div_.style.lineHeight = (h+2) + "px";
    this.insidediv_.style.width =  w+ "px";
    this.insidediv_.style.height = h+ "px";
    this.insidediv_.style.lineHeight = h + "px";
    this.div_.style.left = (c1.x - 2) + "px";
    this.div_.style.top = (Math.min(c2.y, c1.y) - 2) + "px";
  } else {
   this.div_.style.display = "none";
  }
}

function ViewRectanglesControl() {}

ViewRectanglesControl.prototype = new GControl();
ViewRectanglesControl.prototype.setEcaseMapType = function(type_){
  gmap.setMapType(type_);
}
ViewRectanglesControl.prototype.initialize = function(map) {
  var container = document.createElement("div");
  container.style.backgroundColor= "transparent"
  var viewMain = document.createElement("div");
  this.setMainStyle(viewMain);
  viewMain.appendChild(document.createTextNode("Ver"));
  GEvent.addDomListener(container, "click", function() {
    	 $("map_menu").toggle();
  });
  GEvent.addDomListener(container, "mouseover", function() {
    	 $("map_menu").show();
  });
   GEvent.addDomListener(container, "mouseout", function() {
    	 $("map_menu").hide();
  });
  
  var vtableMenu = this.create_table();
  var vtableMenuBody = this.create_tbody(vtableMenu);
  vtableMenu.id = "map_menu";
  this.setTableStyle(vtableMenu);
  
  this.create_menu_td(vtableMenuBody,"Todos",viewAllF);
  vtd = this.create_menu_td(vtableMenuBody,"Actual",viewCurrentF);
  vtd.style.borderBottom = "1px #aaa solid";

  this.create_menu_td(vtableMenuBody,"Híbrido",this.setEcaseMapType,G_HYBRID_MAP);
  this.create_menu_td(vtableMenuBody,"Normal",this.setEcaseMapType,G_NORMAL_MAP); 
  this.create_menu_td(vtableMenuBody,"Satélite",this.setEcaseMapType,G_SATELLITE_MAP);
    
  container.appendChild(viewMain);
  container.appendChild(vtableMenu);
  map.getContainer().appendChild(container);
  return container;
}

// By default, the control will appear in the top left corner of the
// map with 7 pixels of padding.
ViewRectanglesControl.prototype.getDefaultPosition = function() {
  return new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(7, 7));
}

// Sets the proper CSS for the given button element.
ViewRectanglesControl.prototype.setMainStyle = function(button) {
  button.style.color = "#D81A1A";
  button.style.backgroundColor = "#eee";
  button.style.padding = "1px 1px 1px 4px";
  button.style.textAlign = "left";
  button.style.cursor = "pointer";
  button.style.width = "3em";
}
ViewRectanglesControl.prototype.setMenuTdStyle = function(button) {
  button.style.color = "#D81A1A";
  button.style.backgroundColor = "#eee";
  button.style.padding = "1px 1px 1px 4px";
  button.style.textAlign = "left";
  button.style.width = "8em";
  button.style.cursor = "pointer";
}
ViewRectanglesControl.prototype.setTableStyle = function(button) {
  button.style.color = "#D81A1A";
  button.style.display = "none";
  button.style.backgroundColor = "#eee";
  button.style.borderCollapse = "collapse";
  button.style.borderSpacing = "0px";
}
ViewRectanglesControl.prototype.create_td = function(tr_) {
  var vtd =  document.createElement("td");
  tr_.appendChild(vtd);
  return vtd;
}
ViewRectanglesControl.prototype.create_table = function() {
   return document.createElement("table");
}
ViewRectanglesControl.prototype.create_tr = function(tablebody_) {
  var vtr =  document.createElement("tr");
  vtr.style.backgroundColor = "#eee";
  tablebody_.appendChild(vtr);
  return vtr;
}
ViewRectanglesControl.prototype.create_tbody = function(table_) {
  var vtr =  document.createElement("tbody");
  table_.appendChild(vtr);
  return vtr;
}
ViewRectanglesControl.prototype.create_menu_td = function(tablebody_,txt_,fn_,maptype_) {
  var vtd = this.create_td(this.create_tr(tablebody_));
  this.setMenuTdStyle(vtd);
  vtd.appendChild(document.createTextNode(txt_));
   GEvent.addDomListener(vtd, "click", function() {
  	if (typeof fn_=='function'){
		 if(maptype_){
		 	fn_(maptype_);
		 }else {
		 	fn_();
		 } 
	}
  });
   GEvent.addDomListener(vtd, "mouseover", function() {
    	 vtd.style.backgroundColor = "#fff"
  });
    GEvent.addDomListener(vtd, "mouseout", function() {
    	 vtd.style.backgroundColor = "#eee"
  }); 
  return vtd;
}

