Leaflet AnimatedMarker plug-in test

<!DOCTYPE html>
<html>
	<head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <meta name="viewport" content="width=device-width">				
        <link rel="stylesheet" href="https://cdn.leafletjs.com/leaflet-0.7.2/leaflet.css" />
        <script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.2/leaflet.min.js"></script>
        <script src="https://rawgithub.com/clhenrick/major-studio-two/gh-pages/map-story/html/js/pct-trail-partial.js"></script>
        <script src="https://rawgithub.com/openplans/leaflet.animatedmarker/master/src/animatedmarker.js"></script>
        <script type="text/javascript" src="https://maps.stamen.com/js/tile.stamen.js?v1.2.4"></script>	
		<style type="text/css">
	        	html, body {
	        		margin: 0 auto;
	        		padding: 0px;
	        		width: 500px;
	        		height: 500px;
	        	}
	        	#map {
	        		width: 500px;
	        		height: 500px;
	        	}
        </style>
	</head>
	<body>
		<div id="map"></div>
		<script type="text/javascript">
			// init the map with Stamen Terrain tiles
			var map = L.map('map').setView([40.3025, -121.2347], 15);
			var layer = new L.StamenTileLayer("terrain");
			map.addLayer(layer);

// create geojson layer
			var geojson = new L.geoJson(pct);
			geojson.addTo(map);

// temporary array to store geojson lat, lon
			var temp = [];

var eachLayer = geojson.eachLayer(function(layer){

var coordinates = layer.feature.geometry.coordinates,
					len = coordinates.length,
					i = 0;
				for (i; i<len; i++){
					var lat = coordinates[i][1],
				    	lon = coordinates[i][0];
					// reverse order of lon, lat for L.polyline
					temp.push([lat, lon]);
				}
			});

var line = new L.polyline(temp),
				animatedMarker = L.animatedMarker(line.getLatLngs(), {
					autoStart: false,
					distance: 500,
					interval: 1000
				});

map.addLayer(animatedMarker);

// pan the map to follow the marker
			setInterval(function(){
				map.panTo({lon: animatedMarker['_latlng'].lng, lat: animatedMarker['_latlng'].lat});
			}, 100);

// delay start so that data has time to load
			setTimeout(function(){
				animatedMarker.start();
			}, 3000);

// function to track animatedMarker's position
			// and stop it at given lat lon values
			var checkLatLon = function(e) {
			    // lat lon values to check for
				var lat = 32.608639206779,
			    	lon = -116.49114320162762;
                
				if (e.latlng.lng === lon && e.latlng.lat === lat){
					alert("whoa!"); // shows the test works
					console.log("lat lon check worked!"); // ""
					animatedMarker.stop(); // doesn't seem to work?
				}
			}
            
            // event listener to check animatedMarker's position
			animatedMarker.on('move', checkLatLon);

</script>	
	</body>
</html>

Modified http://cdn.leafletjs.com/leaflet-0.7.2/leaflet.js to a secure url

Modified http://rawgithub.com/clhenrick/Major-Studio-Two/gh-pages/map-story/html/js/pct-trail-partial.js to a secure url

Modified http://rawgithub.com/openplans/Leaflet.AnimatedMarker/master/src/AnimatedMarker.js to a secure url

Modified http://maps.stamen.com/js/tile.stamen.js?v1.2.4 to a secure url

https://cdn.leafletjs.com/leaflet-0.7.2/leaflet.js

https://rawgithub.com/clhenrick/Major-Studio-Two/gh-pages/map-story/html/js/pct-trail-partial.js

https://rawgithub.com/openplans/Leaflet.AnimatedMarker/master/src/AnimatedMarker.js

https://maps.stamen.com/js/tile.stamen.js?v1.2.4