Refactoring osm tags (wip)

src/components/gpx/styles.ts

@@ -22,7 +22,7 @@ import osmIcons from './osm-icons';
 import { getZoomInteger } from '../map/Map';
 import {
   getHighlightedTagValue,
-  getTagValue,
+  getTagType,
 } from '../map-tile-provider/MapTileProvider';
 import { getCenter } from 'ol/extent';
 import { getVectorTileFeatureType } from '../overlays/overlay-definitions';
@@ -579,7 +579,7 @@ const styles = {
         name: feature.get('name'),
         poiType: isHighlightedFeature
           ? highlightedTagValue
-          : getTagValue(feature),
+          : getTagType(feature),
         isHighlighted: isHighlightedFeature,
         isTextHidden: getZoomInteger() < 19,
       };

src/components/infos/Infos.tsx

@@ -16,7 +16,7 @@ import { Browser } from '@capacitor/browser';
 import { isHighlighted } from '../map-tile-provider';
 import {
   getHighlightedTagValue,
-  getTagValue,
+  getTagType,
 } from '../map-tile-provider/MapTileProvider';
 import style from '../gpx/styles';
 import OsmFindAll from './OsmFindAll';
@@ -219,7 +219,7 @@ const Infos: Component<{}> = (props) => {
                                   highlightedTagValue:
                                     getHighlightedTagValue(feature),
                                   isHighlighted: isHighlighted(feature),
-                                  tagValue: getTagValue(feature),
+                                  tagValue: getTagType(feature),
                                   properties: feature.getProperties(),
                                   style: style(feature),
                                 })}

src/components/map-tile-provider/MapTileProvider.tsx

@@ -25,8 +25,10 @@ import getUri from '../../lib/ids';
 import { Feature } from 'ol';
 
 import {
-  overlayCategories,
+  overlayDefinitions,
   legacyOverlayDefinitions,
+  osmTags,
+  OsmTag,
 } from '../overlays/overlay-definitions';
 import { cloneDeep } from 'lodash';
 
@@ -126,65 +128,6 @@ const defaultOverlays: Overlays = {
   none: { selected: true, highlighted: { none: [] }, hidden: {} },
 };
 
