var resetMap;

// We define the function first
function CustomMapControl() {
}

// To "subclass" the GControl, we set the prototype object to
// an instance of the GControl object
CustomMapControl.prototype = new GControl();

// Creates a one DIV for each of the buttons and places them in a container
// DIV which is returned as our control element. We add the control to
// to the map container and return the element for the map class to
// position properly.
CustomMapControl.prototype.initialize = function(map) {
	var customControlsDiv = document.createElement("div");

	var closeMapDiv = document.createElement("div");
	customControlsDiv.appendChild(closeMapDiv);
	this.setButtonStyle_(closeMapDiv);
	closeMapDiv.appendChild(document.createTextNode("Close Map"));
	GEvent.addDomListener(closeMapDiv, "click", function() {
		resetMap(); $('#map').slideToggle();
	});

	var resetMapDiv = document.createElement("div");
	customControlsDiv.appendChild(resetMapDiv);
	this.setButtonStyle_(resetMapDiv);
	resetMapDiv.appendChild(document.createTextNode("Reset Map"));
	GEvent.addDomListener(resetMapDiv, "click", function() {
		// map.panTo(mapMarkerStore.getPoint()); map.setZoom(mapZoom);
		resetMap();
	});

	map.getContainer().appendChild(customControlsDiv);
	return customControlsDiv;
}

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

// Sets the proper CSS for the given button element.
CustomMapControl.prototype.setButtonStyle_ = function(button) {
  button.style.textDecoration = "underline";
  button.style.color = "#0000cc";
  button.style.backgroundColor = "white";
  button.style.font = ".8em Arial";
  button.style.border = "1px solid black";
  button.style.padding = "2px";
  button.style.marginBottom = "3px";
  button.style.textAlign = "center";
  button.style.width = "6em";
  button.style.cursor = "pointer";
}

function loadGMap() {
	if (GBrowserIsCompatible()) {
		var map = new GMap2(document.getElementById("map"));
		var mapCenter = new GLatLng(35.846500,-86.392700);
		var mapZoom = 15;
		var mapMarkerStore = new GMarker(mapCenter);
		var mapChefPlaceInfo = document.createTextNode('The Chef Place Store');
		resetMap = function () { map.setZoom(mapZoom); map.panTo(mapCenter); map.closeInfoWindow(); }
		GEvent.addListener(map, "infowindowopen", function () { map.savePosition(); } );
		GEvent.addListener(map, "infowindowclose", function () { map.returnToSavedPosition(); } );
		GEvent.addListener(mapMarkerStore, "click",
			function () { mapMarkerStore.openInfoWindow(mapChefPlaceInfo); }
		);
		map.addControl(new CustomMapControl());
		// map.addControl(new GSmallZoomControl());
		// map.disableDragging();
		map.setCenter(mapCenter, mapZoom);
		map.addOverlay(mapMarkerStore);
	}
}