Let user download GPX trace from menu

package.json

@@ -15,6 +15,8 @@
     },
     "dependencies": {
         "es6-promise": "^4.2.4",
+        "file-saver": "^1.3.8",
+        "gps-to-gpx": "^1.3.0",
         "howler": "^2.0.14",
         "isomorphic-fetch": "^2.2.1",
         "leaflet": "^1.3.1",

src/App.vue

@@ -29,6 +29,9 @@
                     <v-icon>more_vert</v-icon>
                 </v-btn>
                 <v-list>
+                    <v-list-tile @click="exportGPX" v-if="isExportGPXMenuEntryVisible">
+                        <v-list-tile-title>{{ $t("menu.exportGPX") }}</v-list-tile-title>
+                    </v-list-tile>
                     <v-list-tile @click="isShareMapViewModalShown = true" v-if="isShareMapViewMenuEntryVisible">
                         <v-list-tile-title>{{ $t("menu.shareMapView") }}</v-list-tile-title>
                     </v-list-tile>
@@ -56,7 +59,11 @@
 </template>
 
 <script>
-import { DELAY_BETWEEN_API_BATCH_REQUESTS } from '@/constants';
+import FileSaver from 'file-saver';
+import createGPX from 'gps-to-gpx';
+import moment from 'moment';
+
+import { DELAY_BETWEEN_API_BATCH_REQUESTS, VERSION } from '@/constants';
 
 import ReportErrorModal from '@/components/ReportErrorModal.vue';
 import ShareMapViewModal from '@/components/ShareMapViewModal.vue';
@@ -70,6 +77,9 @@ export default {
         isLoading() {
             return this.$store.state.isLoading;
         },
+        isExportGPXMenuEntryVisible() {
+            return this.$store.state.location.gpx.length > 0;
+        },
         isShareMapViewMenuEntryVisible() {
             return this.$store.state.map.center.every(item => item !== null);
         },
@@ -86,6 +96,25 @@ export default {
         };
     },
     methods: {
+        exportGPX() {
+            const activityName = this.$t('misc.activityName');
+            const waypoints = this.$store.state.location.gpx.map(
+                item => Object.assign({}, item, { timestamp: new Date(item.timestamp) }),
+            );
+            const gpx = createGPX(waypoints, {
+                activityName,
+                creator: `Cycl'Assist v${VERSION}`,
+                eleKey: 'elevation',
+                latKey: 'latitude',
+                lonKey: 'longitude',
+                startTime: waypoints[0].timestamp,
+                timeKey: 'timestamp',
+            });
+            FileSaver.saveAs(
+                new Blob([gpx], { type: 'application/gpx+xml;charset=utf-8' }),
+                `cyclassist_${moment().locale('en').format('YYYY-MM-DD_HH-mm_ddd')}.gpx`,
+            );
+        },
         goToAbout() {
             this.$router.push({ name: 'About' });
         },

src/i18n/en.json

@@ -47,10 +47,12 @@
     },
     "menu": {
         "About": "Help",
+        "exportGPX": "Export GPX",
         "Settings": "Settings",
         "shareMapView": "Share map view"
     },
     "misc": {
+        "activityName": "Biking",
         "discard": "Discard",
         "ok": "OK",
         "or": "or",

yarn.lock

@@ -860,6 +860,13 @@ babel-register@^6.26.0:
     mkdirp "^0.5.1"
     source-map-support "^0.4.15"
 
+babel-runtime@6.18.0:
+  version "6.18.0"
+  resolved "https://registry.yarnpkg.com/babel-runtime/-/babel-runtime-6.18.0.tgz#0f4177ffd98492ef13b9f823e9994a02584c9078"
+  dependencies:
+    core-js "^2.4.0"
+    regenerator-runtime "^0.9.5"
+
 babel-runtime@^6.18.0, babel-runtime@^6.22.0, babel-runtime@^6.26.0:
   version "6.26.0"
   resolved "https://registry.yarnpkg.com/babel-runtime/-/babel-runtime-6.26.0.tgz#965c7058668e82b55d7bfe04ff2337bc8b5647fe"
@@ -3143,6 +3150,10 @@ file-loader@^1.1.4:
     loader-utils "^1.0.2"
     schema-utils "^0.4.5"
 
+file-saver@^1.3.8:
+  version "1.3.8"
+  resolved "https://registry.yarnpkg.com/file-saver/-/file-saver-1.3.8.tgz#e68a30c7cb044e2fb362b428469feb291c2e09d8"
+
 file-type@5.2.0, file-type@^5.2.0:
   version "5.2.0"
   resolved "https://registry.yarnpkg.com/file-type/-/file-type-5.2.0.tgz#2ddbea7c73ffe36368dfae49dc338c058c2b8ad6"
@@ -3626,6 +3637,14 @@ got@^7.0.0:
     url-parse-lax "^1.0.0"
     url-to-options "^1.0.1"
 
+gps-to-gpx@^1.3.0:
+  version "1.3.0"
+  resolved "https://registry.yarnpkg.com/gps-to-gpx/-/gps-to-gpx-1.3.0.tgz#6b422a15073c6aced31e45c77712d6727822d39d"
+  dependencies:
+    babel-runtime "6.18.0"
+    loose-envify "1.3.0"
+    xmlbuilder "8.2.2"
+
 graceful-fs@^4.0.0, graceful-fs@^4.1.10, graceful-fs@^4.1.11, graceful-fs@^4.1.2, graceful-fs@^4.1.6, graceful-fs@^4.1.9:
   version "4.1.11"
   resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.1.11.tgz#0e8bdfe4d1ddb8854d64e04ea7c00e2a026e5658"
@@ -4602,6 +4621,10 @@ js-base64@^2.1.9:
   version "2.4.5"
   resolved "https://registry.yarnpkg.com/js-base64/-/js-base64-2.4.5.tgz#e293cd3c7c82f070d700fc7a1ca0a2e69f101f92"
 
+js-tokens@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-2.0.0.tgz#79903f5563ee778cc1162e6dcf1a0027c97f9cb5"
+
 js-tokens@^3.0.0, js-tokens@^3.0.2:
   version "3.0.2"
   resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-3.0.2.tgz#9866df395102130e38f7f996bceb65443209c25b"
@@ -4997,6 +5020,12 @@ longest@^1.0.0, longest@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/longest/-/longest-1.0.1.tgz#30a0b2da38f73770e8294a0d22e6625ed77d0097"
 
+loose-envify@1.3.0:
+  version "1.3.0"
+  resolved "https://registry.yarnpkg.com/loose-envify/-/loose-envify-1.3.0.tgz#6b26248c42f6d4fa4b0d8542f78edfcde35642a8"
+  dependencies:
+    js-tokens "^2.0.0"
+
 loose-envify@^1.0.0:
   version "1.3.1"
   resolved "https://registry.yarnpkg.com/loose-envify/-/loose-envify-1.3.1.tgz#d1a8ad33fa9ce0e713d65fdd0ac8b748d478c848"
@@ -6630,6 +6659,10 @@ regenerator-runtime@^0.11.0, regenerator-runtime@^0.11.1:
   version "0.11.1"
   resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.11.1.tgz#be05ad7f9bf7d22e056f9726cee5017fbf19e2e9"
 
+regenerator-runtime@^0.9.5:
+  version "0.9.6"
+  resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.9.6.tgz#d33eb95d0d2001a4be39659707c51b0cb71ce029"
+
 regenerator-transform@^0.10.0:
   version "0.10.1"
   resolved "https://registry.yarnpkg.com/regenerator-transform/-/regenerator-transform-0.10.1.tgz#1e4996837231da8b7f3cf4114d71b5691a0680dd"
@@ -8382,6 +8415,10 @@ xml2js@^0.4.5:
     sax ">=0.6.0"
     xmlbuilder "~9.0.1"
 
+xmlbuilder@8.2.2:
+  version "8.2.2"
+  resolved "https://registry.yarnpkg.com/xmlbuilder/-/xmlbuilder-8.2.2.tgz#69248673410b4ba42e1a6136551d2922335aa773"
+
 xmlbuilder@~9.0.1:
   version "9.0.7"
   resolved "https://registry.yarnpkg.com/xmlbuilder/-/xmlbuilder-9.0.7.tgz#132ee63d2ec5565c557e20f4c22df9aca686b10d"