<!DOCTYPE html>
<html>
	<title>Backwoods Snowmobile Map Map</title>
<head>
	<meta charset="utf-8" />

	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
	<script src="https://backwoodsgpstrails.com/SledMap/leaflet-0.7.3/leaflet.js"></script> 
	<script src="https://backwoodsgpstrails.com/SledMap/leaflet-0.7.2/leaflet.ajax.min.js"></script>
	<script src='https://backwoodsgpstrails.com/SledMap/jquery-1.11.0.min.js'></script>
	<link rel="stylesheet" href="leaflet-0.7.3/leaflet.css" />

	<!-- Locate related files -->	
	<script src="leaflet-locatecontrol-gh-pages/src/L.Control.Locate.js"></script>
	<link rel="stylesheet" href="leaflet-locatecontrol-gh-pages/src/L.Control.Locate.css" />
			
	<!-- Geosearch related files -->
	<script src="l.control.geosearch.js"></script>
	<script src="l.geosearch.provider.openstreetmap.js"></script>
<!--	<link rel="stylesheet" href="http://l.geosearch.css" /> -->
	
	<!-- Permalink related files -->
	<script src="leaflet-plugins-master/control/Permalink.js"></script>
	<script src="leaflet-plugins-master/control/Permalink.Marker.js"></script>
	<script src="leaflet-plugins-master/control/Permalink.Layer.js"></script>
	<script src="leaflet-plugins-master/control/Permalink.Overlay.js"></script>		
		
	<script src="leaflet-plugins-master/layer/vector/KML.js"></script>	
	
	<script src='//api.tiles.mapbox.com/mapbox.js/plugins/leaflet-omnivore/v0.3.1/leaflet-omnivore.min.js'></script>


	


	
	<!-- Fit to full screen style -->
	<style>
		body {
			padding: 0;
			margin: 0;
		}
		html, body, #map {
			height: 100%;
		}

	</style>
</head>
<body>
	<div id="map"></div>
	<div id='logo' style='position: absolute; top: 5px; left: 5px; width:38%; height:auto; z-index:5000' >
	  <a href='https://backwoodsGPStrails.com' target='_blank'>
	  <img src='https://BackWoodsGPSTrails.com/wp3/wp-content/uploads/image/BackwoodsGPStrails_Logo_1x1.gif'  title='Visit the Sponsor Website' width='40%'  /></a>
 	</div>	

	<script>
	// Translate goofy microsoft tile format
	var BingLayer = L.TileLayer.extend({
	    getTileUrl: function (tilePoint) {
	        this._adjustTilePoint(tilePoint);
	        return L.Util.template(this._url, {
	            s: this._getSubdomain(tilePoint),
	            q: this._quadKey(tilePoint.x, tilePoint.y, this._getZoomForUrl())
	        });
	    },
	    _quadKey: function (x, y, z) {
	        var quadKey = [];
	        for (var i = z; i > 0; i--) {
	            var digit = '0';
	            var mask = 1 << (i - 1);
	            if ((x & mask) != 0) {
	                digit++;
	            }
	            if ((y & mask) != 0) {
	                digit++;
	                digit++;
	            }
	            quadKey.push(digit);
	        }
	        return quadKey.join('');
	    }
	});


		// BASE layers
		var ERSI_Url = 'http://server.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer/tile/{z}/{y}/{x}',
            ERSI_attrib = 'ERSI Topo &copy; <a href="http://www.esri.com/" target="_blank">ERSI</a>';

			
		var Google_Terrain_Url = 'http://mt1.googleapis.com/vt?lyrs=t@129,r@186185151&src=apiv3&hl=en-US&x={x}&y={y}&z={z}&s=G&style=api%7Csmartmaps',
            Google_Terrain_attrib = 'Google_Terrain &copy; <a href="http://google.com">Google</a>';   
			
			
		var OpenTopo_Url = 'https://a.tile.opentopomap.org/{z}/{x}/{y}.png',
            OpenTopo_attrib = 'OpenTopo &copy; <a href="http://opentopomap.org/" target="_blank">OpenTopo</a>';  			
				                      
			       
 	  	var Bing_Sat = new BingLayer('http://t{s}.tiles.virtualearth.net/tiles/a{q}.jpeg?g=1398', {
    		subdomains: ['0', '1', '2', '3', '4'],
    		attribution: 'Bing_Sat   <a href="http://www.microsoft.com" target="_blank">&copy; </a>'
			});
					

		// OVERLAYS
 	
		var NH_ATV_Url = 'mbtiles.php?db=ATV_NH.mbtiles&z={z}&x={x}&y={y}',
            NH_ATV_attrib = 'NH_ATV  <a href="http://BackwoodsGPStrails.com">&copy;</a>';			
			 
        var ME_ATV_Url = 'mbtiles.php?db=ATV_ME.mbtiles&z={z}&x={x}&y={y}',
            ME_ATV_attrib = 'ME_ATV <a href="http://BackwoodsGPStrails.com" target="_blank">&copy;</a>';
            
		var VT_ATV_Url = 'mbtiles.php?db=ATV_VT.mbtiles&z={z}&x={x}&y={y}',
            VT_ATV_attrib = 'VT_ATV  <a href="http://BackwoodsGPStrails.com">&copy;</a>';
            
        var NY_ATV_Url = 'mbtiles.php?db=ATV_NY.mbtiles&z={z}&x={x}&y={y}',
            NY_ATV_attrib = 'NY_ATV  <a href="http://BackwoodsGPStrails.com" target="_blank">&copy;</a>';
			
        var MI_ATV_Url = 'mbtiles.php?db=ATV_MI.mbtiles&z={z}&x={x}&y={y}',
            MI_ATV_attrib = 'MI_ATV  <a href="http://BackwoodsGPStrails.com" target="_blank">&copy;</a>';
			
        var WV_ATV_Url = 'mbtiles.php?db=ATV_WV.mbtiles&z={z}&x={x}&y={y}',
            WV_ATV_attrib = 'WV_ATV  <a href="http://BackwoodsGPStrails.com" target="_blank">&copy;</a>';	
			
        var MN_ATV_Url = 'mbtiles.php?db=ATV_MN.mbtiles&z={z}&x={x}&y={y}',
            MN_ATV_attrib = 'MN_ATV  <a href="http://BackwoodsGPStrails.com" target="_blank">&copy;</a>';				
                   