-// type OverlayDefinition = Record<string, FeatureTypes>;
-// type OverlayDefinitions = Record<string, OverlayDefinition>;
-
-// export const legacyOverlayDefinitions: OverlayDefinitions = {
-//   none: {},
-//   hiking: {
-//     none: {},
-//     sleeping: {
-//       tourism: [
-//         'hotel',
-//         'alpine_hut',
-//         'apartment',
-//         'camp_site',
-//         'chalet',
-//         'guest_house',
-//         'hostel',
-//         'motel',
-//         'wilderness_hut',
-//       ],
-//     },
-//     drinking: {
-//       amenity: ['bar', 'cafe', 'pub', 'drinking_water', 'water_point'],
-//       natural: ['spring'],
-//     },
-//     eating: {
-//       amenity: ['fast_food', 'pub', 'restaurant'],
-//       shop: [
-//         'bakery',
-//         'butcher',
-//         'cheese',
-//         'chocolate',
-//         'convenience',
-//         'dairy',
-//         'farm',
-//         'greengrocer',
-//         'health_food',
-//         'pastry',
-//         'seafood',
-//         'department_store',
-//         'supermarket',
-//       ],
-//     },
-//     health: {
-//       amenity: ['doctors', 'hospital', 'pharmacy'],
-//     },
-//     security: {
-//       amenity: ['police', 'fire_station'],
-//     },
-//     dayToday: {
-//       amenity: ['waste_basket', 'waste_disposal'],
-//       shop: ['laundry'],
-//     },
-//     naturalSites: {
-//       tourism: ['viewpoint'],
-//       natural: '*',
-//     },
-//   },
-// };
-
 const getOverlays = createCachedSignal({
   id,
   method: 'getOverlays',
@@ -199,12 +142,14 @@ const currentOverlayKey = () =>
 const currentOverlay = () =>
   getOverlays() ? getOverlays()[currentOverlayKey()] : {};
 
-const overlayCategoriesPlusNone = { none: [], ...overlayCategories };
+const overlayDefinitionsPlusNone = { none: {}, ...overlayDefinitions };
 
 export const currentCategory = () =>
+  Object.keys(
     currentOverlayKey() === 'none'
-    ? []
+      ? {}
-    : ['none', ...overlayCategoriesPlusNone[currentOverlayKey()]];
+      : { none: [], ...overlayDefinitionsPlusNone[currentOverlayKey()] }
+  );
 
 const currentOverlayHighlightedKey = () =>
   currentOverlay() && currentOverlay().highlighted
@@ -214,7 +159,6 @@ const currentOverlayHighlightedKey = () =>
 export const currentOverlayHighlightedDefinition = () =>
   currentCategory()[currentOverlayHighlightedKey()];
 
-
 export const highlightedTags = () => {
   let result = {};
   Object.keys(legacyOverlayDefinitions).forEach((tagName) => {
@@ -310,34 +254,15 @@ export const isHighlighted = (feature: Feature) => {
   return !!getHighlightedTagValue(feature);
 };
 
-export const getTagValue = (feature: Feature) => {
+export const getTagType = (feature: Feature) => {
-  let result = false;
+  for (const tagType of Object.keys(osmTags)) {
-  Object.keys(legacyOverlayDefinitions).every((tagName) => {
+    const tag: OsmTag = osmTags[tagType];
-    const value = feature.get(tagName);
+    const tagValue = feature.get(tag.name);
-    const tagValues = legacyOverlayDefinitions[tagName];
+    if (tagValue != undefined) {
-
+      return tagType;
-    if (value !== undefined && Object.keys(tagValues).includes(value)) {
-      // console.log({
-      //   caller: 'MapTileProviders / tagValue / found',
-      //   feature,
-      //   feature_values: feature.values_,
-      //   highlightedTags,
-      //   tagName,
-      //   tag_value: value,
-      //   highlightedValues,
-      // });
-      result = value;
-      return false;
     }
-    return true;
+  }
-  });
+  return false;
-  // console.log({
-  //   caller: 'MapTileProviders / isHighlighted / false',
-  //   feature,
-  //   feature_values: feature.values_,
-  //   highlightedTags,
-  // });
-  return result;
 };
 
 const MapTilesProvider: Component<{}> = (props) => {
@@ -434,7 +359,7 @@ const MapTilesProvider: Component<{}> = (props) => {
                 defaultValue={currentOverlayKey()}
                 onChange={handleOverlayChange}
               >
-                <For each={Object.keys(overlayCategoriesPlusNone)}>
+                <For each={Object.keys(overlayDefinitionsPlusNone)}>
                   {(p: string) => (
                     <FormControlLabel value={p} control={<Radio />} label={p} />
                   )}

src/components/overlays/index.ts

@@ -1 +1,6 @@
-import { legacyOverlayDefinitions, overlayCategories } from './overlay-definitions';
+import {
+  legacyOverlayDefinitions,
+  overlayDefinitions,
+  OsmTag,
+  osmTags,
+} from './overlay-definitions';

src/components/overlays/overlay-definitions.ts

@@ -1,6 +1,11 @@
 import { indexOf } from 'lodash';
 import { Feature } from 'ol';
 
+export interface OsmTag {
+  name: string;
+  value: string;
+}
+
 export const osmTags = {
   bar: { name: 'amenity', value: 'bar' },
   fast_food: { name: 'amenity', value: 'fast_food' },
@@ -563,31 +568,6 @@ export const legacyOverlayDefinitions = {
   },
 };
 
-let _flat: any = [];
-Object.values(legacyOverlayDefinitions).forEach((category) => {
-  Object.values(category).forEach((subCategory) => {
-    _flat = [..._flat, subCategory];
-  });
-});
-
-type Categories = { string: Set<string> };
-
-export let overlayCategories: Categories = {};
-
-_flat.forEach((obj: any) => {
-  Object.keys(obj).forEach((catName: string) => {
-    const catValue = obj[catName];
-    const previous =
-      overlayCategories[catName] === undefined
-        ? []
-        : overlayCategories[catName];
-    overlayCategories[catName] = new Set([
-      ...previous,
-      ...Object.keys(catValue),
-    ]);
-  });
-});
-
 export const getVectorTileFeatureType = (feature: Feature) => {
   if (
     ['hiking'].includes(feature.get('route')) ||
@@ -608,6 +588,5 @@ export const getVectorTileFeatureType = (feature: Feature) => {
 console.log({
   caller: 'overlay-definitions',
   legacyOverlayDefinitions,
-  _flat,
+  overlayDefinitions,
-  overlayCategories,
 });