diff options
author | Kieran Dodson <128472473+K-J-Dod24@users.noreply.github.com> | 2023-05-17 08:59:34 +0100 |
---|---|---|
committer | GitHub <noreply@github.com> | 2023-05-17 08:59:34 +0100 |
commit | 1cc52221d7962367622a88416cc0f1aef0ce7203 (patch) | |
tree | 931500079a3060643afc98ec3c82645ba619cac6 | |
parent | e5f04f968af12035fe1291267567ea976fa16a17 (diff) | |
parent | eb364d8726f6e79cede10b168ea2ae31bbbe696e (diff) | |
download | trackermap-web-1cc52221d7962367622a88416cc0f1aef0ce7203.tar.gz trackermap-web-1cc52221d7962367622a88416cc0f1aef0ce7203.tar.bz2 trackermap-web-1cc52221d7962367622a88416cc0f1aef0ce7203.zip |
Merge branch 'traccar:master' into Teltonika-io32-coolantTemp
-rw-r--r-- | modern/public/index.html | 6 | ||||
-rw-r--r-- | modern/public/manifest.json | 6 | ||||
-rw-r--r-- | modern/src/App.js | 4 | ||||
-rw-r--r-- | modern/src/AppThemeProvider.js | 17 | ||||
-rw-r--r-- | modern/src/common/attributes/usePositionAttributes.js | 4 | ||||
-rw-r--r-- | modern/src/common/attributes/useServerAttributes.js | 18 | ||||
-rw-r--r-- | modern/src/common/theme/index.js | 9 | ||||
-rw-r--r-- | modern/src/common/theme/palette.js | 48 | ||||
-rw-r--r-- | modern/src/index.js | 19 | ||||
-rw-r--r-- | modern/src/map/core/preloadImages.js | 2 | ||||
-rw-r--r-- | modern/src/map/overlay/useMapOverlays.js | 6 | ||||
-rw-r--r-- | modern/src/resources/l10n/en.json | 6 | ||||
-rw-r--r-- | web/debug.html | 2 | ||||
-rw-r--r-- | web/release.html | 2 |
14 files changed, 101 insertions, 48 deletions
diff --git a/modern/public/index.html b/modern/public/index.html index 9d06d07d..f92dae57 100644 --- a/modern/public/index.html +++ b/modern/public/index.html @@ -4,12 +4,12 @@ <meta charset="utf-8" /> <link rel="icon" href="%PUBLIC_URL%/favicon.ico" /> <meta name="viewport" content="width=device-width, initial-scale=1" /> - <meta name="theme-color" content="#1a237e" /> - <meta name="description" content="Traccar GPS tracking system" /> + <meta name="theme-color" content="${colorPrimary}" /> + <meta name="description" content="${description}" /> <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" /> <link rel="manifest" href="%PUBLIC_URL%/manifest.json" /> <link rel="stylesheet" href="%PUBLIC_URL%/styles.css"> - <title>Traccar</title> + <title>${title}</title> </head> <body> <noscript>Enable JavaScript to use <a href="https://www.traccar.org/">Traccar GPS Tracking System</a>.</noscript> diff --git a/modern/public/manifest.json b/modern/public/manifest.json index fad9bbe5..9142346c 100644 --- a/modern/public/manifest.json +++ b/modern/public/manifest.json @@ -1,6 +1,6 @@ { - "short_name": "Traccar", - "name": "Traccar GPS Tracking System", + "short_name": "${title}", + "name": "${description}", "icons": [ { "src": "favicon.ico", @@ -22,6 +22,6 @@ ], "start_url": ".", "display": "standalone", - "theme_color": "#1a237e", + "theme_color": "${colorPrimary}", "background_color": "#ffffff" } diff --git a/modern/src/App.js b/modern/src/App.js index baa2c3f2..89785cfa 100644 --- a/modern/src/App.js +++ b/modern/src/App.js @@ -1,9 +1,8 @@ import React from 'react'; import { Outlet, useNavigate } from 'react-router-dom'; import { useDispatch, useSelector } from 'react-redux'; -import { LinearProgress, useMediaQuery } from '@mui/material'; +import { LinearProgress, useMediaQuery, useTheme } from '@mui/material'; import makeStyles from '@mui/styles/makeStyles'; -import theme from './common/theme'; import BottomMenu from './common/components/BottomMenu'; import SocketController from './SocketController'; import CachingController from './CachingController'; @@ -22,6 +21,7 @@ const useStyles = makeStyles(() => ({ const App = () => { const classes = useStyles(); + const theme = useTheme(); const dispatch = useDispatch(); const navigate = useNavigate(); diff --git a/modern/src/AppThemeProvider.js b/modern/src/AppThemeProvider.js new file mode 100644 index 00000000..0f1c5479 --- /dev/null +++ b/modern/src/AppThemeProvider.js @@ -0,0 +1,17 @@ +import React from 'react'; +import { useSelector } from 'react-redux'; +import { ThemeProvider } from '@mui/material'; +import theme from './common/theme'; + +const AppThemeProvider = ({ children }) => { + const server = useSelector((state) => state.session.server); + const themeInstance = theme(server); + + return ( + <ThemeProvider theme={themeInstance}> + {children} + </ThemeProvider> + ); +}; + +export default AppThemeProvider; diff --git a/modern/src/common/attributes/usePositionAttributes.js b/modern/src/common/attributes/usePositionAttributes.js index 2c3aa0f7..e08e91d5 100644 --- a/modern/src/common/attributes/usePositionAttributes.js +++ b/modern/src/common/attributes/usePositionAttributes.js @@ -152,6 +152,10 @@ export default (t) => useMemo(() => ({ name: t('positionSteps'), type: 'number', }, + heartRate: { + name: t('positionHeartRate'), + type: 'number', + }, input: { name: t('positionInput'), type: 'number', diff --git a/modern/src/common/attributes/useServerAttributes.js b/modern/src/common/attributes/useServerAttributes.js index ba49e44d..76d5a157 100644 --- a/modern/src/common/attributes/useServerAttributes.js +++ b/modern/src/common/attributes/useServerAttributes.js @@ -1,6 +1,24 @@ import { useMemo } from 'react'; export default (t) => useMemo(() => ({ + title: { + name: t('serverName'), + type: 'string', + }, + description: { + name: t('serverDescription'), + type: 'string', + }, + colorPrimary: { + name: t('serverColorPrimary'), + type: 'string', + subtype: 'color', + }, + colorSecondary: { + name: t('serverColorSecondary'), + type: 'string', + subtype: 'color', + }, 'ui.disableLoginLanguage': { name: t('attributeUiDisableLoginLanguage'), type: 'boolean', diff --git a/modern/src/common/theme/index.js b/modern/src/common/theme/index.js index 0cc999ad..0f163e7e 100644 --- a/modern/src/common/theme/index.js +++ b/modern/src/common/theme/index.js @@ -1,12 +1,11 @@ +import { useMemo } from 'react'; import { createTheme } from '@mui/material/styles'; import palette from './palette'; import dimensions from './dimensions'; import components from './components'; -const theme = createTheme({ - palette, +export default (server) => useMemo(() => createTheme({ + palette: palette(server), dimensions, components, -}); - -export default theme; +}), [server]); diff --git a/modern/src/common/theme/palette.js b/modern/src/common/theme/palette.js index c6cb00d9..dfc8b9dd 100644 --- a/modern/src/common/theme/palette.js +++ b/modern/src/common/theme/palette.js @@ -2,28 +2,30 @@ import { amber, grey, green, indigo, red, common, } from '@mui/material/colors'; -const colors = { - white: common.white, - background: grey[50], - primary: indigo[900], - secondary: green[800], - positive: green[500], - medium: amber[700], - negative: red[500], - neutral: grey[500], - geometry: '#3bb2d0', -}; +export default (server) => { + const colors = { + white: common.white, + background: grey[50], + primary: server?.attributes?.colorPrimary || indigo[900], + secondary: server?.attributes?.colorSecondary || green[800], + positive: green[500], + medium: amber[700], + negative: red[500], + neutral: grey[500], + geometry: '#3bb2d0', + }; -export default { - background: { - default: colors.background, - }, - primary: { - main: colors.primary, - }, - secondary: { - main: colors.secondary, - contrastText: colors.white, - }, - colors, + return { + background: { + default: colors.background, + }, + primary: { + main: colors.primary, + }, + secondary: { + main: colors.secondary, + contrastText: colors.white, + }, + colors, + }; }; diff --git a/modern/src/index.js b/modern/src/index.js index e5457789..936fe7c1 100644 --- a/modern/src/index.js +++ b/modern/src/index.js @@ -3,17 +3,17 @@ import React from 'react'; import { createRoot } from 'react-dom/client'; import { BrowserRouter } from 'react-router-dom'; import { Provider } from 'react-redux'; -import { CssBaseline, ThemeProvider, StyledEngineProvider } from '@mui/material'; +import { CssBaseline, StyledEngineProvider } from '@mui/material'; import store from './store'; import { LocalizationProvider } from './common/components/LocalizationProvider'; import ErrorHandler from './common/components/ErrorHandler'; -import theme from './common/theme'; import Navigation from './Navigation'; import preloadImages from './map/core/preloadImages'; import * as serviceWorkerRegistration from './serviceWorkerRegistration'; import NativeInterface from './common/components/NativeInterface'; import ServerProvider from './ServerProvider'; import ErrorBoundary from './ErrorBoundary'; +import AppThemeProvider from './AppThemeProvider'; preloadImages(); @@ -23,16 +23,17 @@ root.render( <Provider store={store}> <LocalizationProvider> <StyledEngineProvider injectFirst> - <ThemeProvider theme={theme}> - <CssBaseline /> - <ServerProvider> + <CssBaseline /> + <ServerProvider> + <AppThemeProvider> + <CssBaseline /> <BrowserRouter> <Navigation /> </BrowserRouter> - </ServerProvider> - <ErrorHandler /> - <NativeInterface /> - </ThemeProvider> + <ErrorHandler /> + <NativeInterface /> + </AppThemeProvider> + </ServerProvider> </StyledEngineProvider> </LocalizationProvider> </Provider> diff --git a/modern/src/map/core/preloadImages.js b/modern/src/map/core/preloadImages.js index 770c1c57..0634251b 100644 --- a/modern/src/map/core/preloadImages.js +++ b/modern/src/map/core/preloadImages.js @@ -61,7 +61,7 @@ export default async () => { const results = []; ['primary', 'positive', 'negative', 'neutral'].forEach((color) => { results.push(loadImage(mapIcons[category]).then((icon) => { - mapImages[`${category}-${color}`] = prepareIcon(background, icon, palette.colors[color]); + mapImages[`${category}-${color}`] = prepareIcon(background, icon, palette().colors[color]); })); }); await Promise.all(results); diff --git a/modern/src/map/overlay/useMapOverlays.js b/modern/src/map/overlay/useMapOverlays.js index 3d539d32..5114424b 100644 --- a/modern/src/map/overlay/useMapOverlays.js +++ b/modern/src/map/overlay/useMapOverlays.js @@ -29,6 +29,12 @@ export default () => { available: true, }, { + id: 'openRailwayMap', + title: t('mapOpenRailwayMap'), + source: sourceCustom(['https://tiles.openrailwaymap.org/standard/{z}/{x}/{y}.png']), + available: true, + }, + { id: 'openWeatherClouds', title: t('mapOpenWeatherClouds'), source: sourceOpenWeather('clouds_new', openWeatherKey), diff --git a/modern/src/resources/l10n/en.json b/modern/src/resources/l10n/en.json index ab2ffd04..d19ac460 100644 --- a/modern/src/resources/l10n/en.json +++ b/modern/src/resources/l10n/en.json @@ -268,6 +268,7 @@ "positionHours": "Hours", "positionSteps": "Steps", "positionInput": "Input", + "positionHeartRate": "Heart Rate", "positionOutput": "Output", "positionBatteryLevel": "Battery Level", "positionFuelConsumption": "Fuel Consumption", @@ -305,11 +306,16 @@ "serverReadonly": "Readonly", "serverForceSettings": "Force Settings", "serverAnnouncement": "Announcement", + "serverName": "Server Name", + "serverDescription": "Server Description", + "serverColorPrimary": "Color Primary", + "serverColorSecondary": "Color Secondary", "mapTitle": "Map", "mapActive": "Active Maps", "mapOverlay": "Map Overlay", "mapOverlayCustom": "Custom Overlay", "mapOpenSeaMap": "OpenSeaMap", + "mapOpenRailwayMap": "OpenRailwayMap", "mapOpenWeatherKey": "OpenWeather API Key", "mapOpenWeatherClouds": "OpenWeather Clouds", "mapOpenWeatherPrecipitation": "OpenWeather Precipitation", diff --git a/web/debug.html b/web/debug.html index ef2d2a56..08b6e07d 100644 --- a/web/debug.html +++ b/web/debug.html @@ -3,7 +3,7 @@ <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> -<title>Traccar</title> +<title>${title}</title> <link rel="icon" sizes="192x192" href="/icon.png"> <link rel="apple-touch-icon" href="/apple-touch-icon.png"> <link rel="stylesheet" href="app.css"> diff --git a/web/release.html b/web/release.html index 1c22da60..44561ff3 100644 --- a/web/release.html +++ b/web/release.html @@ -3,7 +3,7 @@ <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> -<title>Traccar</title> +<title>${title}</title> <link rel="icon" sizes="192x192" href="/icon.png"> <link rel="apple-touch-icon" href="/apple-touch-icon.png"> <link rel="stylesheet" href="app.css"> |