function mapTypeHybrid(map) {
    this.map = map;
    this.button = document.createElement("a");
}

mapTypeHybrid.prototype = new GControl();

mapTypeHybrid.prototype.initialize = function() {

    var map = this.map;

    this.button.className = "show_hybrid";
    this.button.href = "javascript:;";
    this.button.title = "Turn on hybrid layer";
    this.button.innerHTML = "<img src='images/topoptions/satoff.png' border=0 >";

    GEvent.addDomListener(this.button, "click", function() {
          map.setMapType(parkssat);
         // this.button.innerHTML = "<img src='images/topoptions/saton.png' border=0 >";
    });

    map.getContainer().appendChild(this.button);

    return this.button;

}

mapTypeHybrid.prototype.getDefaultPosition = function() {
    return new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(169, 5));
}

function mapTypeMap(map) {
    this.map = map;
    this.button = document.createElement("a");
}

mapTypeMap.prototype = new GControl();

mapTypeMap.prototype.initialize = function() {

    var map = this.map;

    this.button.className = "show_map";
    this.button.href = "javascript:;";
    this.button.title = "Turn on map layer";
    this.button.innerHTML = "<img src='images/topoptions/mapoff.png' border=0 >";

    GEvent.addDomListener(this.button, "click", function() {
         map.setMapType(parksgmap);
        //  this.button.innerHTML = "<img src='images/topoptions/mapon.png' border=0 >";
    });

    map.getContainer().appendChild(this.button);

    return this.button;

}

mapTypeMap.prototype.getDefaultPosition = function() {
    return new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(251, 5));
}


function mapTypeTerr(map) {
    this.map = map;
    this.button = document.createElement("a");
}

mapTypeTerr.prototype = new GControl();

mapTypeTerr.prototype.initialize = function() {

    var map = this.map;

    this.button.className = "show_terrain";
    this.button.href = "javascript:;";
    this.button.title = "Turn on terrain layer";
    this.button.innerHTML = "<img src='images/topoptions/terroff.png' border=0 >";

    GEvent.addDomListener(this.button, "click", function() {
          map.setMapType(parksterr);
        //  this.button.innerHTML = "<img src='images/topoptions/terron.png' border=0 >";
    });

    map.getContainer().appendChild(this.button);

    return this.button;

}

mapTypeTerr.prototype.getDefaultPosition = function() {
    return new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(87, 5));
}

function mapTypeEarth(map) {
    this.map = map;
    this.button = document.createElement("a");
}

mapTypeEarth.prototype = new GControl();

mapTypeEarth.prototype.initialize = function() {

    var map = this.map;

    this.button.className = "show_earth";
    this.button.href = "javascript:;";
    this.button.title = "Turn on 3D Earth view";
    this.button.innerHTML = "<img src='images/topoptions/earthoff.png' border=0 >";

    GEvent.addDomListener(this.button, "click", function() {
         map.setMapType(G_SATELLITE_3D_MAP);
         createScreenOverlayButton(5, 5, 82, 36, "earth"); // x, y, width, height
         createScreenOverlayButton(87, 5, 82, 36, "terr"); // x, y, width, height
         createScreenOverlayButton(170, 5, 82, 36, "sat"); // x, y, width, height
         createScreenOverlayButton(253, 5, 82, 36, "map"); // x, y, width, height
         createScreenOverlayButton(5, 39, 331, 34, "checkboxes"); // x, y, width, height
    });

    map.getContainer().appendChild(this.button);

    return this.button;

}

mapTypeEarth.prototype.getDefaultPosition = function() {
    return new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(5, 5));
}

function toggleSat() {
          map.setMapType(parkssat);
}

/**
 * Create a custom button using screen overlays
 * at the given x, y offset from the top left of the plugin container.
 */
function createScreenOverlayButton(x, y, width, height, name) {


  var _addOverlayForState = function(suffix, drawOrder, visible) {
    // Create the loading overlay.
    var icon = ge.createIcon('');
    if (name =="map") {
         icon.setHref('http://www.parkinfo.org/images/topoptions/mapoff.png');
    } else if (name =="sat") {
         icon.setHref('http://www.parkinfo.org/images/topoptions/satoff.png');
    } else if (name =="terr") {
         icon.setHref('http://www.parkinfo.org/images/topoptions/terroff.png');
    } else if (name =="checkboxes") {
         icon.setHref('http://www.parkinfo.org/images/topoptions/checkboxes.png');
    } else {
         icon.setHref('http://www.parkinfo.org/images/topoptions/earthoff.png');
    }

    var overlay = ge.createScreenOverlay('');
    overlay.setDrawOrder(drawOrder || 0);
    overlay.setVisibility(visible || false);
    overlay.setIcon(icon);
    overlay.getOverlayXY().set(x, ge.UNITS_INSET_PIXELS, y, ge.UNITS_INSET_PIXELS);
    overlay.getScreenXY().set(0, ge.UNITS_INSET_PIXELS, 0, ge.UNITS_INSET_PIXELS);
    overlay.getSize().set(width, ge.UNITS_PIXELS, height, ge.UNITS_PIXELS);
    ge.getFeatures().appendChild(overlay);
    
    return overlay;
  };
  
  var overlayReg = _addOverlayForState('', 1, true);
  var overlayHover = _addOverlayForState('_hover', 2, false);
  var overlayDown = _addOverlayForState('_down', 3, false);
  
  var _setState = function(state) {
    overlayHover.setVisibility(state == 'hover');
    overlayDown.setVisibility(state == 'down');
  };
  
  // NOTE: if you have many screen overlay controls, you should collapse
  // this code down to one listener per event to handle all controls.
  
  var _isMouseOnButton = function(mx, my) {
    //get width of map
    var mapwidth = map.getSize().width;
    return  mx >= mapwidth - (x + width) && mx <= mapwidth - x  &&
           y <= my && my <= y + height;
  };
  
  var buttonDown = false;
  
  google.earth.addEventListener(ge.getWindow(), 'mousedown', function(evt) {
    if (evt.getButton() != 0) // left click
      return;
    
    if (_isMouseOnButton(evt.getClientX(), evt.getClientY())) {
      buttonDown = true;
      _setState('down');
      event.preventDefault();
      return false;
    }
  });
  
  google.earth.addEventListener(ge.getWindow(), 'mousemove', function(evt) {
    if (_isMouseOnButton(evt.getClientX(), evt.getClientY())) {
      _setState(buttonDown ? 'down' : 'hover');
    } else {
      _setState(buttonDown ? 'hover' : '');
    }
    
    if (buttonDown) {
      event.preventDefault();
      return false;
    }
  });
  
  google.earth.addEventListener(ge.getWindow(), 'mouseup', function(evt) {
    if (buttonDown) {
      buttonDown = false;
      _setState(_isMouseOnButton(evt.getClientX(), evt.getClientY()) ?
          'hover' : '');
      event.preventDefault();
      return false;
    }
  });
  
  google.earth.addEventListener(ge.getWindow(), 'click', function(evt) {
    if (evt.getButton() === 0 &&
        _isMouseOnButton(evt.getClientX(), evt.getClientY())) {
    if (name =="map") {
         map.setMapType(parksgmap);
    } else if (name =="sat") {
          map.setMapType(parkssat);
    } else if (name =="terr") {
         map.setMapType(parksterr);
    }      
      buttonDown = false;
    }
  });

}