//<![CDATA[

    // A CustomMapControl is a GControl that displays textual "Zoom In"
    // and "Zoom Out" buttons (as opposed to the iconic buttons used in
    // Google Maps).
    function CustomMapControl() {
    }
    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 container = document.createElement("div");
	  var controlImage = document.createElement("img");
      this.setControlImage(controlImage);
      container.appendChild(controlImage);

	  var control_ref = {};
	  var pan_controls = ["up","left","right","down"];
	  var zoom_controls = ["in","out"];

	  for (var i = 0; i < pan_controls.length; i++) {
		var ctl = pan_controls[i];
		var panDiv = document.createElement("div");
		panDiv.id = "pan_" + ctl;
		panDiv.className = "gmap_custom_control pan_" + ctl;
		panDiv.title = "Pan " + ctl;
		control_ref[panDiv.id] = panDiv;
		container.appendChild(panDiv);
		GEvent.addDomListener(panDiv, "click", function() {
			console.log("panDiv click!");
			dojo.publish("/gmap/event/pan",[this.id]);
		});
	  }

		var lastDiv = document.createElement("div");
		lastDiv.id = "last_result";
		lastDiv.className = "gmap_custom_control last_result";
		lastDiv.title = "Last Result";
		container.appendChild(lastDiv);
		GEvent.addDomListener(lastDiv, "click", function() {
			console.log("last result");
			map.returnToSavedPosition();
		});

	  for (var i = 0; i < zoom_controls.length; i++) {
		var ctl = zoom_controls[i];
		var zDiv = document.createElement("div");
		zDiv.id = "zoom_" + ctl;
		zDiv.className = "gmap_custom_control zoom_" + ctl;
		zDiv.title = "Pan " + ctl;
		control_ref[panDiv.id] = zDiv;
		container.appendChild(zDiv);
		GEvent.addDomListener(zDiv, "click", function() {
			console.log("zoom click!");
			dojo.publish("/gmap/event/zoom",[this.id]);
		});
	  }

      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.
    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, label) {
      button.style.textDecoration = "underline";
      button.style.color = "#0000cc";
      button.style.background = "url('/locator/images/map/zoom_" + label +".png') top left no-repeat";
      button.style.border = "none";
      button.style.marginBottom = "3px";
      button.style.width = "25px";
      button.style.height = "22px";
      button.style.cursor = "pointer";
    }

	CustomMapControl.prototype.setControlImage = function(control) {
		var imgt = (dojo.isIE < 7) ? "gif" : "png";
		control.src = "/locator/images/map/map_control_blk." + imgt;
		control.style.border = "none";
		control.style.margin = "0";
		control.style.padding = "0";
		control.style.width = "67px";
		control.style.height = "126px";
		control.style.position = "absolute";
		control.style.top = "0";
		control.style.left = "0";
		control.className = "custom_map_control";
	}