/**
 * Javascript pour construire la carte.
 * Utilise:
 * - Leaflet
 * - Leaflet.markercluster
 */

  var dataFiles = {
   assosLayer: '/geo_data/associations_geojson?do=export_text',
   epnsLayer: '/geo_data/associations_geojson?datafilter=epn&do=export_text',
   adminLayer: '/_media/geo_data/agglo_tours_admin.geo.json',
   cucsLayer : '/_media/geo_data/cucs_wgs84.geo.json' ,
   irisLayer: '/_media/geo_data/agglo_tours_iris2.geo.json',
   qppv2015: '/geo_data/quartiers-prioritaires-2015_wgs84_geojson?do=export_raw'
   //epnsLayer: '/_media/geo_data/espace-public-numerique-epn_37.geocode.geo.json'
  };

  function mapInit()
  {
	var viewCenter = [ 47.3903853, 0.6899713 ]; // Tours admin_centre

	var assosLayerGeoJson = L.geoJson(null, {
		  onEachFeature : assos_onEachFeature
	});
	var assosLayer = L.markerClusterGroup();
	jQuery.getJSON( dataFiles.assosLayer, function( data) {
		  assosLayerGeoJson.addData(data);
		  assosLayer.addLayer(assosLayerGeoJson);
	});

	var adminLayer = L.geoJson(null, {
		'style' : admin_style,
		pointToLayer: function (feature, latlng) {
       return L.marker(latlng, {icon: new AdminIcon()}) ;
    }
	});
	jQuery.getJSON( dataFiles.adminLayer, function( data) {
	  	adminLayer.addData(data);
	});

	var cucsLayer = L.geoJson(null, {
		  onEachFeature : cucs_onEachFeature,
			'style' : cucs_style
	  });
	  jQuery.getJSON( dataFiles.cucsLayer, function( data)
	  {
	  	cucsLayer.addData(data);
	  });
	var irisLayer = L.geoJson(null, {
			'style' : iris_style
		});
		jQuery.getJSON( dataFiles.irisLayer, function( data)
		{
			irisLayer.addData(data);
		});
  
	var epnsLayer = L.geoJson( null, {
              pointToLayer: function (feature, latlng) {
               return L.marker(latlng, {icon: new EpnIcon()}) ;
    	      },
    	      onEachFeature : epns_onEachFeature
	});
        jQuery.getJSON( dataFiles.epnsLayer, function( data)
	{
	 epnsLayer.addData(data);
	});
  
	var qppvLayer = L.geoJson(null, {
	  //onEachFeature : cucs_onEachFeature,
	  style : qppv_style
	});
	jQuery.getJSON( dataFiles.qppv2015 )
        .done( function( data)
	{
	  qppvLayer.addData(data);
	});
        
	var overlayMaps = {
	    "Insee iris" : irisLayer ,
	    "Admin" : adminLayer,
	    "CUCS 2014" : cucsLayer ,
	    "QPPV 2015" : qppvLayer ,
	    "Assos" : assosLayer,
	    'EPNs assos <img src="http://savoirscommuns.comptoir.net/_media/geo_data/arobase-black_25x26.png" width="14px"/>' : epnsLayer
	  }
	  var tilesOsmFr = L
	      .tileLayer(
	          'http://{s}.tile.openstreetmap.fr/osmfr/{z}/{x}/{y}.png',
	          {
	            attribution : 'Map data &copy; <a href="http://openstreetmap.org/copyright">OpenStreetMap</a> contributors, Imagery © <a href="http://openstreetmap.fr">OpenStreetMap.FR</a>',
	            maxZoom : 20
	          });
	  var tilesOpenMapquest = L
	      .tileLayer(
	          'http://otile1.mqcdn.com/tiles/1.0.0/osm/{z}/{x}/{y}.jpg',
	          {
	            attribution : 'Tuiles de fond <a href="http://www.mapquest.com/" target="_blank">&copy; MapQuest</a> <img src="http://developer.mapquest.com/content/osm/mq_logo.png"></div>',
	            description : 'Tuiles OpenMapQuest',
	            maxZoom : 19
	          });
	  var tilesMaps = {
	    "OsmFR" : tilesOsmFr,
	    "OpenMapquest" : tilesOpenMapquest
	  };

		map = L.map('map', {
			layers : [ tilesOsmFr, assosLayer ]
		}).setView(viewCenter, 12);
  
	  L.control.layers( tilesMaps, overlayMaps,{collapsed:false}).addTo(map);
	  //map.fitBounds(assosLayer.getBounds()); // error: TypeError: this._northEast is undefined

	  info = L.control();
	  info.onAdd = function( map)
	  {
		  this._div = L.DomUtil.create('div', 'info');
		  this.update();
		  return this._div;
	  };

	  info.update = function( props)
	  {
		  this._div.innerHTML = (props ? '<h4>' + props.title + '</h4>' + '<p>' + props.text + '</p>'
		      : '<p>Afficher les infos sur un point</p>');
	  };
	  info.addTo(map);
  }
  
  function assos_onEachFeature( feature, layer)
  {
    if( feature.properties /* && feature.properties.popupContent */)
    {
      var p=feature.properties;
      layer.bindPopup('<h3><a href="'+p.page+'">' + p.name + '</a></h3>'
      + '<p>' + p.address
      + '<br/><a href="'+p.web+'">'+p.web+'</a>' 
      + '</p>');
      layer.on({
        mouseover : assos_mouse_update_info,
        mouseout : assos_mouse_update_info,
        click : assos_mouse_update_info
      });
    }
  }
  function assos_mouse_update_info( e)
  {
	if( e.type == "mouseout" )
	{
		info.update();
		return;
	}
	var p = e.target.feature.properties;
	info.update({
	  'title' : p.name,
	  'text' : p.address + "<br/>" + p.web
	});
  }

  var AdminIcon = L.Icon.extend({
    options: {
  	iconUrl: '_media/geo_data/town-hall.png',
      iconSize:     [26,26],
      iconAnchor:   [0,0],
      popupAnchor:  [12, 0]
    }
  });
  function admin_style( feature)
  {
	return {
	  fillColor : 'white',
	  fillOpacity : 0,
	  weight : 1,
	  opacity : 1,
	  color : 'purple'
	};
  }
  
  function cucs_style( feature)
  {
	return {
	  fillColor : cucs_style_getColor(feature.properties),
	  weight : 2,
	  color : 'grey',
	  fillOpacity : 1
	};
  }
  function cucs_style_getColor( props)
  {
	switch( props.ZUS )
	{
	case 1:
	  return 'red';
	default:
	}
	return 'orange';
  }
  function cucs_onEachFeature( feature, layer)
  {
    if( feature.properties /* && feature.properties.popupContent */)
    {
      layer.bindPopup('<h3>' + feature.properties.name + '</h3>' + '<p>' + 'CUCS'
		    + (feature.properties.ZUS == 1 ? ' + ZUS' : '') + '</p>');
      layer.on({
        mouseover : cucs_mouse_update_info,
        mouseout : cucs_mouse_update_info,
        click : cucs_mouse_update_info
      });
    }
  }
  function cucs_mouse_update_info( e)
  {
    if( e.type == "mouseout" )
    {
      info.update(); return;
    }
    var props = e.target.feature.properties;
    info.update({
      'title' : props.name,
      'text' : 'CUCS' + (props.ZUS == 1 ? ' + ZUS' : '')
    });
  }
    
  function epns_onEachFeature( feature, layer)
  {
    if( feature.properties /* && feature.properties.popupContent */)
    {
      var p=feature.properties;
      layer.bindPopup('<h3><a href="'+p.page+'">' + p.name + '</a></h3>'
      + '<p>' + p.address
      + '<br/><a href="'+p.web+'">'+p.web+'</a>' 
      + '</p>');
      layer.on({
        mouseover : epns_mouse_update_info,
        mouseout : epns_mouse_update_info,
        click : epns_mouse_update_info
      });
    }
  }
  function epns_mouse_update_info( e)
  {
    if( e.type == "mouseout" )
	{
		info.update();
		return;
	}
	var props = e.target.feature.properties;
	info.update({
	  'title' : props.name,
	  'text' : props.address + "<br/>" + props.web
	});
  }
  var EpnIcon = L.Icon.extend({
    options: {
  	iconUrl: 'http://savoirscommuns.comptoir.net/_media/geo_data/arobase-black_25x26.png',
      iconSize:     [25,26],
      iconAnchor:   [0,0],
      popupAnchor:  [12, 0]
    }
  });
  
  function qppv_style( feature) {
    return {
      fillColor : 'green',
      fillOpacity : 0.4,
      weight : 3,
      opacity : 1,
      color : 'black',
      dashArray : '2'
    };
  }
  
  function iris_style( feature)
  {
    return {
      //fillColor : iris_style_getColor(feature.properties),
      fillOpacity : 0,
      weight : 2,
      opacity : 1,
      color : 'black',
      dashArray : '3'
    };
  }
  function iris_style_getColor( props)
  {
    return 'green';
    /*
     * return d > 1000 ? '#800026' : d > 500 ? '#BD0026' : d > 200 ? '#E31A1C' : d >
     * 100 ? '#FC4E2A' : d > 50 ? '#FD8D3C' : d > 20 ? '#FEB24C' : d > 10 ?
     * '#FED976' : '#FFEDA0';
     */
  }

document.addEventListener('DOMContentLoaded', mapInit, false);