Release 2.8.0

Based on help from computers & friends, I'm sure both know better than I
do!

.github/workflows/docker.yml

@@ -49,8 +49,12 @@ jobs:
             --build-arg BUILD_DATE=$(date -u +'%Y-%m-%dT%H:%M:%SZ') \
             --build-arg VCS_REF=${GITHUB_SHA::8} \
             ${TAGS} --file ./docker/Dockerfile .
+      # https://github.com/docker/setup-qemu-action
+      - name: Set up QEMU
+        uses: docker/setup-qemu-action@v1
+      # https://github.com/docker/setup-buildx-action
       - name: Set up Docker Buildx
-        uses: crazy-max/ghaction-docker-buildx@v3
+        uses: docker/setup-buildx-action@v1
       - name: Docker Buildx (build)
         run: |
           docker buildx build --output "type=image,push=false" ${{ steps.prepare.outputs.buildx_args }}

CHANGELOG.md

@@ -2,6 +2,30 @@
 
 Dates are in UTC.
 
+## 2.8.0 (2021-02-19)
+
+- Add elevation gain / loss to "distance travelled" calculation ([#51](https://github.com/owntracks/frontend/issues/51))
+
+## 2.7.0 (2021-02-14)
+
+- Rename translation files from `xx` to `xx-XX` format to allow different language variants
+- Separate `en` translations into British English (`en-GB`) and American English (`en-US`, default)
+- Add French translations ([#49](https://github.com/owntracks/frontend/pull/49), [@Elu43](https://github.com/Elu43))
+- Update Docker image to use Node 14 and nginx 1.18
+- Upgrade dependencies
+
+## 2.6.0 (2020-12-29)
+
+- Add `router.basePath` config option for non-webroot deployments
+- Configure Vue to not assume it's on the web root ([#47](https://github.com/owntracks/frontend/pull/47), [@growse](https://github.com/growse))
+- Update Docker NGINX config to listen on IPv6 as well ([#46](https://github.com/owntracks/frontend/pull/46), [@growse](https://github.com/growse))
+- Upgrade dependencies
+
+## 2.5.1 (2020-10-27)
+
+- Fix incorrect handling of `api.baseUrl` with trailing slash ([#44](https://github.com/owntracks/frontend/pull/44), [@karmanyaahm](https://github.com/karmanyaahm))
+- Upgrade dependencies
+
 ## 2.5.0 (2020-09-07)
 
 - Add `filters.fitView` config option - this will prevent the map from re-fitting automatically by default when a live location changes ([#41](https://github.com/owntracks/frontend/issues/41))

README.md

@@ -142,7 +142,7 @@ unused i18n entries, run:
 $ yarn i18n:report
 ```
 
-To add a new locale, copy `en.json` to `<locale>.json` in [`src/locales`](src/locales)
+To add a new locale, copy `en-US.json` to `<locale>.json` in [`src/locales`](src/locales)
 and start translating the individual strings. Make sure to [mention the new locale to the docs](docs/config.md#locale)!
 
 For a specific example see commit [`b2edda4`](https://github.com/owntracks/frontend/commit/b2edda410f16633aa6fd9cd4e5250f2031536c7d)

docker/Dockerfile

@@ -1,12 +1,12 @@
-FROM node:10 as build
+FROM node:14 as build
 WORKDIR /usr/src/app
 COPY package.json yarn.lock ./
 RUN yarn install
 COPY . ./
 RUN yarn build
 
-FROM nginx:1.17-alpine
-LABEL version="2.5.0"
+FROM nginx:1.18-alpine
+LABEL version="2.8.0"
 LABEL description="OwnTracks UI"
 LABEL maintainer="Linus Groh <mail@linusgroh.de>"
 ENV LISTEN_PORT=80 \

docker/nginx.tmpl

@@ -8,6 +8,7 @@ http {
     }
     server {
         listen ${LISTEN_PORT};
+        listen [::]:${LISTEN_PORT};        
         root /usr/share/nginx/html;
         location /api {
             proxy_pass http://otrecorder/api/;

docs/config.md

@@ -63,6 +63,8 @@ window.owntracks.config = {};
   - [`fitView`](#onlocationchangefitview)
   - [`reloadHistory`](#onlocationchangereloadhistory)
 - [`primaryColor`](#primarycolor)
+- `router`
+  - [`basePath`](#routerbasepath)
 - [`selectedDevice`](#selecteddevice)
 - [`selectedUser`](#selecteduser)
 - [`showDistanceTravelled`](#showdistancetravelled)
@@ -169,14 +171,17 @@ formats.
 
 Available languages:
 
-- `de` (German)
-- `en` (English)
-- `es` (Spanish)
+- `de-DE` (Standard German)
+- `en-GB` (British English)
+- `en-US` (American English)
+- `es-ES` (Castilian Spanish)
+- `fr-FR` (Standard French)
 
-You can use formats like `en-GB`, `en-US`, `de-DE`.
+Using a locale with non-existent translations is possible and will affect date/time formats, but
+use `en-US` for translations.
 
 - Type: [`String`]
-- Default: `"en"`
+- Default: `"en-US"`
 
 ### `map.attribution`
 
@@ -435,6 +440,22 @@ Primary color for the user interface (navigation bar and various map elements).
   };
   ```
 
+### `router.basePath`
+
+Base path of the application deployment.
+
+- Type: [`String`]
+- Default: `"/"`
+- Example:
+  ```js
+  // Frontend will be reachable at https://example.com/owntracks
+  window.owntracks.config = {
+    router: {
+      basePath: "/owntracks",
+    },
+  };
+  ```
+
 ### `selectedDevice`
 
 Initial selected device. All devices will be shown by default if `null`. Will be ignored
@@ -478,6 +499,8 @@ header bar. `maxPointDistance` is being takein into account, if a distance betwe
 subsequent points is greater than `maxPointDistance`, it will not contibute to the
 calculated travelled distance.
 
+This also includes a calculation of elevation gain / loss.
+
 - Type: [`Boolean`]
 - Default: `true`
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "owntracks-ui",
-  "version": "2.5.0",
+  "version": "2.8.0",
   "author": {
     "name": "Linus Groh",
     "email": "mail@linusgroh.de"
@@ -17,43 +17,43 @@
     "test": "vue-cli-service test:unit"
   },
   "dependencies": {
-    "clipboard-copy": "^3.1.0",
-    "core-js": "^3.6.5",
+    "clipboard-copy": "^4.0.1",
+    "core-js": "^3.8.3",
     "deepmerge": "^4.2.2",
     "leaflet": "^1.7.1",
     "leaflet.heat": "^0.2.0",
-    "moment": "^2.27.0",
+    "moment": "^2.29.1",
     "vue": "^2.6.12",
     "vue-ctk-date-time-picker": "^2.5.0",
     "vue-feather-icons": "^5.1.0",
-    "vue-i18n": "^8.21.0",
+    "vue-i18n": "^8.22.4",
     "vue-js-modal": "^1.3.33",
     "vue-mq": "^1.0.1",
     "vue-outside-events": "^1.1.3",
-    "vue-router": "^3.4.3",
-    "vue2-leaflet": "^2.5.2",
-    "vuex": "^3.5.1"
+    "vue-router": "^3.5.1",
+    "vue2-leaflet": "^2.6.0",
+    "vuex": "^3.6.2"
   },
   "devDependencies": {
-    "@vue/cli-plugin-babel": "~4.5.4",
-    "@vue/cli-plugin-eslint": "~4.5.4",
-    "@vue/cli-plugin-unit-jest": "~4.5.4",
-    "@vue/cli-service": "~4.5.4",
+    "@vue/cli-plugin-babel": "~4.5.11",
+    "@vue/cli-plugin-eslint": "~4.5.11",
+    "@vue/cli-plugin-unit-jest": "~4.5.11",
+    "@vue/cli-service": "~4.5.11",
     "@vue/eslint-config-prettier": "^6.0.0",
-    "@vue/test-utils": "1.0.5",
+    "@vue/test-utils": "1.1.3",
     "babel-core": "7.0.0-bridge.0",
     "babel-eslint": "^10.1.0",
-    "babel-jest": "^26.3.0",
+    "babel-jest": "^26.6.3",
     "cors-anywhere": "^0.4.3",
-    "eslint": "^7.8.1",
-    "eslint-plugin-prettier": "^3.1.4",
-    "eslint-plugin-vue": "^6.2.2",
+    "eslint": "^7.20.0",
+    "eslint-plugin-prettier": "^3.3.1",
+    "eslint-plugin-vue": "^7.5.0",
     "jest-fetch-mock": "^3.0.3",
-    "lint-staged": "^10.3.0",
+    "lint-staged": "^10.5.4",
     "moment-locales-webpack-plugin": "^1.2.0",
-    "prettier": "^2.1.1",
-    "sass": "^1.26.10",
-    "sass-loader": "^10.0.2",
+    "prettier": "^2.2.1",
+    "sass": "^1.32.7",
+    "sass-loader": "^10.1.1",
     "vue-cli-plugin-i18n": "~1.0.1",
     "vue-template-compiler": "^2.6.12"
   },

src/components/AppHeader.vue

@@ -118,10 +118,19 @@
     <nav class="header-item header-item-right">
       <div
         v-if="$config.showDistanceTravelled && distanceTravelled"
-        class="nav-item"
-        :title="$t('Distance travelled')"
+        class="nav-item distance-travelled"
       >
-        {{ humanReadableDistance(distanceTravelled) }}
+        <span :title="$t('Distance travelled')">
+          {{ humanReadableDistance(distanceTravelled) }}
+        </span>
+        <br />
+        <span :title="$t('Elevation gain / loss')">
+          <ArrowUpIcon size="0.8x" role="img" />
+          {{ humanReadableDistance(elevationGain) }}
+          /
+          <ArrowDownIcon size="0.8x" role="img" />
+          {{ humanReadableDistance(elevationLoss) }}
+        </span>
       </div>
       <div class="nav-item">
         <button
@@ -153,6 +162,8 @@
 import moment from "moment";
 import { mapActions, mapGetters, mapMutations, mapState } from "vuex";
 import {
+  ArrowDownIcon,
+  ArrowUpIcon,
   CalendarIcon,
   CrosshairIcon,
   DownloadIcon,
@@ -172,6 +183,8 @@ import { humanReadableDistance } from "@/util";
 
 export default {
   components: {
+    ArrowDownIcon,
+    ArrowUpIcon,
     CalendarIcon,
     CrosshairIcon,
     DownloadIcon,
@@ -196,7 +209,14 @@ export default {
     };
   },
   computed: {
-    ...mapState(["users", "devices", "map", "distanceTravelled"]),
+    ...mapState([
+      "users",
+      "devices",
+      "map",
+      "distanceTravelled",
+      "elevationGain",
+      "elevationLoss",
+    ]),
     selectedUser: {
       get() {
         return this.$store.state.selectedUser;

src/components/modals/Information.vue

@@ -9,7 +9,7 @@
       <li>
         <GithubIcon size="1x" aria-hidden="true" role="img" />
         <a href="https://github.com/owntracks/recorder">owntracks/recorder</a>
-        ({{ recorderVersion || "Loading version..." }})
+        ({{ recorderVersion || $t("Loading version...") }})
       </li>
       <li>
         <GlobeIcon size="1x" aria-hidden="true" role="img" />

src/config.js

@@ -17,7 +17,7 @@ const DEFAULT_CONFIG = {
     minAccuracy: null,
   },
   ignorePingLocation: true,
-  locale: "en",
+  locale: "en-US",
   map: {
     attribution:
       '&copy; <a href="https://osm.org/copyright">OpenStreetMap</a> contributors',
@@ -71,6 +71,9 @@ const DEFAULT_CONFIG = {
     reloadHistory: false,
   },
   primaryColor: "#3f51b5",
+  router: {
+    basePath: "/",
+  },
   selectedDevice: null,
   selectedUser: null,
   showDistanceTravelled: true,

src/i18n.js

@@ -16,8 +16,8 @@ locales.keys().forEach((key) => {
 });
 
 export default new VueI18n({
-  locale: config.locale.split("-")[0],
-  fallbackLocale: "en",
+  locale: config.locale,
+  fallbackLocale: "en-US",
   formatFallbackMessages: true,
   messages,
 });

src/index.d.ts

@@ -2,8 +2,12 @@
 interface Config {
     api: {
         baseUrl: string;
+        fetchOptions: object;
     };
     endDateTime: Date;
+    filters: {
+      minAccuracy: number | null,
+    };
     ignorePingLocation: boolean;
     locale: string;
     map: {
@@ -54,11 +58,16 @@ interface Config {
         url: string;
     };
     onLocationChange: {
+        fitView: boolean;
         reloadHistory: boolean;
     };
     primaryColor: Color;
-    selectedUser: User| null;
-    selectedDevice: Device| null;
+    router: {
+      basePath: string;
+    };
+    selectedUser: User | null;
+    selectedDevice: Device | null;
+    showDistanceTravelled: boolean;
     startDateTime: Date;
     verbose: boolean;
 }
@@ -72,8 +81,8 @@ interface State {
     devices: { User: Device[] };
     lastLocations: OTLocation[];
     locationHistory: LocationHistory;
-    selectedUser: User| null;
-    selectedDevice: Device| null;
+    selectedUser: User | null;
+    selectedDevice: Device | null;
     startDateTime: string;
     endDateTime: string;
     map: {

src/locales/de-DE.json

@@ -11,6 +11,7 @@
   "Show all": "Alle anzeigen",
   "Select device": "Gerät auswählen",
   "Distance travelled": "Gereiste Entfernung",
+  "Elevation gain / loss": "Höhengewinn / -verlust",
   "Download raw data": "Rohdaten herunterladen",
   "Information": "Information",
   "Show last known locations": "Zeige letzte bekannte Standorte",
@@ -20,6 +21,7 @@
   "Minify JSON": "JSON minimieren",
   "Copy to clipboard": "In die Zwischenablage kopieren",
   "Download": "Herunterladen",
+  "Loading version...": "Version wird abgerufen...",
   "OwnTracks website": "OwnTracks Webseite",
   "OwnTracks documentation": "OwnTracks Dokumentation",
   "OwnTracks on Twitter": "OwnTracks auf Twitter",

src/locales/en-GB.json

@@ -0,0 +1,36 @@
+{
+  "Automatically center the map view and zoom in to relevant data": "Automatically centre the map view and zoom in to relevant data",
+  "Fit view": "Fit view",
+  "Layer settings": "Layer settings",
+  "Show/hide layers": "Show/hide layers",
+  "Now": "Now",
+  "Select start date": "Select start date",
+  "to": "to",
+  "Select end date": "Select end date",
+  "Select user": "Select user",
+  "Show all": "Show all",
+  "Select device": "Select device",
+  "Distance travelled": "Distance travelled",
+  "Elevation gain / loss": "Elevation gain / loss",
+  "Download raw data": "Download raw data",
+  "Information": "Information",
+  "Show last known locations": "Show last known locations",
+  "Show location history (line)": "Show location history (line)",
+  "Show location history (points)": "Show location history (points)",
+  "Show location heatmap": "Show location heatmap",
+  "Minify JSON": "Minify JSON",
+  "Copy to clipboard": "Copy to clipboard",
+  "Download": "Download",
+  "Loading version...": "Loading version...",
+  "OwnTracks website": "OwnTracks website",
+  "OwnTracks documentation": "OwnTracks documentation",
+  "OwnTracks on Twitter": "OwnTracks on Twitter",
+  "Loading data, please wait...": "Loading data, please wait...",
+  "Image of {deviceName}": "Image of {deviceName}",
+  "Timestamp": "Timestamp",
+  "Location": "Location",
+  "Address": "Address",
+  "Battery": "Battery",
+  "Speed": "Speed",
+  "Regions:": "Regions:"
+}

src/locales/en-US.json

@@ -10,7 +10,8 @@
   "Select user": "Select user",
   "Show all": "Show all",
   "Select device": "Select device",
-  "Distance travelled": "Distance travelled",
+  "Distance travelled": "Distance traveled",
+  "Elevation gain / loss": "Elevation gain / loss",
   "Download raw data": "Download raw data",
   "Information": "Information",
   "Show last known locations": "Show last known locations",
@@ -20,6 +21,7 @@
   "Minify JSON": "Minify JSON",
   "Copy to clipboard": "Copy to clipboard",
   "Download": "Download",
+  "Loading version...": "Loading version...",
   "OwnTracks website": "OwnTracks website",
   "OwnTracks documentation": "OwnTracks documentation",
   "OwnTracks on Twitter": "OwnTracks on Twitter",

src/locales/es-ES.json

@@ -11,6 +11,7 @@
   "Show all": "Mostrar todos",
   "Select device": "Seleccionar dispositivo",
   "Distance travelled": "Distancia recorrida",
+  "Elevation gain / loss": "Aumento / disminución de la altura",
   "Download raw data": "Descargar datos en crudo",
   "Information": "Información",
   "Show last known locations": "Mostrar última ubicación conocida",
@@ -20,6 +21,7 @@
   "Minify JSON": "Reducir JSON",
   "Copy to clipboard": "Copiar al portapapeles",
   "Download": "Descarga",
+  "Loading version...": "Cargando versión...",
   "OwnTracks website": "OwnTracks - Sitio web",
   "OwnTracks documentation": "OwnTracks - documentación",
   "OwnTracks on Twitter": "OwnTracks en Twitter",

src/locales/fr-FR.json

@@ -0,0 +1,36 @@
+{
+  "Automatically center the map view and zoom in to relevant data": "Centrer automatiquement la vue de la carte et zoomer sur les données pertinentes",
+  "Fit view": "Vue d'ensemble",
+  "Layer settings": "Paramètres des couches",
+  "Show/hide layers": "Montrer/cacher certaines couches",
+  "Now": "Maintenant",
+  "Select start date": "Sélectionner une date de début",
+  "to": "à",
+  "Select end date": "Sélectionner une date de fin",
+  "Select user": "Sélectionner un utilisateur",
+  "Show all": "Tout afficher",
+  "Select device": "Sélectionner un appareil",
+  "Distance travelled": "Distance parcourue",
+  "Elevation gain / loss": "Augmentation / diminution de l'altitude",
+  "Download raw data": "Télécharger les données brutes",
+  "Information": "Informations",
+  "Show last known locations": "Afficher les dernières localisations connues",
+  "Show location history (line)": "Afficher l'historique de localisation (lignes)",
+  "Show location history (points)": "Afficher l'historique de localisation (points)",
+  "Show location heatmap": "Afficher la carte de fréquentation",
+  "Minify JSON": "Minifier JSON",
+  "Copy to clipboard": "Copier dans le presse-papier",
+  "Download": "Télécharger",
+  "Loading version...": "Chargement de la version...",
+  "OwnTracks website": "Site d'OwnTracks",
+  "OwnTracks documentation": "Documentation d'OwnTracks",
+  "OwnTracks on Twitter": "OwnTracks sur Twitter",
+  "Loading data, please wait...": "Chargement des données, merci de patienter ...",
+  "Image of {deviceName}": "Image de {deviceName}",
+  "Timestamp": "Horodatage",
+  "Location": "Localisation",
+  "Address": "Addresse",
+  "Battery": "Batterie",
+  "Speed": "Vitesse",
+  "Regions:": "Régions:"
+}

src/router.js

@@ -1,12 +1,13 @@
 import Vue from "vue";
 import Router from "vue-router";
-import Map from "./views/Map.vue";
+import config from "@/config";
+import Map from "@/views/Map.vue";
 
 Vue.use(Router);
 
 export default new Router({
   mode: "history",
-  base: process.env.BASE_URL,
+  base: config.router.basePath,
   routes: [
     {
       path: "/",

src/store/actions.js

@@ -122,9 +122,11 @@ const getLastLocations = async ({ commit, state }) => {
   commit(types.SET_LAST_LOCATIONS, lastLocations);
 };
 
-const _getDistanceTravelled = (locationHistory) => {
+const _getTravelStats = (locationHistory) => {
   const start = Date.now();
   let distanceTravelled = 0;
+  let elevationGain = 0;
+  let elevationLoss = 0;
   Object.keys(locationHistory).forEach((user) => {
     Object.keys(locationHistory[user]).forEach((device) => {
       let lastLatLng = null;
@@ -134,20 +136,21 @@ const _getDistanceTravelled = (locationHistory) => {
           location.acc > config.filters.minAccuracy
         )
           return;
-        const latLng = L.latLng(location.lat, location.lon);
+        const latLng = L.latLng(location.lat, location.lon, location.alt ?? 0);
         if (lastLatLng !== null) {
           const distance = distanceBetweenCoordinates(lastLatLng, latLng);
+          const elevationChange = latLng.alt - lastLatLng.alt;
           if (
             typeof config.map.maxPointDistance === "number" &&
             config.map.maxPointDistance > 0
+              ? // If part of the current group, add to total
+                distance <= config.map.maxPointDistance
+              : // If grouping is disabled, always add to total
+                true
           ) {
-            if (distance <= config.map.maxPointDistance) {
-              // Part of the current group, add calculated distance to total
-              distanceTravelled += distance;
-            }
-          } else {
-            // If grouping is disabled always add calculated distance to total
             distanceTravelled += distance;
+            if (elevationChange >= 0) elevationGain += elevationChange;
+            else elevationLoss += -elevationChange;
           }
         }
         lastLatLng = latLng;
@@ -155,15 +158,15 @@ const _getDistanceTravelled = (locationHistory) => {
     });
   });
   const end = Date.now();
-  log("DISTANCE", () => {
+  log("PERFORMANCE", () => {
     const locationHistoryCount = getLocationHistoryCount(locationHistory);
     const duration = (end - start) / 1000;
     return (
-      `[_getDistanceTravelled] Took ${duration} seconds to ` +
-      `calculate distance of ${locationHistoryCount} locations`
+      `[_getTravelStats] Took ${duration} seconds to calculate distance ` +
+      `and elevation gain/loss of ${locationHistoryCount} locations`
     );
   });
-  return distanceTravelled;
+  return { distanceTravelled, elevationGain, elevationLoss };
 };
 
 /**
@@ -189,10 +192,12 @@ const getLocationHistory = async ({ commit, state }) => {
   commit(types.SET_IS_LOADING, false);
   commit(types.SET_LOCATION_HISTORY, locationHistory);
   if (config.showDistanceTravelled) {
-    commit(
-      types.SET_DISTANCE_TRAVELLED,
-      _getDistanceTravelled(locationHistory)
+    const { distanceTravelled, elevationGain, elevationLoss } = _getTravelStats(
+      locationHistory
     );
+    commit(types.SET_DISTANCE_TRAVELLED, distanceTravelled);
+    commit(types.SET_ELEVATION_GAIN, elevationGain);
+    commit(types.SET_ELEVATION_LOSS, elevationLoss);
   }
 };
 

src/store/index.js

@@ -30,7 +30,9 @@ export default new Vuex.Store({
       zoom: 19,
       layers: config.map.layers,
     },
-    distanceTravelled: null,
+    distanceTravelled: 0,
+    elevationGain: 0,
+    elevationLoss: 0,
   },
   getters,
   mutations,

src/store/mutation-types.js

@@ -12,3 +12,5 @@ export const SET_MAP_CENTER = "SET_MAP_CENTER";
 export const SET_MAP_ZOOM = "SET_MAP_ZOOM";
 export const SET_MAP_LAYER_VISIBILITY = "SET_MAP_LAYER_VISIBILITY";
 export const SET_DISTANCE_TRAVELLED = "SET_DISTANCE_TRAVELLED";
+export const SET_ELEVATION_GAIN = "SET_ELEVATION_GAIN";
+export const SET_ELEVATION_LOSS = "SET_ELEVATION_LOSS";

src/store/mutations.js

@@ -43,4 +43,10 @@ export default {
   [types.SET_DISTANCE_TRAVELLED](state, distanceTravelled) {
     state.distanceTravelled = distanceTravelled;
   },
+  [types.SET_ELEVATION_GAIN](state, elevationGain) {
+    state.elevationGain = elevationGain;
+  },
+  [types.SET_ELEVATION_LOSS](state, elevationLoss) {
+    state.elevationLoss = elevationLoss;
+  },
 };

src/styles/_base.scss

@@ -151,6 +151,16 @@ pre {
         .button-icon .feather {
           margin: 0;
         }
+
+        &.distance-travelled {
+          text-align: right;
+          line-height: 1.2;
+
+          .feather {
+            margin-top: 3px;
+            margin-right: 0;
+          }
+        }
       }
 
       &.nav-sm {

src/util.js

@@ -12,7 +12,7 @@ import { DATE_TIME_FORMAT, EARTH_RADIUS_IN_KM } from "@/constants";
  */
 export const getApiUrl = (path) => {
   const normalizedBaseUrl = config.api.baseUrl.endsWith("/")
-    ? config.api.baseUrl.slice(1)
+    ? config.api.baseUrl.slice(0, -1)
     : config.api.baseUrl;
   const normalizedPath = path.startsWith("/") ? path : `/${path}`;
   return new URL(`${normalizedBaseUrl}${normalizedPath}`);

tests/util.test.js

@@ -22,6 +22,13 @@ describe("getApiUrl", () => {
     expect(getApiUrl("/foo/bar").href).toBe(
       "http://example.com/owntracks/foo/bar"
     );
+
+    config.api.baseUrl = "http://example.com/owntracks/";
+    expect(getApiUrl("foo").href).toBe("http://example.com/owntracks/foo");
+    expect(getApiUrl("/foo").href).toBe("http://example.com/owntracks/foo");
+    expect(getApiUrl("/foo/bar").href).toBe(
+      "http://example.com/owntracks/foo/bar"
+    );
   });
 });
 

vue.config.js

@@ -6,6 +6,7 @@ const packageJson = fs.readFileSync("./package.json");
 const version = JSON.parse(packageJson).version;
 
 module.exports = {
+  publicPath: "",
   configureWebpack: {
     plugins: [
       new webpack.DefinePlugin({