var mapa;
var gris;
var max_bounds;
var centro;
var pathCoordinates;

window.addEvent('domready', function () {

    myChain = new Chain();

    myChain.chain (
        iniciar_mapa(),
        crear_vectores()
    );
        
});

function TileToQuadKey ( x, y, zoom){
    var quad = "";
    for (var i = zoom; i > 0; i--) {
        var mask = 1 << (i - 1);
        var cell = 0;
        if ((x & mask) != 0)
            cell++;
        if ((y & mask) != 0)
            cell += 2;
        quad += cell;
    }
    return quad;
}

var madrid = new google.maps.ImageMapType({
    getTileUrl: function(coord, zoom) {
        return "http://www.mapearmadrid.net/tiles/" + TileToQuadKey(coord.x,coord.y,zoom) + ".png";
    },
    tileSize: new google.maps.Size(256, 256),
    isPng: true,
    maxZoom: 12,
    name: 'Madrid',
    alt: 'Mapear Madrid'
});

function iniciar_mapa ()
{
    // var latlng = new google.maps.LatLng(40.577837312687215, -3.7968861890625005); // Punto calculado para centrar el mapa
    var latlng = new google.maps.LatLng(40.5402771166058, -3.4590565992187505); // Punto calculado para centrar el mapa
    centro = latlng;
    
    var myOptions = {
      zoom: 9,
      center: latlng,
      mapTypeControl: false,
      scaleControl: false,
      disableDoubleClickZoom: false,
      draggable: true,
      scrollwheel: false
    };

    mapa = new google.maps.Map(document.getElementById("mapa"), myOptions);
    mapa.setMapTypeId('madrid');
    mapa.mapTypes.set('madrid', madrid);

    google.maps.event.addListener(mapa, 'zoom_changed', function() {
        if (mapa.getZoom() > 11) mapa.setZoom(11);
        if (mapa.getZoom() < 9) mapa.setZoom(9);
    });

    google.maps.event.addListener(mapa, 'tilesloaded', function(e) {
        google.maps.event.clearListeners(mapa, 'tilesloaded');
        mostrar_mapa();
        $('mapa').setStyle('background-color', '#E6E6E6');
    });

}

function mostrar_mapa ()
{
    $('over_mapa').fade('out');
}

function crear_vectores ()
{
    vectores.each(function (vector) {
        crear_vector(vector);
    });
}

function crear_vector (vector)
{
    // Posición usuario
    var posicion = new google.maps.LatLng(vector.lat, vector.lng);

    // Marker inicio
    var image = new google.maps.MarkerImage(base_url + 'img/marker_'+ vector.tipo.toLowerCase() +'.png',
        // This marker is 20 pixels wide by 32 pixels tall.
        new google.maps.Size(8, 8),
        // The origin for this image is 0,0.
        new google.maps.Point(0,0),
        // The anchor for this image is the base of the flagpole at 0,32.
        new google.maps.Point(4, 4)
    );

    // Definimos los puntos de fuga y de destino para dibujar el vector
    var p_fuga = vector.fuga.split(',');
    var p_espa = vector.espacio.split(',');

    var marker = new google.maps.Marker({
        position: posicion,
        map: mapa,
        title: vector.nombre,
        icon: image,
        flat: true
    });
  
    var puntos = [
        posicion,
        new google.maps.LatLng(p_fuga[0], p_fuga[1]),
        new google.maps.LatLng(p_espa[0], p_espa[1])
    ];

    // Dibujamos el vector
    var v = new google.maps.Polyline({
      path: puntos,
      strokeColor: vector.color,
      strokeOpacity: 1,
      strokeWeight: 1
    });
    
    v.setMap(mapa);

}