adding route change emit

VueApp/src/components/ElevationGraph.vue

@@ -14,6 +14,7 @@
         components: { GChart },
         data () {
           return {
+            currentRoute: null,
             elevationService: null,
             chartData: [],
             chartOptions: {
@@ -24,11 +25,11 @@
           }
         },
         methods: {
-          getPathElevation (path) {
+          getPathElevation (currentRoute) {
             this.chartData = []
             this.elevationService = new google.maps.ElevationService() // eslint-disable-line no-undef
             this.elevationService.getElevationAlongPath({
-              'path': path,
+              'path': currentRoute,
               'samples': 256
             }, function (elevations, status) {
                if (status === 'OK') {

VueApp/src/components/GoogleMap.vue

@@ -16,6 +16,7 @@
         <button @click="gotoPlace(currentPlace)">scroll to location</button>
         <button @click="removeMarkers">clear route</button>
         <button @click="locateUser">geolocate</button>
+        <button @click="emitRoute">calculate elevation</button>
       </label>
       <br/>
     </div>
@@ -40,7 +41,8 @@
         markers: [],
         currentPlace: null,
         directionsService: null,
-        directionsDisplay: null
+        directionsDisplay: null,
+        currentRoute: null
       }
     },
     methods: {
@@ -92,6 +94,7 @@
         }, function (response, status) {
           if (status === 'OK') {
             vm.directionsDisplay.setDirections(response)
+            this.currentRoute = response
           } else {
             alert('Directions request failed due to ' + status)
           }
@@ -99,6 +102,9 @@
       },
       clearRoute () {
         if (this.directionsDisplay) this.directionsDisplay.setMap(null)
+      },
+      emitRoute () {
+        if (this.currentRoute) this.$emit('currentRoute', this.currentRoute)
       }
     }
   }