Commit 26ced8676b8b0d02793f15a64239e550f41f62de
1 parent
5b416886
Exists in
master
and in
1 other branch
New commit
Showing
4 changed files
with
35 additions
and
120 deletions
Show diff stats
2.64 KB
index.html
... | ... | @@ -12,8 +12,8 @@ |
12 | 12 | <div class="container-fluid"> |
13 | 13 | <div class="left"> |
14 | 14 | <!-- <span>{{timer}}</span> |
15 | - <span>{{timeTaken}}</span> | |
16 | - <span class="add-stop" ng-click="addStop()">add</span> --> | |
15 | + <span>{{timeTaken}}</span> --> | |
16 | + <span class="add-stop" ng-click="addStop()">add</span> | |
17 | 17 | <form> |
18 | 18 | <div class="" ng-repeat="stop in stops"> |
19 | 19 | <!-- lbl="($first)? 'Pickup':($last)?'Drop':'Via'" --> | ... | ... |
src/js/app.js
... | ... | @@ -18,8 +18,6 @@ app.controller('myCtrl', function($scope, $http, $timeout, $rootScope, $interval |
18 | 18 | var directionsService = new google.maps.DirectionsService; |
19 | 19 | var directionsDisplay = new google.maps.DirectionsRenderer(); |
20 | 20 | |
21 | - | |
22 | - | |
23 | 21 | initMap(); |
24 | 22 | $scope.timer = 0; |
25 | 23 | $scope.timeTaken = 0; |
... | ... | @@ -213,6 +211,7 @@ app.controller('myCtrl', function($scope, $http, $timeout, $rootScope, $interval |
213 | 211 | |
214 | 212 | |
215 | 213 | if (validstops.length == $scope.stops.length) { |
214 | + //Set Markers as null **** | |
216 | 215 | var waypoints = []; |
217 | 216 | if ($scope.stops.length > 2) { |
218 | 217 | waypoints = $scope.stops.slice(1, $scope.stops.length - 1); |
... | ... | @@ -242,16 +241,15 @@ app.controller('myCtrl', function($scope, $http, $timeout, $rootScope, $interval |
242 | 241 | directionsDisplay.setOptions({ |
243 | 242 | suppressMarkers: true |
244 | 243 | }); |
245 | - $scope.timer = response.routes[0].overview_path.length; | |
246 | - follow(response.routes[0].overview_path, start, end); | |
244 | + //$scope.timer = response.routes[0].overview_path.length; | |
245 | + follow(response.routes[0].overview_path); | |
247 | 246 | } else { |
248 | 247 | console.log("Need more Stops", start, end, waypoints) |
249 | 248 | } |
250 | 249 | }); |
251 | 250 | } |
252 | 251 | |
253 | - function follow(overview_path, start, end) { | |
254 | - | |
252 | + function follow(overview_path) { | |
255 | 253 | var marker = new SlidingMarker({ |
256 | 254 | position: overview_path[0], |
257 | 255 | icon: { |
... | ... | @@ -264,45 +262,42 @@ app.controller('myCtrl', function($scope, $http, $timeout, $rootScope, $interval |
264 | 262 | duration: 0, |
265 | 263 | easing: "linear" |
266 | 264 | }); |
267 | - // var from; | |
268 | - // var to; | |
269 | - // var heading; | |
270 | - // var arrOfRots = []; | |
271 | - // var pre = [0]; | |
272 | - // var turn; | |
273 | - var j = 0; | |
274 | - | |
275 | 265 | //Distances and Measurements |
276 | - var from; | |
277 | - var to; | |
266 | + var j = 0; | |
278 | 267 | var MPH = 50; //Or x miles per 60 minutes |
279 | - | |
268 | + var rotateTime; | |
280 | 269 | function moveDriver() { |
281 | - | |
282 | - from = new google.maps.LatLng(overview_path[j].lat(), overview_path[j].lng()); | |
283 | - to = new google.maps.LatLng(overview_path[j + 1].lat(), overview_path[j + 1].lng()); | |
284 | - | |
270 | + | |
271 | + map.setZoom(15); | |
272 | + map.panTo(marker.getPosition()); | |
273 | + | |
274 | + var from = new google.maps.LatLng(overview_path[j].lat(), overview_path[j].lng()); | |
275 | + var to = new google.maps.LatLng(overview_path[j + 1].lat(), overview_path[j + 1].lng()); | |
285 | 276 | var heading = Math.round(google.maps.geometry.spherical.computeHeading(from, to)); |
286 | - //if (Math.abs(heading) > 0) { | |
287 | - $('img[src="../includes/images/car3x.png"]').css({ 'transform': 'rotate(' + heading + 'deg)' }); | |
288 | - //} | |
289 | 277 | |
290 | - //Getting Distance to milliseconds | |
291 | - var a = google.maps.geometry.spherical.computeDistanceBetween( from, to );//Metres | |
292 | - var b = a * 0.000621371; //Miles | |
293 | - var c = MPH / b; //Difference | |
294 | - var d = 60 / c; //Work out the minutes based on the difference | |
295 | - var e = d * 60000; // Convert to milliseconds | |
278 | + if (Math.abs(heading) > 75 && Math.abs(heading) < 105) { | |
279 | + console.log('yes', heading); | |
280 | + $('img[src="../includes/images/car3x.png"]').css({ 'transition-duration': '3s' }); | |
281 | + } | |
282 | + | |
283 | + $('img[src="../includes/images/car3x.png"]').css({ 'transform': 'rotate(' + heading + 'deg)' }); | |
284 | + //Getting Distance to milliseconds | |
285 | + var metres = google.maps.geometry.spherical.computeDistanceBetween( from, to );//Metres | |
286 | + var miles = metres * 0.000621371; //Miles | |
287 | + var speed = MPH / miles; //Difference | |
288 | + var speedPerHour = 60 / speed; //Work out the minutes based on the difference | |
289 | + var speedPerMilli = speedPerHour * 60000; // Convert to milliseconds | |
296 | 290 | |
297 | - j++; | |
291 | + j++; | |
298 | 292 | |
299 | - marker.duration = e; | |
300 | - marker.setPosition(overview_path[j]); | |
301 | - if (j < overview_path.length) { | |
302 | - setTimeout(function(){ | |
303 | - moveDriver(); | |
304 | - }, e) | |
305 | - } | |
293 | + marker.duration = speedPerMilli; | |
294 | + marker.setPosition(overview_path[j]); | |
295 | + if (j < overview_path.length) { | |
296 | + setTimeout(function(){ | |
297 | + moveDriver(); | |
298 | + }, speedPerMilli) | |
299 | + } | |
300 | + | |
306 | 301 | } |
307 | 302 | moveDriver(); |
308 | 303 | ... | ... |
unused
... | ... | @@ -1,80 +0,0 @@ |
1 | -THIS IS CODE THAT HAS BEEN REMOVED | |
2 | - | |
3 | - | |
4 | - | |
5 | - var line = new google.maps.Polyline({ | |
6 | - path: [{lat: response.routes[0].overview_path[0].lat(), lng: response.routes[0].overview_path[0].lng()}, {lat: response.routes[0].overview_path[1].lat(), lng: response.routes[0].overview_path[1].lng()}], | |
7 | - icons: [{ | |
8 | - icon: lineSymbol, | |
9 | - offset: '100%' | |
10 | - }], | |
11 | - map: map | |
12 | - }); | |
13 | - response.routes[0].overview_path.forEach(function(x, i){ | |
14 | - if (i % 2 == 0){ | |
15 | - curvedLine({LatStart: x.lat(), LngStart: x.lng(), LatEnd: response.routes[0].overview_path[i + 2].lat(), LngEnd: response.routes[0].overview_path[i + 2].lng()}) | |
16 | - } | |
17 | - var line = new google.maps.Polyline({ | |
18 | - path: [{lat: x.lat(), lng: x.lng()}, {lat: response.routes[0].overview_path[i + 1].lat(), lng: response.routes[0].overview_path[i + 1].lng()}], | |
19 | - map: map | |
20 | - }); | |
21 | - }) | |
22 | - function animateCircle(line) { | |
23 | - var count = 0; | |
24 | - window.setInterval(function() { | |
25 | - count = (count + 1) % 200; | |
26 | - | |
27 | - var icons = line.get('icons'); | |
28 | - console.log(icons); | |
29 | - icons[0].offset = (count / 2) + '%'; | |
30 | - line.set('icons', icons); | |
31 | - }, 20); | |
32 | - } | |
33 | - animateCircle(line); | |
34 | - | |
35 | - $scope.stops.forEach(function(x) { | |
36 | - try{ | |
37 | - //Car Sensors in concept | |
38 | - if(x.Latitude.toFixed(3) == overview_path[overview_path.length - 1].lat().toFixed(3) && x.Longitude.toFixed(3) == overview_path[overview_path.length - 1].lng().toFixed(3)){ | |
39 | - var m = x.$marker; | |
40 | - m.setMap(null); | |
41 | - } | |
42 | - } | |
43 | - catch(e){ | |
44 | - console.log(e); | |
45 | - var m = x.$marker; | |
46 | - m.setMap(null); | |
47 | - clearInterval($scope.drive); | |
48 | - } | |
49 | - finally{ | |
50 | - console.log('I am alerted regardless of the outcome above') | |
51 | - } | |
52 | - }); | |
53 | - | |
54 | - | |
55 | - function calcDistance(p1, p2) { | |
56 | - return (google.maps.geometry.spherical.computeDistanceBetween(p1, p2) / 1000).toFixed(2); | |
57 | - } | |
58 | - | |
59 | - var p1 = new google.maps.LatLng(overview_path[counter].lat(), overview_path[counter].lng()); | |
60 | - var p2 = new google.maps.LatLng(overview_path[counter + 1].lat(), overview_path[counter + 1].lng()); | |
61 | - var difference = calcDistance(p1, p2); | |
62 | - | |
63 | - | |
64 | - p1 = new google.maps.LatLng(overview_path[counter].lat(), overview_path[counter].lng()); | |
65 | - p2 = new google.maps.LatLng(overview_path[counter + 1].lat(), overview_path[counter + 1].lng()); | |
66 | - | |
67 | - <script src="https://gist.github.com/glebcha/e16abf1fa73d835e9422.js"></script> | |
68 | - | |
69 | - | |
70 | - if (difference < 0.09){ | |
71 | - setTimeout(function(){ | |
72 | - | |
73 | - }, 500) | |
74 | - } else { | |
75 | - setTimeout(function(){ | |
76 | - marker.setPosition(overview_path[counter]); | |
77 | - map.panTo(marker.getPosition()); | |
78 | - counter++; | |
79 | - }, 1000) | |
80 | - } | |
81 | 0 | \ No newline at end of file |