Open source hiking (but not only) app. Work in progress...
Go to file
Eric van der Vlist a458b82dc1 Second attempt to better hide the popup overlay when not shown... 2023-02-06 14:56:39 +01:00
.vscode Fresh install 2022-11-25 16:33:59 +01:00
patches Patch for @suid/material 2023-02-06 09:56:09 +01:00
src Second attempt to better hide the popup overlay when not shown... 2023-02-06 14:56:39 +01:00
.gitignore gitignore 2022-12-17 18:17:39 +01:00
AndroidManifest.xml Adding an intent filter so that GPX can be imported from outdooractive 2023-02-04 21:17:05 +01:00
README.md Basic branches history in Readme.md 2023-02-05 15:32:14 +01:00
cSpell.json Still working on clustering. 2023-01-18 22:10:23 +01:00
capacitor.config.ts Updating capacitor and android config to change appname 2022-12-12 14:40:46 +01:00
fix-jest-dom.mjs Fresh install 2022-11-25 16:33:59 +01:00
helper.ts Helper to create style filters. 2023-01-31 11:56:40 +01:00
index.html Fresh install 2022-11-25 16:33:59 +01:00
package-lock.json Adding patch-package 2023-02-06 10:04:17 +01:00
package.json Adding patch-package 2023-02-06 10:04:17 +01:00
pnpm-lock.yaml Fresh install 2022-11-25 16:33:59 +01:00
setupVitest.ts Fresh install 2022-11-25 16:33:59 +01:00
tsconfig.json Displaying waypoints (and installing a plugin to import SVG files as components) 2023-01-03 13:12:16 +01:00
vite.config.ts Displaying waypoints (and installing a plugin to import SVG files as components) 2023-01-03 13:12:16 +01:00

README.md

Dyomedea

Branches

  • master: dev branch (started as a React project; now using dolidjs)
  • multi-layers: attempt to create a native React map components. Went pretty far but there was still so many things to implement that I switched to:
  • openlayers: an attempt to use React with Openlayers. Wasn't that easy because Openlayers is heavily based on the DOM while React uses a "pseudo-dom". That has been one of the reasons why I switched (again) to:
  • solid: a SolidJS / Openlayers implementation that has replaced the master branch on Feb 5th, 2023.

Hiking app.

Documentation

vdv@nuc:~/projects/tea/dyomedea/dyomedea$ npx typedoc 
./src/serviceWorkerRegistration.ts:21:0 - warning Config is referenced by serviceWorkerRegistration.register.register.config but not included in the documentation.

