// Un control TextualZoomControl es un control GControl que muestra botones "Ampliar" y "Reducir" de texto (en lugar de los botones de iconos empleados en Google Maps).

// Primero definimos la función: 
function TextualZoomControl(){

}

// Para convertir el control GControl en subclase, definimos el objeto prototype como instancia del objeto GControl.
TextualZoomControl.prototype = new GControl();

// Creamos un DIV por cada botón y lo colocamos en un contenedor
// DIV devuelto como elemento de control. Añadimos el control al contenedor de mapa y devolvemos el elemento de la clase de mapa a su posición de forma adecuada.
TextualZoomControl.prototype.initialize = function(mapa) {
    var container = document.createElement("div");

    var mapDiv = document.createElement("div");
    //this.setButtonStyle_(mapDiv);
    container.appendChild(mapDiv);

    var typeMapImg = document.createElement("img");
    typeMapImg.src = pluginURL + "/img/google/map.gif" ;
    typeMapImg.style.cursor = "pointer";
    typeMapImg.style.position = "absolute";
    typeMapImg.style.left= "0px";
    mapDiv.appendChild(typeMapImg);
    GEvent.addDomListener(mapDiv, "click", function() {
        mapa.setMapType(G_NORMAL_MAP);
    });

   var satDiv = document.createElement("div");
    //this.setButtonStyle_(mapDiv);
    container.appendChild(satDiv);

    var typeSatImg = document.createElement("img");
    typeSatImg.src = pluginURL + "/img/google/sat.gif" ;
    typeSatImg.style.cursor = "pointer";
    typeSatImg.style.position = "absolute";
    typeSatImg.style.left= "60px";
    satDiv.appendChild(typeSatImg);
    GEvent.addDomListener(satDiv, "click", function() {
        mapa.setMapType(G_SATELLITE_MAP);
    });

   var terrainDiv = document.createElement("div");
    //this.setButtonStyle_(mapDiv);
    container.appendChild(terrainDiv);

    var typeTerImg = document.createElement("img");
    typeTerImg.src = pluginURL + "/img/google/terrain.gif" ;
    typeTerImg.style.cursor = "pointer";
    typeTerImg.style.position = "absolute";
    typeTerImg.style.left= "0px";
    typeTerImg.style.top= "16px";

    terrainDiv.appendChild(typeTerImg);
    GEvent.addDomListener(terrainDiv, "click", function() {
        mapa.setMapType(G_PHYSICAL_MAP);
    });

   var hybridDiv = document.createElement("div");
    //this.setButtonStyle_(mapDiv);
    container.appendChild(hybridDiv);

    var typeHyImg = document.createElement("img");
    typeHyImg.src = pluginURL + "/img/google/hybrid.gif" ;
    typeHyImg.style.cursor = "pointer";
    typeHyImg.style.position = "absolute";
    typeHyImg.style.left= "60px";
    typeHyImg.style.top= "16px";

    hybridDiv.appendChild(typeHyImg);
    GEvent.addDomListener(hybridDiv, "click", function() {
        mapa.setMapType(G_HYBRID_MAP);
    });
    
    
      var masDiv = document.createElement("div");
    //this.setButtonStyle_(mapDiv);
    container.appendChild(masDiv);

    var masImg = document.createElement("img");
    masImg.src = pluginURL + "/img/google/mas.gif" ;
    masImg.style.cursor = "pointer";
    masImg.style.position = "absolute";
    masImg.style.left= "120px";
    masImg.style.top= "0px";

    masDiv.appendChild(masImg);
    GEvent.addDomListener(masDiv, "click", function() {
        mapa.zoomIn();
    });

         var menosDiv = document.createElement("div");
    //this.setButtonStyle_(mapDiv);
    container.appendChild(menosDiv);

     var menosImg = document.createElement("img");
    menosImg.src = pluginURL + "/img/google/menos.gif" ;
    menosImg.style.cursor = "pointer";
    menosImg.style.position = "absolute";
    menosImg.style.left= "120px";
    menosImg.style.top= "16px";

    menosDiv.appendChild(menosImg);
    GEvent.addDomListener(menosDiv, "click", function() {
        mapa.zoomOut();
    });





    mapa.getContainer().appendChild(container);
    return container;
}

// De forma predeterminada, el control se mostrará en la esquina superior izquierda del mapa, con un desplazamiento de 7 píxeles.
TextualZoomControl.prototype.getDefaultPosition = function() {
    return new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(7, 7));
}

// Define el CSS adecuado para un elemento de botón determinado