github/frontend
1
0
Fork 0
mirror of https://github.com/owntracks/frontend.git synced 2026-02-13 20:59:50 +00:00
Code Issues Packages Projects Releases Wiki Activity

Upgrade dependencies

Browse Source 
This includes a major version bump of ESLint and Prettier, so also some
reformatting.
This commit is contained in:
Linus Groh
2020-05-16 13:58:48 +01:00
parent 906eb2a1b4
commit c8b0ec8b9e
13 changed files with 88 additions and 76 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
docs/config.md
View File

@@ -79,16 +79,16 @@ Base URL for the recorder's HTTP and WebSocket API. Keep CORS in mind.
// API requests will be made to https://owntracks.example.com/api/0/...
window.owntracks.config = {
api: {
baseUrl: "https://owntracks.example.com"
}
baseUrl: "https://owntracks.example.com",
},
};
```
```js
// API requests will be made to https://example.com/owntracks/api/0/...
window.owntracks.config = {
api: {
baseUrl: "https://example.com/owntracks/"
}
baseUrl: "https://example.com/owntracks/",
},
};
```
@@ -106,9 +106,9 @@ You can use this for example to send custom HTTP headers or to include cookies i
window.owntracks.config = {
api: {
fetchOptions: {
credentials: "include"
}
}
credentials: "include",
},
},
};
```
@@ -122,7 +122,7 @@ Initial end date and time (browser timezone) for fetched data.
```js
// Data will be fetched up to 1970-01-01
window.owntracks.config = {
endDateTime: new Date(1970, 1, 1)
endDateTime: new Date(1970, 1, 1),
};
```
@@ -141,8 +141,8 @@ distance calculation.
// Don't include location points with an accuracy exceeding 100 meters
window.owntracks.config = {
filters: {
minAccuracy: 100
}
minAccuracy: 100,
},
};
```
@@ -157,7 +157,7 @@ Remove the `ping/ping` location from the fetched data. This is useful when using
```js
// Don't ignore ping/ping location. Not sure why you'd do this :)
window.owntracks.config = {
ignorePingLocation: false
ignorePingLocation: false,
};
```
@@ -188,8 +188,8 @@ Attribution for map tiles.
// Make sure to add proper attribution!
window.owntracks.config = {
map: {
attribution: "Map tiles © MyTileServerProvider"
}
attribution: "Map tiles © MyTileServerProvider",
},
};
```
@@ -356,8 +356,8 @@ splitting into separate lines.
// Don't connect points with a distance of more than 1km
window.owntracks.config = {
map: {
maxPointDistance: 1000
}
maxPointDistance: 1000,
},
};
```
@@ -398,8 +398,8 @@ and [this Wikipedia article](https://en.wikipedia.org/wiki/Tiled_web_map).
window.owntracks.config = {
map: {
url:
"https://api.mapbox.com/v4/mapbox.dark/{z}/{x}/{y}@2x.png?access_token=xxxxxxxxxxxxxxxx"
}
"https://api.mapbox.com/v4/mapbox.dark/{z}/{x}/{y}@2x.png?access_token=xxxxxxxxxxxxxxxx",
},
};
```
@@ -421,7 +421,7 @@ Primary color for the user interface (navigation bar and various map elements).
```js
// Set the UI's primary color to 'rebeccapurple'
window.owntracks.config = {
primaryColor: "rebeccapurple"
primaryColor: "rebeccapurple",
};
```
@@ -440,7 +440,7 @@ amount of data fetched after page load.
// Select the device 'phone' from user 'foo' by default
window.owntracks.config = {
selectedUser: "foo",
selectedDevice: "phone"
selectedDevice: "phone",
};
```
@@ -457,7 +457,7 @@ amount of data fetched after page load.
```js
// Select all devices from user 'foo' by default
window.owntracks.config = {
selectedUser: "foo"
selectedUser: "foo",
};
```
@@ -484,7 +484,7 @@ Initial start date and time (browser timezone) for fetched data.
startDateTime.setHours(0, 0, 0, 0);
startDateTime.setDate(1);
window.owntracks.config = {
startDateTime
startDateTime,
};
```

5
package.json
View File