//  	var COOS_Poi = new L.KML("kml/COOS_poi.kml", {async: true});
//		var SNO_NH = new L.KML("kml/NH.ruby.osm.exe", {async: true}); 
//		var SNO_ME = new L.KML("kml/ME.ruby.osm.exe", {async: true});
//		var SNO_VT = new L.KML("kml/VT.ruby.osm.exe", {async: true});
//		var SNO_NY = new L.KML("kml/NY.ruby.osm.exe", {async: true}); 		
// 		var SNO_MI = new L.KML("kml/MI.ruby.osm.exe", {async: true});
 		var SNO_QC = new L.KML("kml/QC.ruby.osm.exe", {async: true});	
//		var SNO_MB = new L.KML("kml/MB.ruby.osm.exe", {async: true});
// 		var SNO_MN = new L.KML("kml/MN.ruby.osm.exe", {async: true});			
//		geojsonLayer.addTo(map);	
		
		var ERSI_Topo      = L.tileLayer(ERSI_Url, {styleId: 22677, attribution: ERSI_attrib}),
		    Google_Terrain = L.tileLayer(Google_Terrain_Url, {styleId: 22677, attribution: Google_Terrain_attrib}),    
		    OpenTopo       = L.tileLayer(OpenTopo_Url, {styleId: 22677, attribution: OpenTopo_attrib});			
		    
 			// Overlays