21    type Config = {

Documentation generated at ./doc
vdv@nuc:~/projects/tea/dyomedea/dyomedea$ 

Components

TBD

Data formats

There is a number of data formats more or less specific to geography and hiking, such as:

SVG is very generic and is used to draw 2D figures in HTML applications and doesn't care about geography.

KML, GeoJSON and OSM elements have been designed to represent generic geographical points and shapes.

GPX is more specific, having been designed to represent routes and tracks and its semantics are directly useable in our application.

The structure of our components and indexes can therefore follow the GPX format.

OSM elements is interesting to extract information from the OSM DB, either by querying their API or by downloading portions of the database.

GeoJSON might be of interest as an intermediate format since a number of JS libraries have been developed to perform queries or draw GeoJSON data as SVG.

KML might be considered as an import format.

And SVG, of course will be used to render tracks and routes on a map since its elements are directly supported by React.

Notes to self

Patching node_modules

This can be done by updating their sources in the node_modules directory and using the patch-package npm CLI command (thanks stackoverflow) :

$npx patch-package localized-strings

However, it takes ages before ionic serve takes these modifications into account.

Visual Code snippets

Useful commands

vdv@nuc:~/projects/tea/dyomedea/dyomedea$ adb --version
Android Debug Bridge version 1.0.41
Version 33.0.3-8952118
Installed as /homext/Android/Sdk/platform-tools/adb

$ ionic capacitor run --target RFCN20NEZ4R   android

$ ionic serve --no-open

$ npm test

$ npx typedoc

$ npx trapeze run trapeze.config.yaml 

vdv@nuc:~/projects/tea/dyomedea/dyomedea$ echo $ANDROID_SDK_ROOT
/home/vdv/Android/Sdk

To (re)generate android/

$ rm capacitor.config.ts
$ rm -rf android
$ npx cap init dyomedea com.dyomedea.dyomedea # assets in dist/
$ npx cap add android
$ cp  AndroidManifest.xml ./android/app/src/main/AndroidManifest.xml
$ npx cap run --target RFCN20NEZ4R   android

To generate style filters

vdv@nuc:~/projects/tea/dyomedea/dyomedea$ esrun helper.ts 
{
  caller: 'overlay-definitions',
  overlayDefinitions: {
    amenity: {
      bar: [Object],
      fast_food: [Object],
      food_court: [Object],
      pub: [Object],
      restaurant: [Object],
      cafe: [Object],
      atm: [Object],
      bank: [Object],
      doctors: [Object],
      hospital: [Object],
      pharmacy: [Object],
      police: [Object],
      fire_station: [Object],
      drinking_water: [Object],
      water_point: [Object],
      waste_basket: [Object],
      waste_disposal: [Object],
      vending_machine: [Object]
    },
    shop: {
      bakery: [Object],
      butcher: [Object],
      cheese: [Object],
      chocolate: [Object],
      convenience: [Object],
      dairy: [Object],
      farm: [Object],
      greengrocer: [Object],
      health_food: [Object],
      pasta: [Object],
      pastry: [Object],
      seafood: [Object],
      water: [Object],
      department_store: [Object],
      general: [Object],
      mall: [Object],
      supermarket: [Object],
      wholesale: [Object],
      outdoor: [Object],
      laundry: [Object]
    },
    tourism: {
      hotel: [Object],
      alpine_hut: [Object],
      apartment: [Object],
      camp_site: [Object],
      chalet: [Object],
      guest_house: [Object],
      hostel: [Object],
      motel: [Object],
      wilderness_hut: [Object],
      viewpoint: [Object]
    },
    waterway: { waterfall: [Object] },
    natural: {
      peak: [Object],
      cave_entrance: [Object],
      volcano: [Object],
      arch: [Object],
      arete: [Object],
      fumarole: [Object],
      rock: [Object],
      saddle: [Object],
      sinkhole: [Object],
      stone: [Object],
      glacier: [Object],
      spring: [Object],
      hot_spring: [Object],
      geyser: [Object]
    }
  },
  _flat: [
    { hiking: [Object] }, { hiking: [Object] }, { hiking: [Object] },
    { hiking: [Object] }, { hiking: [Object] }, { hiking: [Object] },
    { hiking: [Object] }, { hiking: [Object] }, { hiking: [Object] },
    { hiking: [Object] }, { hiking: [Object] }, { hiking: [Object] },
    { hiking: [Object] }, { hiking: [Object] }, { hiking: [Object] },
    { hiking: [Object] }, { hiking: [Object] }, { hiking: [Object] },
    { hiking: [Object] }, { hiking: [Object] }, { hiking: [Object] },
    { hiking: [Object] }, { hiking: [Object] }, { hiking: [Object] },
    { hiking: [Object] }, { hiking: [Object] }, { hiking: [Object] },
    { hiking: [Object] }, { hiking: [Object] }, { hiking: [Object] },
    { hiking: [Object] }, { hiking: [Object] }, { hiking: [Object] },
    { hiking: [Object] }, { hiking: [Object] }, { hiking: [Object] },
    { hiking: [Object] }, { hiking: [Object] }, { hiking: [Object] },
    { hiking: [Object] }, { hiking: [Object] }, { hiking: [Object] },
    { hiking: [Object] }, { hiking: [Object] }, { hiking: [Object] },
    { hiking: [Object] }, { hiking: [Object] }, { hiking: [Object] },
    { hiking: [Object] }, { hiking: [Object] }, { hiking: [Object] },
    { hiking: [Object] }, { hiking: [Object] }, { hiking: [Object] },
    { hiking: [Object] }, { hiking: [Object] }, { hiking: [Object] },
    { hiking: [Object] }, { hiking: [Object] }, { hiking: [Object] },
    { hiking: [Object] }, { hiking: [Object] }, { hiking: [Object] }
  ],
  overlayCategories: {
    hiking: Set(9) {
      'drinking',
      'eating',
      'money',
      'dayToDay',
      'health',
      'security',
      'material',
      'sleeping',
      'naturalSites'
    }
  }
}
{
  overlayDefinitions: {
    amenity: {
      bar: [Object],
      fast_food: [Object],
      food_court: [Object],
      pub: [Object],
      restaurant: [Object],
      cafe: [Object],
      atm: [Object],
      bank: [Object],
      doctors: [Object],
      hospital: [Object],
      pharmacy: [Object],
      police: [Object],
      fire_station: [Object],
      drinking_water: [Object],
      water_point: [Object],
      waste_basket: [Object],
      waste_disposal: [Object],
      vending_machine: [Object]
    },
    shop: {
      bakery: [Object],
      butcher: [Object],
      cheese: [Object],
      chocolate: [Object],
      convenience: [Object],
      dairy: [Object],
      farm: [Object],
      greengrocer: [Object],
      health_food: [Object],
      pasta: [Object],
      pastry: [Object],
      seafood: [Object],
      water: [Object],
      department_store: [Object],
      general: [Object],
      mall: [Object],
      supermarket: [Object],
      wholesale: [Object],
      outdoor: [Object],
      laundry: [Object]
    },
    tourism: {
      hotel: [Object],
      alpine_hut: [Object],
      apartment: [Object],
      camp_site: [Object],
      chalet: [Object],
      guest_house: [Object],
      hostel: [Object],
      motel: [Object],
      wilderness_hut: [Object],
      viewpoint: [Object]
    },
    waterway: { waterfall: [Object] },
    natural: {
      peak: [Object],
      cave_entrance: [Object],
      volcano: [Object],
      arch: [Object],
      arete: [Object],
      fumarole: [Object],
      rock: [Object],
      saddle: [Object],
      sinkhole: [Object],
      stone: [Object],
      glacier: [Object],
      spring: [Object],
      hot_spring: [Object],
      geyser: [Object]
    }
  },
  filters: [
    'any',
    [
      'in',             'amenity',
      'bar',            'fast_food',
      'food_court',     'pub',
      'restaurant',     'cafe',
      'atm',            'bank',
      'doctors',        'hospital',
      'pharmacy',       'police',
      'fire_station',   'drinking_water',
      'water_point',    'waste_basket',
      'waste_disposal', 'vending_machine'
    ],
    [
      'in',          'shop',
      'bakery',      'butcher',
      'cheese',      'chocolate',
      'convenience', 'dairy',
      'farm',        'greengrocer',
      'health_food', 'pasta',
      'pastry',      'seafood',
      'water',       'department_store',
      'general',     'mall',
      'supermarket', 'wholesale',
      'outdoor',     'laundry'
    ],
    [
      'in',             'tourism',
      'hotel',          'alpine_hut',
      'apartment',      'camp_site',
      'chalet',         'guest_house',
      'hostel',         'motel',
      'wilderness_hut', 'viewpoint'
    ],
    [ 'in', 'waterway', 'waterfall' ],
    [
      'in',         'natural',
      'peak',       'cave_entrance',
      'volcano',    'arch',
      'arete',      'fumarole',
      'rock',       'saddle',
      'sinkhole',   'stone',
      'glacier',    'spring',
      'hot_spring', 'geyser'
    ]
  ],
  json: '["any",["in","amenity","bar","fast_food","food_court","pub","restaurant","cafe","atm","bank","doctors","hospital","pharmacy","police","fire_station","drinking_water","water_point","waste_basket","waste_disposal","vending_machine"],["in","shop","bakery","butcher","cheese","chocolate","convenience","dairy","farm","greengrocer","health_food","pasta","pastry","seafood","water","department_store","general","mall","supermarket","wholesale","outdoor","laundry"],["in","tourism","hotel","alpine_hut","apartment","camp_site","chalet","guest_house","hostel","motel","wilderness_hut","viewpoint"],["in","waterway","waterfall"],["in","natural","peak","cave_entrance","volcano","arch","arete","fumarole","rock","saddle","sinkhole","stone","glacier","spring","hot_spring","geyser"]]'
}

(Just copy the filters as json)

Requires esrun (sudo npm i -g @digitak/esrun)

Patches

NPM updates: use npm-check-updates !

vdv@nuc:~/projects/tea/dyomedea/dyomedea$ npm outdated
Package                                 Current  Wanted  Latest  Location                                             Depended by
@capacitor/android                        4.6.1   4.6.3   4.6.3  node_modules/@capacitor/android                      dyomedea
@capacitor/browser                        4.1.0   4.1.1   4.1.1  node_modules/@capacitor/browser                      dyomedea
@capacitor/cli                            4.6.1   4.6.3   4.6.3  node_modules/@capacitor/cli                          dyomedea
@capacitor/core                           4.6.1   4.6.3   4.6.3  node_modules/@capacitor/core                         dyomedea
@capacitor/ios                            4.6.1   4.6.3   4.6.3  node_modules/@capacitor/ios                          dyomedea
@esbuild-plugins/node-globals-polyfill    0.1.1   0.1.1   0.2.3  node_modules/@esbuild-plugins/node-globals-polyfill  dyomedea
@esbuild-plugins/node-modules-polyfill    0.1.4   0.1.4   0.2.2  node_modules/@esbuild-plugins/node-modules-polyfill  dyomedea
@solid-primitives/i18n                    1.1.2   1.1.3   1.1.3  node_modules/@solid-primitives/i18n                  dyomedea
@solidjs/router                           0.6.0   0.6.0   0.7.0  node_modules/@solidjs/router                         dyomedea
@suid/icons-material                      0.5.5   0.5.8   0.5.8  node_modules/@suid/icons-material                    dyomedea
@suid/material                            0.9.1   0.9.2  0.10.1  node_modules/@suid/material                          dyomedea
jsdom                                    21.0.0  21.1.0  21.1.0  node_modules/jsdom                                   dyomedea
solid-js                                  1.6.9  1.6.10  1.6.10  node_modules/solid-js                                dyomedea
solid-testing-library                     0.5.0   0.5.1   0.5.1  node_modules/solid-testing-library                   dyomedea
typescript                                4.9.4   4.9.5   4.9.5  node_modules/typescript                              dyomedea
vite                                      4.0.4   4.1.1   4.1.1  node_modules/vite                                    dyomedea
vitest                                   0.27.1  0.28.4  0.28.4  node_modules/vitest                                  dyomedea
vdv@nuc:~/projects/tea/dyomedea/dyomedea$ npm-check
npm-check          npm-check-updates  
vdv@nuc:~/projects/tea/dyomedea/dyomedea$ npm-check-updates 
Checking /home/vdv/projects/tea/dyomedea/dyomedea/package.json
[====================] 40/40 100%

 @capacitor/android                        ^4.6.1  →    ^4.6.3
 @capacitor/browser                        ^4.1.0  →    ^4.1.1
 @capacitor/cli                            ^4.6.1  →    ^4.6.3
 @capacitor/core                           ^4.6.1  →    ^4.6.3
 @capacitor/ios                            ^4.6.1  →    ^4.6.3
 @esbuild-plugins/node-globals-polyfill    ^0.1.1  →    ^0.2.3
 @esbuild-plugins/node-modules-polyfill    ^0.1.4  →    ^0.2.2
 @solid-primitives/i18n                    ^1.1.2  →    ^1.1.3
 @solidjs/router                           ^0.6.0  →    ^0.7.0
 @suid/icons-material                      ^0.5.5  →    ^0.5.8
 @suid/material                            ^0.9.1  →   ^0.10.1
 jsdom                                   >=21.0.0  →  >=21.1.0
 solid-js                                  ^1.6.9  →   ^1.6.10
 typescript                                ^4.9.4  →    ^4.9.5
 vite                                     >=4.0.4  →   >=4.1.1
 vitest                                  >=0.27.1  →  >=0.28.4

Run ncu -u to upgrade package.json
vdv@nuc:~/projects/tea/dyomedea/dyomedea$ npm-check-updates -u

   ╭─────────────────────────────────────────────────────────────────────────────────╮
   │                                                                                 │
   │                        Update available 16.4.1 → 16.6.3                         │
   │                    Run npm i -g npm-check-updates to update                     │
   │   https://github.com/raineorshine/npm-check-updates/compare/v16.4.1...v16.6.3   │
   │                                                                                 │
   ╰─────────────────────────────────────────────────────────────────────────────────╯

Upgrading /home/vdv/projects/tea/dyomedea/dyomedea/package.json
[====================] 40/40 100%

 @capacitor/android                        ^4.6.1  →    ^4.6.3
 @capacitor/browser                        ^4.1.0  →    ^4.1.1
 @capacitor/cli                            ^4.6.1  →    ^4.6.3
 @capacitor/core                           ^4.6.1  →    ^4.6.3
 @capacitor/ios                            ^4.6.1  →    ^4.6.3
 @esbuild-plugins/node-globals-polyfill    ^0.1.1  →    ^0.2.3
 @esbuild-plugins/node-modules-polyfill    ^0.1.4  →    ^0.2.2
 @solid-primitives/i18n                    ^1.1.2  →    ^1.1.3
 @solidjs/router                           ^0.6.0  →    ^0.7.0
 @suid/icons-material                      ^0.5.5  →    ^0.5.8
 @suid/material                            ^0.9.1  →   ^0.10.1
 jsdom                                   >=21.0.0  →  >=21.1.0
 solid-js                                  ^1.6.9  →   ^1.6.10
 typescript                                ^4.9.4  →    ^4.9.5
 vite                                     >=4.0.4  →   >=4.1.1
 vitest                                  >=0.27.1  →  >=0.28.4

Run pnpm install to install new versions.
vdv@nuc:~/projects/tea/dyomedea/dyomedea$ sudo npm i -g npm-check-updates 
[sudo] Mot de passe de vdv : 
npm WARN deprecated @npmcli/move-file@2.0.1: This functionality has been moved to @npmcli/fs

added 11 packages, and changed 285 packages in 17s

56 packages are looking for funding
  run `npm fund` for details
vdv@nuc:~/projects/tea/dyomedea/dyomedea$ npm install

> dyomedea-solid@0.0.0 postinstall
> node ./fix-jest-dom.mjs


added 20 packages, removed 2 packages, changed 21 packages, and audited 625 packages in 25s

91 packages are looking for funding
  run `npm fund` for details

2 critical severity vulnerabilities

To address all issues (including breaking changes), run:
  npm audit fix --force

Run `npm audit` for details.
vdv@nuc:~/projects/tea/dyomedea/dyomedea$ npm outdated
Package                Current  Wanted  Latest  Location                            Depended by
solid-testing-library    0.5.0   0.5.1   0.5.1  node_modules/solid-testing-library  dyomedea
vdv@nuc:~/projects/tea/dyomedea/dyomedea$