diff options
| author | Camil Staps | 2026-02-02 18:38:26 +0100 |
|---|---|---|
| committer | Camil Staps | 2026-02-02 18:38:26 +0100 |
| commit | 4029b88e2c79eaed519c829e373ac916f426f311 (patch) | |
| tree | 617fd189c60a5e80b61b417c1c77c154ae1bd149 /main.js | |
Diffstat (limited to 'main.js')
| -rw-r--r-- | main.js | 188 |
1 files changed, 188 insertions, 0 deletions
@@ -0,0 +1,188 @@ +import { buildGPX } from 'gpx-builder'; +import { OsmAndBuilder } from './OsmAndBuilder/index.ts'; +const { Link, Point } = OsmAndBuilder.MODELS; + +// icons from https://github.com/osmandapp/OsmAnd-resources/tree/master/icons +const ICONS_MAPPING = { + 'src/images/appel22.png': 'shop_greengrocer', + 'src/images/braamboos22.png': 'scrub', + 'src/images/fruit22groen.png': 'vineyard', + 'src/images/garnaal22groen.png': 'reef', // or shop_seafood + 'src/images/noten22groen.png': 'nuts', + 'src/images/overig22groen.png': 'village_green', + 'src/images/paddo22.png': 'military_nuclear_explosion_site', + 'src/images/paddo22groen.png': 'military_nuclear_explosion_site', + 'src/images/peer22.png': 'shop_greengrocer', + 'src/images/planten22groen.png': 'cannabis', // or herbalist + 'src/images/schelp22.png': 'reef', // or shop_seafood + 'src/images/walnoot22.png': 'nuts', +}; +const COLOR_MAPPING_GROUPS = { + 'src/images/garnaal22groen.png': '#f55a52', + 'src/images/noten22groen.png': '#c89760', + 'src/images/overig22groen.png': '#888888', + 'src/images/paddo22.png': '#e2b973', + 'src/images/paddo22groen.png': '#e2b973', + 'src/images/planten22groen.png': '#72a35a', + 'src/images/schelp22.png': '#f55a52', + 'src/images/walnoot22.png': '#c89760', +}; +const COLOR_MAPPING_NAMES = { + 'aalbes': '#da3939', + 'aardbei': '#cf0e08', + 'Amerikaanse_kornoelje': '#e8e9e5', + 'appel': '#da233d', + 'bosbes': '#5a637f', + 'braam': '#060910', + 'druif': '#95b2e2', + 'duindoorn': '#f08916', + 'framboos': '#e53351', + 'gele_kornoelje': '#dfc428', + 'Japanse_Kornoelje': '#dee0e5', + 'jeverbes': '#5f7b98', + 'kers': '#853149', + 'kiwi': '#8bbb2b', + 'krentenboom': '#6d659a', + 'lampionplant': '#f59317', + 'Lijsterbes': '#f35436', + 'linde': '#a0d031', + 'mirabellen': '#e0b630', + 'mispel': '#c76f42', + 'Moerbei': '#19172b', + 'papiermoerbei': '#e12f20', + 'peer': '#b6bd33', + 'pruim': '#955e87', + 'rode_bes': '#da3939', + 'rozenbottel': '#ea1b31', + 'sleedoorn': '#7e93bf', + 'vijg': '#7b6178', + 'vlierbes': '#0e0d12', + 'vossenbes': '#f21900', +}; + +let icons = {}; +let colors = {}; + +fetch('https://app.wildplukwijzer.nl/leafle.js') + .then(response => { + if (!response.ok) + throw new Error (`Failed to retrieve Wildplukwijzer data (${response.status})`); + return response.text(); + }) + .then(response => { + response = response + .split('\n') + .filter(line => line.match(/ = new markerIcon/)) + .map(line => line + .replace(/^(var )?icon_/, 'icons[\'') + .replace(' = new markerIcon({ iconUrl: ', '\'] = ') + .replace(' })', '')) + .join('\n'); + eval(response); + for (let k in icons) { + colors[k] = k in COLOR_MAPPING_NAMES ? COLOR_MAPPING_NAMES[k] : COLOR_MAPPING_GROUPS[icons[k]]; + icons[k] = ICONS_MAPPING[icons[k]]; + } + }).then(() => +fetch('https://app.wildplukwijzer.nl/?hideheader=true')) + .then(response => { + if (!response.ok) + throw new Error (`Failed to retrieve Wildplukwijzer data (${response.status})`); + return response.text(); + }) + .then(response => { + // Extract the relevant JavaScript code from the response + response = response.split('\n'); + let line = null; + do line = response.shift(); while (!line.match(/let AllMarkers = /)); + + // A Leaflet shim with the functions expected by the code we'll extract + let L = { + layerGroup: () => [], + marker: (latlng, settings) => { + if (!settings.icon) + throw new Error(`unknown icon ${settings.icon}`); + let obj = { + lat: latlng[0], + lng: latlng[1], + icon: settings.icon, + }; + obj.addTo = function (soort) { + soort = soort.replace(/ /g, '_'); + if (!(soort in colors)) + throw new Error(`${soort} not in colors`); + obj.color = colors[soort]; + return obj; + }; + obj.bindPopup = function (desc, settings) { + obj.name = desc + .replace(/^.*<h1>(.*)<\/h1>.*$/s, '$1') + .replace(/^./, c => c.toUpperCase()) + .replace(/_/g, ' '); + + obj.type = obj.name; + + obj.img = desc + .replace(/^.*<img src="(.*?)".*$/s, 'http://app.wildplukwijzer.nl/$1'); + + desc = desc + .replace(/.*<\/h1>/s, '') + .replace('<h3>Informatie over de plukplek</h3><p></p>', '') + .replace(/<img src="/g, '<img width="100%" src="http://app.wildplukwijzer.nl/') + .replace(/<h3>/g, '<b>').replace(/<\/h3>/g, ':</b>\n') + .replace(/<\/?div[^>]*>/g, '') + .replace(/ /g, ' ') + .replace(/á/g, 'á').replace(/à/, 'à').replace(/ä/g, 'ä') + .replace(/é/g, 'é').replace(/è/, 'è').replace(/ë/g, 'ë') + .replace(/í/g, 'í').replace(/ì/, 'ì').replace(/ï/g, 'ï') + .trim(); + obj.desc = desc; + return obj; + }; + return obj; + } + }; + let AllMarkers = []; + let SoortObject = {}; + + // In setup we create a list of species in SoortObject; each of these also + // needs an icon in the global namespace. + let setup = line.replace('<script>let AllMarkers = [];let SoortObject = {};', ''); + eval(setup); + + // The remainder of this script adds the markers (finding places). We are + // not interested in the click event code, it is the same for each marker. + let markers = []; + line = response.shift(); + while (!line.match(/<\/script>/)) { + markers.push(line + .replace(/icon_(\w*)/, 'icons[\'$1\']') + .replace(/SoortObject\[('[^']*')\]/, '$1')); + line = response.shift(); + } + markers = markers + .join('\n') + .replace(/\.on\('click'.*?\n\s*\)/gs, ''); + eval(markers); + //console.log(AllMarkers); + + // Create waypoints for the markers + let points = []; + AllMarkers.map((m) => { + points.push(new Point(m.lat, m.lng, + { + desc: m.desc, + name: m.name, + type: m.type, + src: 'Wildplukwijzer', + link: new Link(m.img), + icon: m.icon, + color: m.color, + })); + }); + + // Create the GPX + const gpxData = new OsmAndBuilder(); + gpxData.setWayPoints(points); + console.log(buildGPX(gpxData.toObject())); + }); |