//			Snow_Depth = L.imageOverlay(Snow_Depth_Url, SnowDepthImageBounds, {opacity:.4}, {attribution: Snow_Depth_attrib}),
			
		 	NH_ATV = new L.tileLayer('mbtiles.php?db=ATV_NH.mbtiles&z={z}&x={x}&y={y}', {
		    	tms: true,
		    	attribution: 'NH_ATV  <a href="http://BackwoodsGPStrails.com">&copy;</a>',
		    	opacity: 0.9	    			
			}), 		
		 	ME_ATV = new L.tileLayer('mbtiles.php?db=ATV_ME.mbtiles&z={z}&x={x}&y={y}', {
		    	tms: true,
		    	attribution: 'ME_ATV  <a href="http://BackwoodsGPStrails.com">&copy;</a>',
		    	opacity: 1.0
		  	}), 
		 	VT_ATV = new L.tileLayer('mbtiles.php?db=ATV_VT.mbtiles&z={z}&x={x}&y={y}', {
		    	tms: true,
		    	attribution: 'VT_ATV  <a href="http://BackwoodsGPStrails.com">&copy;</a>',
		    	opacity: 0.9
			}), 		    	
		 	NY_ATV = new L.tileLayer('mbtiles.php?db=ATV_NY.mbtiles&z={z}&x={x}&y={y}', {
		    	tms: true,
		    	attribution: 'NY_ATV  <a href="http://BackwoodsGPStrails.com">&copy;</a>',
		    	opacity: 1.0
		  	}), 
		 	MI_ATV = new L.tileLayer('mbtiles.php?db=ATV_MI.mbtiles&z={z}&x={x}&y={y}', {
		    	tms: true,
		    	attribution: 'MI_ATV  <a href="http://BackwoodsGPStrails.com">&copy;</a>',
		    	opacity: 1.0
		  	}), 			
		 	WV_ATV = new L.tileLayer('mbtiles.php?db=ATV_WV.mbtiles&z={z}&x={x}&y={y}', {
		    	tms: true,
		    	attribution: 'WV_ATV  <a href="http://BackwoodsGPStrails.com">&copy;</a>',
		    	opacity: 1.0
		  	}) 
			MN_ATV = new L.tileLayer('mbtiles.php?db=ATV_MN.mbtiles&z={z}&x={x}&y={y}', {
		    	tms: true,
		    	attribution: 'MN_ATV  <a href="http://BackwoodsGPStrails.com">&copy;</a>',
		    	opacity: 1.0
		  	}); 



		var map = L.map('map',  
			{
			attributionControl:false,
			boxZoom:true,
			center: new L.LatLng(44.79, -70.08), 		// Snowmobile center
		    zoom: 7,
			layers: [OpenTopo]
			});
					

		var baseMaps = {
		    "ERSI_Topo"      : ERSI_Topo,
			"Google_Terrain" : Google_Terrain,	
			"Open Topo" 	 : OpenTopo,
			"Bing_Sat"       : Bing_Sat,					    
		};
		
		var overlayMaps = {
//		    "Coos_ATV" : Coos_ATV,
//		    "COOS_Poi" : COOS_Poi,
//			"SNO_NH"   : SNO_NH, 
//			"SNO_ME"   : SNO_ME, 			
//			"SNO_VT"   : SNO_VT,
//			"SNO_NY"   : SNO_NY,			
			"SNO_QC"   : SNO_QC,
//			"SNO_MI"   : SNO_MI,
//			"SNO_MB"   : SNO_MB,
//			"SNO_MN"   : SNO_MN
		
		};		

		var layers = L.control.layers(baseMaps, overlayMaps).addTo(map);
		//
		// Add Controls
		//
		L.control.attribution({prefix:false}).addTo(map);	
		L.control.scale({imperial:true,metric:false,position:'bottomright'}).addTo(map);
		map.addControl(new L.Control.Permalink({text: 'Permalink', layers: layers}));

		L.control.locate({position: 'bottomright',follow:true}).addTo(map);	
		
        new L.Control.GeoSearch({provider: new L.GeoSearch.Provider.OpenStreetMap()}).addTo(map);

//		geojsonLayer.addTo(map);


	//
	// Position Tracking
	//
	map.on('locationfound',function(l) {
	 //alert('Tracking...');
		jQuery.ajax({
			type: 'GET', //you can also use GET
			data: ({latitude:l.latlng.lat,longitude:l.latlng.lng, accuracy:l.accuracy, map_type:'ATV' }), 
			url:'SledMap_track.php', 			//pass the values to this server script
			//success: function(msg) {alert('data has been successfully saved!');}
		});	
	 });

	//
	// Event Handlers
	//
	map.on('contextmenu', function(e) {
	    alert(e.latlng);
	});

/*)
///////////////////////////////////	
	function onEachFeature(feature, layer) {
		// does this feature have a property named popupContent?
		if (feature.properties && feature.properties.amenity) {
			layer.bindPopup(feature.properties.amenity);
		}
	}

	var featurecollection = {
	"type": "FeatureCollection",
    "generator": "JOSM",
    "features": [
        {
            "type": "Feature",
            "properties": {
                "amenity": "parking",
                "name": "Carpenter Road Parking",
                "note": "Small gravel lot"
            },
            "geometry": {
                "type": "Point",
                "coordinates": [
                    -75.44916499358,
                    43.66024613941
                ]
            }
        }
	] }
	

		
	L.geoJSON(geojsonFeature, {
		onEachFeature: featurecollection
	}).addTo(map);
	
////////////////////////////////////////// */
	
	</script>
</body>
</html>
