From c2705def86bbb4a639bbc314e49c7d103a54620d Mon Sep 17 00:00:00 2001 From: Eric van der Vlist Date: Fri, 9 Jun 2023 15:49:50 +0200 Subject: [PATCH] Refactoring osm tags (wip) --- src/components/gpx/styles.ts | 10 ++-- src/components/infos/Infos.tsx | 9 ++-- .../map-tile-provider/MapTileProvider.tsx | 46 +++---------------- src/components/map-tile-provider/index.ts | 3 +- src/components/overlays/Overlays.tsx | 7 +-- 5 files changed, 18 insertions(+), 57 deletions(-) diff --git a/src/components/gpx/styles.ts b/src/components/gpx/styles.ts index 41aea56..7316794 100644 --- a/src/components/gpx/styles.ts +++ b/src/components/gpx/styles.ts @@ -23,6 +23,7 @@ import { getZoomInteger } from '../map/Map'; import { getHighlightedTagValue, getTagType, + isHighlightedTagType, } from '../map-tile-provider/MapTileProvider'; import { getCenter } from 'ol/extent'; import { getVectorTileFeatureType } from '../overlays/overlay-definitions'; @@ -33,7 +34,6 @@ interface StyleParameters { isSelected: boolean; } - const icons = { note: { src: noteIcon, @@ -567,8 +567,8 @@ const styles = { if (getZoomInteger() < 16) { return null; } - const highlightedTagValue = getHighlightedTagValue(feature); - const isHighlightedFeature = !!highlightedTagValue; + const tagType = getTagType(feature); + const isHighlightedFeature = isHighlightedTagType(tagType); if ( (isHighlightedFeature && getZoomInteger() < 16) || (!isHighlightedFeature && getZoomInteger() < 18) @@ -577,9 +577,7 @@ const styles = { } return { name: feature.get('name'), - poiType: isHighlightedFeature - ? highlightedTagValue - : getTagType(feature), + poiType: tagType, isHighlighted: isHighlightedFeature, isTextHidden: getZoomInteger() < 19, }; diff --git a/src/components/infos/Infos.tsx b/src/components/infos/Infos.tsx index 4637cb6..ef19ea8 100644 --- a/src/components/infos/Infos.tsx +++ b/src/components/infos/Infos.tsx @@ -15,7 +15,7 @@ import { GpxViewer } from '../gpx'; import { Browser } from '@capacitor/browser'; import { isHighlighted } from '../map-tile-provider'; import { - getHighlightedTagValue, + isHighlightedTagType, getTagType, } from '../map-tile-provider/MapTileProvider'; import style from '../gpx/styles'; @@ -216,9 +216,10 @@ const Infos: Component<{}> = (props) => { <> {console.log({ caller: 'Infos / vector layer feature', - highlightedTagValue: - getHighlightedTagValue(feature), - isHighlighted: isHighlighted(feature), + + isHighlighted: isHighlightedTagType( + getTagType(feature) + ), tagValue: getTagType(feature), properties: feature.getProperties(), style: style(feature), diff --git a/src/components/map-tile-provider/MapTileProvider.tsx b/src/components/map-tile-provider/MapTileProvider.tsx index b6df168..c1038fd 100644 --- a/src/components/map-tile-provider/MapTileProvider.tsx +++ b/src/components/map-tile-provider/MapTileProvider.tsx @@ -156,9 +156,6 @@ const currentOverlayHighlightedKey = () => ? currentOverlay().highlighted : 'none'; -export const currentOverlayHighlightedDefinition = () => - currentCategory()[currentOverlayHighlightedKey()]; - export const highlightedTags = () => { let result = {}; Object.keys(legacyOverlayDefinitions).forEach((tagName) => { @@ -218,42 +215,6 @@ export const highlightedTags = () => { // }); // }); -export const getHighlightedTagValue = (feature: Feature) => { - let result = false; - - Object.keys(highlightedTags()).every((tagName) => { - const value = feature.get(tagName); - const highlightedValues = highlightedTags()[tagName]; - // console.log({ - // caller: 'MapTileProviders / highlightedTag / found', - // feature, - // feature_values: feature.values_, - // highlightedTags, - // tagName, - // tag_value: value, - // highlightedValues, - // }); - - if (value !== undefined && highlightedValues.includes(value)) { - result = value; - return false; - } - return true; - }); - // console.log({ - // caller: 'MapTileProviders / highlightedTag / result', - // feature, - // feature_values: feature.values_, - // highlightedTags, - // result, - // }); - return result; -}; - -export const isHighlighted = (feature: Feature) => { - return !!getHighlightedTagValue(feature); -}; - export const getTagType = (feature: Feature) => { for (const tagType of Object.keys(osmTags)) { const tag: OsmTag = osmTags[tagType]; @@ -265,6 +226,13 @@ export const getTagType = (feature: Feature) => { return false; }; +export const isHighlightedTagType = (tagType: string) => { + const currentOverlayHighlightedDefinition: string[] = + overlayDefinitions[currentOverlayKey()][currentOverlayHighlightedKey()]; + return currentOverlayHighlightedDefinition.includes(tagType); +}; + + const MapTilesProvider: Component<{}> = (props) => { const [open, setOpen] = createSignal(false); diff --git a/src/components/map-tile-provider/index.ts b/src/components/map-tile-provider/index.ts index d08996d..39a32fb 100644 --- a/src/components/map-tile-provider/index.ts +++ b/src/components/map-tile-provider/index.ts @@ -2,6 +2,5 @@ export { default, mapTileProviders, currentCategory as currentOverlayDefinition, - currentOverlayHighlightedDefinition, - isHighlighted, + isHighlightedTagType, } from './MapTileProvider'; diff --git a/src/components/overlays/Overlays.tsx b/src/components/overlays/Overlays.tsx index 1422e0b..2901c8a 100644 --- a/src/components/overlays/Overlays.tsx +++ b/src/components/overlays/Overlays.tsx @@ -1,11 +1,7 @@ import { Component, createEffect, onMount } from 'solid-js'; import OlMap from 'ol/Map'; -import { - currentOverlayDefinition, - currentOverlayHighlightedDefinition, - isHighlighted, -} from '../map-tile-provider'; +import { currentOverlayDefinition, isHighlightedTagType } from '../map-tile-provider'; import { Feature } from 'ol'; import MVT from 'ol/format/MVT'; import { Point } from 'ol/geom'; @@ -174,7 +170,6 @@ export const Overlays: Component = ({ map }) => { createEffect(() => { const overlayDefinition = currentOverlayDefinition(); - const overlayHighlightedDefinition = currentOverlayHighlightedDefinition(); const olMap = getMap(); if (olMap) { olMap.removeLayer(clusterLayer);