diff options
-rw-r--r-- | modern/src/map/core/MapView.js | 11 | ||||
-rw-r--r-- | modern/src/map/switcher/switcher.js | 2 | ||||
-rw-r--r-- | modern/src/settings/PreferencesPage.js | 17 | ||||
-rw-r--r-- | web/l10n/en.json | 1 |
4 files changed, 25 insertions, 6 deletions
diff --git a/modern/src/map/core/MapView.js b/modern/src/map/core/MapView.js index 1e16e4dc..20e84185 100644 --- a/modern/src/map/core/MapView.js +++ b/modern/src/map/core/MapView.js @@ -52,7 +52,7 @@ map.addControl(new maplibregl.NavigationControl()); const switcher = new SwitcherControl( () => updateReadyValue(false), - (layerId) => savePersistedState('mapLayer', layerId), + (styleId) => savePersistedState('selectedMapStyle', styleId), () => { map.once('styledata', () => { const waiting = () => { @@ -75,7 +75,8 @@ const MapView = ({ children }) => { const [mapReady, setMapReady] = useState(false); const mapStyles = useMapStyles(); - const [defaultMapLayer] = usePersistedState('mapLayer', 'locationIqStreets'); + const [activeMapStyles] = usePersistedState('activeMapStyles', ['locationIqStreets', 'osm', 'carto']); + const [defaultMapStyle] = usePersistedState('selectedMapStyle', 'locationIqStreets'); const mapboxAccessToken = useAttributePreference('mapboxAccessToken'); useEffect(() => { @@ -83,9 +84,9 @@ const MapView = ({ children }) => { }, [mapboxAccessToken]); useEffect(() => { - const filteredStyles = mapStyles.filter((style) => style.available); - switcher.updateStyles(filteredStyles, defaultMapLayer); - }, [mapStyles, defaultMapLayer]); + const filteredStyles = mapStyles.filter((style) => style.available && activeMapStyles.includes(style.id)); + switcher.updateStyles(filteredStyles, defaultMapStyle); + }, [mapStyles, defaultMapStyle]); useEffect(() => { const listener = (ready) => setMapReady(ready); diff --git a/modern/src/map/switcher/switcher.js b/modern/src/map/switcher/switcher.js index d96f7ffc..848abc40 100644 --- a/modern/src/map/switcher/switcher.js +++ b/modern/src/map/switcher/switcher.js @@ -24,7 +24,7 @@ export class SwitcherControl { } } if (!selectedStyle) { - this.styles[0].id; + selectedStyle = this.styles[0].id; } while (this.mapStyleContainer.firstChild) { diff --git a/modern/src/settings/PreferencesPage.js b/modern/src/settings/PreferencesPage.js index 0b5cd466..c128e5e4 100644 --- a/modern/src/settings/PreferencesPage.js +++ b/modern/src/settings/PreferencesPage.js @@ -22,6 +22,7 @@ import SettingsMenu from './components/SettingsMenu'; import usePositionAttributes from '../common/attributes/usePositionAttributes'; import { prefixString, unprefixString } from '../common/util/stringUtils'; import SelectField from '../common/components/SelectField'; +import useMapStyles from '../map/core/useMapStyles'; const useStyles = makeStyles((theme) => ({ container: { @@ -42,6 +43,9 @@ const PreferencesPage = () => { const { languages, language, setLanguage } = useLocalization(); const languageList = Object.entries(languages).map((values) => ({ code: values[0], name: values[1].name })); + const mapStyles = useMapStyles(); + const [activeMapStyles, setActiveMapStyles] = usePersistedState('activeMapStyles', ['locationIqStreets', 'osm', 'carto']); + const positionAttributes = usePositionAttributes(t); const [positionItems, setPositionItems] = usePersistedState('positionItems', ['speed', 'address', 'totalDistance', 'course']); @@ -88,6 +92,19 @@ const PreferencesPage = () => { </AccordionSummary> <AccordionDetails className={classes.details}> <FormControl> + <InputLabel>{t('mapActive')}</InputLabel> + <Select + label={t('mapActive')} + value={activeMapStyles} + onChange={(e) => setActiveMapStyles(e.target.value)} + multiple + > + {mapStyles.map((style) => ( + <MenuItem key={style.id} value={style.id}>{style.title}</MenuItem> + ))} + </Select> + </FormControl> + <FormControl> <InputLabel>{t('sharedAttributes')}</InputLabel> <Select label={t('sharedAttributes')} diff --git a/web/l10n/en.json b/web/l10n/en.json index 8d851911..e10bba61 100644 --- a/web/l10n/en.json +++ b/web/l10n/en.json @@ -251,6 +251,7 @@ "serverForceSettings": "Force Settings", "serverAnnouncement": "Announcement", "mapTitle": "Map", + "mapActive": "Active Maps", "mapLayer": "Map Layer", "mapCustom": "Custom (XYZ)", "mapCustomArcgis": "Custom (ArcGIS)", |