@@ -26,13 +26,13 @@
"vue": "^2.6.11",
"vue-ctk-date-time-picker": "^2.4.0",
"vue-feather-icons": "^5.0.0",
"vue-i18n": "^8.17.4",
"vue-i18n": "^8.17.6",
"vue-js-modal": "^1.3.33",
"vue-mq": "^1.0.1",
"vue-outside-events": "^1.1.3",
"vue-router": "^3.1.6",
"vue2-leaflet": "^2.5.2",
"vuex": "^3.3.0"
"vuex": "^3.4.0"
},
"devDependencies": {
"@vue/cli-plugin-babel": "~4.3.1",
@@ -52,6 +52,7 @@
"lint-staged": "^10.2.2",
"moment-locales-webpack-plugin": "^1.2.0",
"node-sass": "^4.14.1",
"prettier": "^2.0.5",
"sass-loader": "^8.0.2",
"vue-cli-plugin-i18n": "~1.0.1",
"vue-template-compiler": "^2.6.11"

4
src/App.vue
View File

@@ -34,7 +34,7 @@ export default {
this.populateStateFromQuery(this.$route.query);
this.loadData();
// Update URL query params when relevant values changes
this.$store.subscribe(mutation => {
this.$store.subscribe((mutation) => {
if (
[
types.SET_SELECTED_USER,
@@ -73,7 +73,7 @@ export default {
selectedDevice: device,
} = this.$store.state;
const activeLayers = Object.keys(map.layers).filter(
key => map.layers[key] === true
(key) => map.layers[key] === true
);
const query = {
lat: map.center.lat,

27
src/api.js
View File

@@ -11,9 +11,11 @@ import { getApiUrl, getLocationHistoryCount } from "@/util";
*/
const fetchApi = (path, params = {}) => {
const url = getApiUrl(path);
Object.keys(params).forEach(key => url.searchParams.append(key, params[key]));
Object.keys(params).forEach((key) =>
url.searchParams.append(key, params[key])
);
log("HTTP", `GET ${url.href}`);
return fetch(url.href, config.api.fetchOptions).catch(error =>
return fetch(url.href, config.api.fetchOptions).catch((error) =>
log("HTTP", error, logLevels.ERROR)
);
};
@@ -51,10 +53,10 @@ export const getUsers = async () => {
* @returns {{User: Device[]}}
* Object mapping each username to an array of device names
*/
export const getDevices = async users => {
export const getDevices = async (users) => {
const devices = {};
await Promise.all(
users.map(async user => {
users.map(async (user) => {
const response = await fetchApi(`/api/0/list`, { user });
const json = await response.json();
const userDevices = json.results;
@@ -63,7 +65,7 @@ export const getDevices = async users => {
);
log("API", () => {
const devicesCount = Object.keys(devices)
.map(user => devices[user].length)
.map((user) => devices[user].length)
.reduce((a, b) => a + b, 0);
return (
`[getDevices] Fetched ${devicesCount} ` +
@@ -144,10 +146,10 @@ export const getUserDeviceLocationHistory = async (
export const getLocationHistory = async (devices, start, end) => {
const locationHistory = {};
await Promise.all(
Object.keys(devices).map(async user => {
Object.keys(devices).map(async (user) => {
locationHistory[user] = {};
await Promise.all(
devices[user].map(async device => {
devices[user].map(async (device) => {
locationHistory[user][device] = await getUserDeviceLocationHistory(
user,
device,
@@ -174,7 +176,7 @@ export const getLocationHistory = async (devices, start, end) => {
*
* @param {WebSocketLocationCallback} [callback] Callback for location messages
*/
export const connectWebsocket = async callback => {
export const connectWebsocket = async (callback) => {
let url = getApiUrl("/ws/last");
url.protocol = url.protocol.replace("http", "ws");
url = url.href;
@@ -184,16 +186,17 @@ export const connectWebsocket = async callback => {
log("WS", "Connected");
ws.send("LAST");
};
ws.onclose = event => {
ws.onclose = (event) => {
log(
"WS",
`Disconnected unexpectedly (reason: ${event.reason ||
"unknown"}). Reconnecting in one second.`,
`Disconnected unexpectedly (reason: ${
event.reason || "unknown"
}). Reconnecting in one second.`,
logLevels.WARNING
);
setTimeout(connectWebsocket, 1000);
};
ws.onmessage = async msg => {
ws.onmessage = async (msg) => {
if (msg.data) {
try {
const data = JSON.parse(msg.data);

4
src/components/AppHeader.vue
View File

@@ -222,9 +222,7 @@ export default {
},
set(value) {
this.setStartDateTime(
moment(value, DATE_TIME_FORMAT)
.utc()
.format(DATE_TIME_FORMAT)
moment(value, DATE_TIME_FORMAT).utc().format(DATE_TIME_FORMAT)
);
},
},

2
src/components/LHeatmap.vue
View File

@@ -94,7 +94,7 @@ export default {
this.parentContainer.addLayer(this, !this.visible);
this.$watch(
"latLng",
newVal => {
(newVal) => {
this.mapObject.setLatLngs(newVal);
},
{ deep: true }

2
src/i18n.js
View File

@@ -7,7 +7,7 @@ Vue.use(VueI18n);
const locales = require.context("./locales", true, /[A-Za-z0-9-_,\s]+\.json$/i);
const messages = {};
locales.keys().forEach(key => {
locales.keys().forEach((key) => {
const matched = key.match(/([A-Za-z0-9-_]+)\./i);
if (matched && matched.length > 1) {
const locale = matched[1];

2
src/main.js
View File

@@ -29,5 +29,5 @@ new Vue({
i18n,
router,
store,
render: h => h(App),
render: (h) => h(App),
}).$mount("#app");

12
src/store/actions.js
View File

@@ -43,7 +43,7 @@ const populateStateFromQuery = ({ state, commit }, query) => {
}
if (query.layers) {
const activeLayers = query.layers.split(",");
Object.keys(state.map.layers).forEach(layer => {
Object.keys(state.map.layers).forEach((layer) => {
const visibility = activeLayers.includes(layer);
if (state.map.layers[layer] !== visibility) {
commit(types.SET_MAP_LAYER_VISIBILITY, { layer, visibility });
@@ -116,19 +116,19 @@ const getLastLocations = async ({ commit, state }) => {
// Remove ping/ping from the owntracks/recorder Docker image
// https://github.com/owntracks/frontend/issues/12
lastLocations = lastLocations.filter(
l => !(l.username === "ping" && l.device === "ping")
(l) => !(l.username === "ping" && l.device === "ping")
);
}
commit(types.SET_LAST_LOCATIONS, lastLocations);
};
const _getDistanceTravelled = locationHistory => {
const _getDistanceTravelled = (locationHistory) => {
const start = Date.now();
let distanceTravelled = 0;
Object.keys(locationHistory).forEach(user => {
Object.keys(locationHistory[user]).forEach(device => {
Object.keys(locationHistory).forEach((user) => {
Object.keys(locationHistory[user]).forEach((device) => {
let lastLatLng = null;
locationHistory[user][device].forEach(location => {
locationHistory[user][device].forEach((location) => {
if (
config.filters.minAccuracy !== null &&
location.acc > config.filters.minAccuracy

24
src/store/getters.js
View File

@@ -11,13 +11,13 @@ import { distanceBetweenCoordinates } from "@/util";
* Location history of selected users and devices
* @returns {LocationHistory} Filtered location history
*/
const filteredLocationHistory = state => {
const filteredLocationHistory = (state) => {
const locationHistory = {};
Object.keys(state.locationHistory).forEach(user => {
Object.keys(state.locationHistory).forEach((user) => {
locationHistory[user] = {};
Object.keys(state.locationHistory[user]).forEach(device => {
Object.keys(state.locationHistory[user]).forEach((device) => {
locationHistory[user][device] = [];
state.locationHistory[user][device].forEach(location => {
state.locationHistory[user][device].forEach((location) => {
if (
config.filters.minAccuracy !== null &&
location.acc > config.filters.minAccuracy
@@ -37,12 +37,12 @@ const filteredLocationHistory = state => {
* @param {State} state
* @returns {L.LatLng[]} All coordinates
*/
const filteredLocationHistoryLatLngs = state => {
const filteredLocationHistoryLatLngs = (state) => {
const latLngs = [];
const locationHistory = filteredLocationHistory(state);
Object.keys(locationHistory).forEach(user => {
Object.keys(locationHistory[user]).forEach(device => {
locationHistory[user][device].forEach(location => {
Object.keys(locationHistory).forEach((user) => {
Object.keys(locationHistory[user]).forEach((device) => {
locationHistory[user][device].forEach((location) => {
latLngs.push(L.latLng(location.lat, location.lon));
});
});
@@ -58,13 +58,13 @@ const filteredLocationHistoryLatLngs = state => {
* @param {State} state
* @returns {L.LatLng[][]} Groups of coherent coordinates
*/
const filteredLocationHistoryLatLngGroups = state => {
const filteredLocationHistoryLatLngGroups = (state) => {
const groups = [];
const locationHistory = filteredLocationHistory(state);
Object.keys(locationHistory).forEach(user => {
Object.keys(locationHistory[user]).forEach(device => {
Object.keys(locationHistory).forEach((user) => {
Object.keys(locationHistory[user]).forEach((device) => {
let latLngs = [];
locationHistory[user][device].forEach(location => {
locationHistory[user][device].forEach((location) => {
const latLng = L.latLng(location.lat, location.lon);
// Skip if group splitting is disabled or this is the first
// coordinate in the current group

14
src/util.js
View File

@@ -10,7 +10,7 @@ import { DATE_TIME_FORMAT, EARTH_RADIUS_IN_KM } from "@/constants";
* @param {String} path Path to the API resource
* @returns {URL} Final API URL
*/
export const getApiUrl = path => {
export const getApiUrl = (path) => {
const normalizedBaseUrl = config.api.baseUrl.endsWith("/")
? config.api.baseUrl.slice(1)
: config.api.baseUrl;
@@ -24,7 +24,7 @@ export const getApiUrl = path => {
* @param {String} s Input value to be tested
* @returns {Boolean} Whether the input matches the expected format
*/
export const isIsoDateTime = s => moment(s, DATE_TIME_FORMAT, true).isValid();
export const isIsoDateTime = (s) => moment(s, DATE_TIME_FORMAT, true).isValid();
/**
* Convert degrees to radians.
@@ -32,7 +32,7 @@ export const isIsoDateTime = s => moment(s, DATE_TIME_FORMAT, true).isValid();
* @param {Number} degrees Angle in degrees
* @returns {Number} Angle in radians
*/
export const degreesToRadians = degrees => (degrees * Math.PI) / 180;
export const degreesToRadians = (degrees) => (degrees * Math.PI) / 180;
/**
* Calculate the distance between two coordinates. Uses the haversine formula,
@@ -91,7 +91,7 @@ export const download = (text, filename, mimeType = "text/plain") => {
* @param {Number} distance Distance in meters
* @returns {String} Formatted string including unit
*/
export const humanReadableDistance = distance => {
export const humanReadableDistance = (distance) => {
let unit = "m";
if (Math.abs(distance) >= 1000) {
distance = distance / 1000;
@@ -108,11 +108,11 @@ export const humanReadableDistance = distance => {
* @param {LocationHistory} locationHistory Location history
* @returns {Number} Total number of locations
*/
export const getLocationHistoryCount = locationHistory =>
export const getLocationHistoryCount = (locationHistory) =>
Object.keys(locationHistory)
.map(user =>
.map((user) =>
Object.keys(locationHistory[user])
.map(device => locationHistory[user][device].length)
.map((device) => locationHistory[user][device].length)
.reduce((a, b) => a + b, 0)
)
.reduce((a, b) => a + b, 0);

6
src/views/Map.vue
View File

@@ -197,7 +197,7 @@ export default {
new L.LatLngBounds(this.filteredLocationHistoryLatLngs)
);
} else if (this.map.layers.last && this.lastLocations.length > 0) {
const locations = this.lastLocations.map(l => L.latLng(l.lat, l.lon));
const locations = this.lastLocations.map((l) => L.latLng(l.lat, l.lon));
this.$refs.map.mapObject.fitBounds(new L.LatLngBounds(locations), {
maxZoom: this.maxNativeZoom,
});
@@ -215,12 +215,12 @@ export default {
*/
deviceLocationsWithNameAndFace(user, device, deviceLocations) {
const lastLocation = this.lastLocations.find(
l => l.username === user && l.device === device
(l) => l.username === user && l.device === device
);
if (!lastLocation) {
return deviceLocations;
}
return deviceLocations.map(l => ({
return deviceLocations.map((l) => ({
...l,
name: lastLocation.name,
face: lastLocation.face,

20
yarn.lock
View File

@@ -9245,6 +9245,11 @@ prettier@^1.18.2:
resolved "https://registry.yarnpkg.com/prettier/-/prettier-1.19.1.tgz#f7d7f5ff8a9cd872a7be4ca142095956a60797cb"
integrity sha512-s7PoyDv/II1ObgQunCbB9PdLmUcBZcnWOcxDh7O0N/UwDEsHyqkW+Qh28jW+mVuCdx7gLB0BotYI1Y6uI9iyew==
prettier@^2.0.5:
version "2.0.5"
resolved "https://registry.yarnpkg.com/prettier/-/prettier-2.0.5.tgz#d6d56282455243f2f92cc1716692c08aa31522d4"
integrity sha512-7PtVymN48hGcO4fGjybyBSIWDsLU4H4XlvOHfq91pz9kkGlonzwTfYkaIEwiRg/dAJF9YlbsduBAgtYLi+8cFg==
pretty-error@^2.0.2:
version "2.1.1"
resolved "https://registry.yarnpkg.com/pretty-error/-/pretty-error-2.1.1.tgz#5f4f87c8f91e5ae3f3ba87ab4cf5e03b1a17f1a3"
@@ -11544,11 +11549,16 @@ vue-i18n-extract@1.0.2:
is-valid-glob "^1.0.0"
yargs "^13.2.2"
vue-i18n@^8.17.0, vue-i18n@^8.17.4:
vue-i18n@^8.17.0:
version "8.17.4"
resolved "https://registry.yarnpkg.com/vue-i18n/-/vue-i18n-8.17.4.tgz#d314df7a3fa0780f86cff46a02752668f89b3935"
integrity sha512-wpk/drIkPf6gHCtvHc8zAZ1nsWBZ+/OOJYtJxqhYD6CKT0FJAG5oypwgF9kABt30FBWhl8NEb/QY+vaaBARlFg==
vue-i18n@^8.17.6:
version "8.17.6"
resolved "https://registry.yarnpkg.com/vue-i18n/-/vue-i18n-8.17.6.tgz#eb894dc1db7f69f505a8df5fed37f8d10aa10980"
integrity sha512-SsKL5D9Ii3zJPsFhUSllY754XuZvP8uCouUm+Mbylu95h3OwenV09uzIIEjkT7EtWyDQuWSMWObrNaD4ukBGZw==
vue-jest@^3.0.5:
version "3.0.5"
resolved "https://registry.yarnpkg.com/vue-jest/-/vue-jest-3.0.5.tgz#d6f124b542dcbff207bf9296c19413f4c40b70c9"
@@ -11629,10 +11639,10 @@ vue@^2.6.11, vue@^2.6.9:
resolved "https://registry.yarnpkg.com/vue/-/vue-2.6.11.tgz#76594d877d4b12234406e84e35275c6d514125c5"
integrity sha512-VfPwgcGABbGAue9+sfrD4PuwFar7gPb1yl1UK1MwXoQPAw0BKSqWfoYCT/ThFrdEVWoI51dBuyCoiNU9bZDZxQ==
vuex@^3.3.0:
version "3.3.0"
resolved "https://registry.yarnpkg.com/vuex/-/vuex-3.3.0.tgz#665b4630ea1347317139fcc5cb495aab3ec5e513"
integrity sha512-1MfcBt+YFd20DPwKe0ThhYm1UEXZya4gVKUvCy7AtS11YAOUR+9a6u4fsv1Rr6ePZCDNxW/M1zuIaswp6nNv8Q==
vuex@^3.4.0:
version "3.4.0"
resolved "https://registry.yarnpkg.com/vuex/-/vuex-3.4.0.tgz#20cc086062d750769fce1febb34e7fceeaebde45"
integrity sha512-ajtqwEW/QhnrBZQsZxCLHThZZaa+Db45c92Asf46ZDXu6uHXgbfVuBaJ4gzD2r4UX0oMJHstFwd2r2HM4l8umg==
w3c-hr-time@^1.0.1:
version "1.0.1"