From 184b3004d82806f1b31c94701e75585fb8f2721b Mon Sep 17 00:00:00 2001
From: Hsieh Chin Fan <pham@topo.tw>
Date: Fri, 11 Oct 2024 15:01:40 +0800
Subject: feat: implement crs in GeoLink

Now GeoLink has the following format:

geo:<LON>,<LAT>?q=<LON>,<LAT>&xy=<x,y>,crs=<EPSG:CODE>

When calling addMarker or updateCamera, only use [lon,lat] format
---
 src/dumbymap.mjs | 42 ++++++++++++++++++++++++++++++++++++------
 1 file changed, 36 insertions(+), 6 deletions(-)

(limited to 'src/dumbymap.mjs')

diff --git a/src/dumbymap.mjs b/src/dumbymap.mjs
index 593875e..6602f29 100644
--- a/src/dumbymap.mjs
+++ b/src/dumbymap.mjs
@@ -9,6 +9,8 @@ import { Layout, SideBySide, Overlay } from './Layout'
 import * as utils from './dumbyUtils'
 import * as menuItem from './MenuItem'
 import PlainModal from 'plain-modal'
+import proj4 from 'proj4'
+import { register, fromEPSGCode } from 'ol/proj/proj4'
 
 /** Selector of special HTML Elements */
 const mapBlockSelector = 'pre:has(.language-map)'
@@ -59,8 +61,8 @@ export const markdown2HTML = (container, mdContent) => {
     validate: coordinateRegex,
     normalize: function (match) {
       const [, , x, sep, y] = match.text.match(coordinateRegex)
-      match.url = `geo:${y},${x}?xy=${x},${y}`
-      match.text = `${x}${sep} ${y}`
+      match.url = `geo:${y},${x}`
+      match.text = `${x}${sep}${y}`
       match.index += match.text.indexOf(x) + 1
       return match
     },
@@ -165,15 +167,43 @@ export const generateMaps = (container, {
       switchToNextLayout: throttle(utils.switchToNextLayout, 300),
     },
   }
-  Object.entries(dumbymap.utils).forEach(([util, func]) => {
-    dumbymap.utils[util] = func.bind(dumbymap)
+  Object.entries(dumbymap.utils).forEach(([util, value]) => {
+    if (typeof value === 'function') {
+      dumbymap.utils[util] = value.bind(dumbymap)
+    }
   })
 
   /** Create GeoLinks and DocLinks */
   container.querySelectorAll(docLinkSelector)
     .forEach(utils.createDocLink)
-  container.querySelectorAll(geoLinkSelector)
-    .forEach(utils.createGeoLink)
+
+  /** Set CRS and GeoLinks */
+  register(proj4)
+  fromEPSGCode(crs).then(() => {
+    const transform = proj4(crs, 'EPSG:4326').forward
+
+    Array.from(container.querySelectorAll(geoLinkSelector))
+      .map(link => {
+        // set coordinate as lat/lon in WGS84
+        const params = new URLSearchParams(link.search)
+        const [y, x] = link.href
+          .match(utils.coordPattern)
+          .splice(1)
+          .map(Number)
+        const [lon, lat] = transform([x, y])
+          .map(value => value.toFixed(6))
+        link.href = `geo:${lat},${lon}`
+
+        // set query strings
+        params.set('xy', `${x},${y}`)
+        params.set('crs', crs)
+        params.set('q', `${lat},${lon}`)
+        link.search = params
+
+        return link
+      })
+      .forEach(utils.createGeoLink)
+  })
 
   /**
    * mapFocusObserver. observe for map focus
-- 
cgit v1.2.3-70-g09d2