17 files changed, 112 insertions, 42 deletions

diff --git a/.gitignore b/.gitignore
index 4602e8a..84e6d3f 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,12 +1,21 @@
+# node
+node_modules/
+package-lock.json
+pnpm-lock.yaml
+src/css/easymde.min.css
+
+# output
 dist/
 docs/
+
+# addon
+addon.zip
 addon/**js
+addon/renderers/**js
 addon/**css
 !addon/index**
 !addon/background**
+!addon/src
+
+# others
 doc-coverage/
-node_modules/
-package-lock.json
-pnpm-lock.yaml
-mapclay
-src/css/easymde.min.css
diff --git a/DEVELOPING.md b/DEVELOPING.md
new file mode 100644
index 0000000..687e389
--- /dev/null
+++ b/DEVELOPING.md
@@ -0,0 +1,51 @@
+## Setting up development environment
+
+### Installing dependencies
+
+The minimum requirements are:
+- GNU Bash
+- [GNU Coreutils](https://www.gnu.org/software/coreutils/)
+- Git
+- Node.js (version 16 and above)
+
+To install the project dependencies run
+
+```sh
+# install dependencies
+npm install
+
+# install rollup or use npx
+npm install -g rollup standard
+```
+
+
+## Style guidelines
+
+We use [StandardJS](https://standardjs.com/) with pre-defined ESLint rules to ensure a consistent coding style and catch potential bugs. For checking lint, run
+
+```
+npm run lint
+```
+
+
+## Linking Package
+
+```sh
+# without code minified
+npm build
+
+# with code minified
+PRODUCTION=true npm build
+```
+
+## Firefox Addon
+
+1. To build addon(after `dist/` is generated from `npm build`), run
+
+```sh
+npm run addon
+```
+
+2. Then go to `about:debugging` page in Firfox Browser, then press `This Firefox` for extension page
+
+3. Press `Load Temporary Add-on...`, then select `manifest.json` in `addon/`
diff --git a/README.md b/README.md
index 47d3542..59472d0 100644
--- a/README.md
+++ b/README.md
@@ -2,6 +2,9 @@
 
 This library generate web maps from [Semantic HTML], just play around with [demo page](https://outdoorsafetylab.github.io/dumbymap/)
 
+> [!IMPORTANT]
+> For build steps about firefox addon, please visit `DEVELOPING.md`
+
 > [!CAUTION]
 > DumbyMap is not in production stage. API is not stable now, use it carefully
 
diff --git a/addon/icons/default-0.png b/addon/icons/default-0.png
new file mode 100644
index 0000000..ead58eb
--- /dev/null
+++ b/addon/icons/default-0.png
diff --git a/addon/icons/default-1.png b/addon/icons/default-1.png
new file mode 100644
index 0000000..5d364aa
--- /dev/null
+++ b/addon/icons/default-1.png
diff --git a/addon/icons/default-2.png b/addon/icons/default-2.png
new file mode 100644
index 0000000..260c83f
--- /dev/null
+++ b/addon/icons/default-2.png
diff --git a/addon/icons/default.ico b/addon/icons/default.ico
deleted file mode 100644
index 2ddf495..0000000
--- a/addon/icons/default.ico
+++ /dev/null
diff --git a/addon/index.mjs b/addon/index.js
index dd8fa11..2ce3423 100644
--- a/addon/index.mjs
+++ b/addon/index.js
@@ -23,14 +23,14 @@ const contentSelectors = {
 }
 const contentSelector = contentSelectors[url.host]
 
-const simpleRender = mapclay.renderWith(config => ({
+const simpleRender = globalThis.renderWith(config => ({
   use: use ?? 'Leaflet',
   width: '100%',
   height: '200px',
   XYZ: 'https://tile.openstreetmap.jp/styles/osm-bright/512/{z}/{x}/{y}.png',
   ...config,
   aliases: {
-    use: mapclay.renderers,
+    use: globalThis.mapclayRenderer,
     ...(config.aliases ?? {}),
   },
 }))
@@ -42,7 +42,7 @@ browser.runtime.onMessage.addListener((message, sender, sendResponse) => {
   console.log('receive message', message)
   sendResponse('received')
   if (message.id === 'map-inline-add') {
-    generateMaps(container, {
+    globalThis.generateMaps(container, {
       crs: url.searchParams.get('crs') ?? 'EPSG:4326',
       render: simpleRender,
     })
diff --git a/addon/manifest.json b/addon/manifest.json
index e7bcbcf..92baf30 100644
--- a/addon/manifest.json
+++ b/addon/manifest.json
@@ -1,12 +1,14 @@
 {
   "manifest_version": 2,
-  "name": "DumbyMap",
+  "name": "MapInline",
   "version": "1.0",
 
-  "description": "Add interatctive Map",
+  "description": "Add Interatctive Map",
 
   "icons": {
-    "48": "icons/default.ico"
+    "16": "icons/default-0.png",
+    "32": "icons/default-1.png",
+    "48": "icons/default-2.png"
   },
 
   "browser_action": {
@@ -22,8 +24,11 @@
         "https://prosemirror.net/examples/*"
       ],
       "js": [
-        "dumbymap.mjs",
-        "index.mjs"
+        "renderers/leaflet.js",
+        "renderers/maplibre.js",
+        "renderers/openlayers.js",
+        "dumbymap.js",
+        "index.js"
       ],
       "css": [
         "css/dumbymap.css"
diff --git a/addon/src/dumbymap.mjs b/addon/src/dumbymap.mjs
new file mode 100644
index 0000000..07af342
--- /dev/null
+++ b/addon/src/dumbymap.mjs
@@ -0,0 +1,5 @@
+import { generateMaps } from '../../dist/dumbymap.mjs'
+import { renderWith } from '../../node_modules/mapclay/dist/mapclay.mjs'
+
+globalThis.generateMaps = generateMaps
+globalThis.renderWith = renderWith
diff --git a/addon/src/renderers/leaflet.mjs b/addon/src/renderers/leaflet.mjs
new file mode 100644
index 0000000..8e056f9
--- /dev/null
+++ b/addon/src/renderers/leaflet.mjs
@@ -0,0 +1,4 @@
+import { default as Leaflet } from '../../../node_modules/mapclay/dist/renderers/leaflet.mjs'
+
+if (!globalThis.mapclayRenderers) globalThis.mapclayRenderers = {}
+globalThis.mapclayRenderers.Leaflet = Leaflet
diff --git a/addon/src/renderers/maplibre.mjs b/addon/src/renderers/maplibre.mjs
new file mode 100644
index 0000000..753af86
--- /dev/null
+++ b/addon/src/renderers/maplibre.mjs
@@ -0,0 +1,4 @@
+import { default as Maplibre } from '../../../node_modules/mapclay/dist/renderers/maplibre.mjs'
+
+if (!globalThis.mapclayRenderers) globalThis.mapclayRenderers = {}
+globalThis.mapclayRenderers.Maplibre = Maplibre
diff --git a/addon/src/renderers/openlayers.mjs b/addon/src/renderers/openlayers.mjs
new file mode 100644
index 0000000..2c42757
--- /dev/null
+++ b/addon/src/renderers/openlayers.mjs
@@ -0,0 +1,4 @@
+import { default as Openlayers } from '../../../node_modules/mapclay/dist/renderers/openlayers.mjs'
+
+if (!globalThis.mapclayRenderers) globalThis.mapclayRenderers = {}
+globalThis.mapclayRenderers.Openlayers = Openlayers
diff --git a/package.json b/package.json
index 28661da..a137ca1 100644
--- a/package.json
+++ b/package.json
@@ -26,7 +26,8 @@
     "style": "scripts/stylelint.sh",
     "docs": "jsdoc -c scripts/jsdoc.conf src/; xdg-open http://localhost:8080/docs/",
     "prepack": "npm run lint && npm run style && npm run build",
-    "addon": "mkdir -p addon/css; cp src/css/dumbymap.css addon/css; ADDON=true rollup -c scripts/rollup.config.js --watch",
+    "addon": "scripts/addon.sh",
+    "addon.zip": "cd addon; zip -r ../addon.zip *",
     "dev-addon": "web-ext run -s addon"
   },
   "devDependencies": {
diff --git a/scripts/addon.sh b/scripts/addon.sh
new file mode 100755
index 0000000..3b7bf3b
--- /dev/null
+++ b/scripts/addon.sh
@@ -0,0 +1,9 @@
+#! /bin/bash
+
+mkdir -p addon/css
+ln -f src/css/dumbymap.css addon/css/dumbymap.css
+
+mkdir -p addon/renderers/
+rollup addon/src/renderers/* --dir addon/renderers
+
+rollup addon/src/dumbymap.mjs --file addon/dumbymap.js
diff --git a/scripts/rollup.config.js b/scripts/rollup.config.js
index 547260b..b3a6139 100644
--- a/scripts/rollup.config.js
+++ b/scripts/rollup.config.js
@@ -6,7 +6,7 @@ import { join } from 'path'
 import { bundleStats } from 'rollup-plugin-bundle-stats'
 
 const prod = process.env.PRODUCTION
-const addon = process.env.ADDON
+const watch = process.env.ROLLUP_WATCH
 
 function resolve (file, origin) {
   // Your way to resolve local include path
@@ -79,31 +79,6 @@ export default [
 ]
   .map(config => ({ ...general, ...config }))
   .filter(config => {
-    if (addon) return config.input.match(/dumbymap/)
-    if (!prod) return config.input.match(/editor/)
+    if (watch) return config.input.match(/editor/)
     return true
   })
-  .map(config => {
-    if (!addon) return config
-
-    config.output.forEach(o => { o.dir = './addon' })
-    config.plugins.push({
-      name: 'remove-exports',
-      transform (code, id) {
-        if (id.includes(config.input)) {
-          // remove export keyword for addon
-          const transformedCode = code.replace(/\n(\s*)export\s*/g, '$1')
-          return {
-            code: [
-              transformedCode,
-              'globalThis.generateMaps = generateMaps',
-              'globalThis.mapclay = mapclay',
-            ].join('\n'),
-          }
-        }
-        return null
-      },
-    })
-
-    return config
-  })
diff --git a/src/dumbyUtils.mjs b/src/dumbyUtils.mjs
index 8110e82..975833b 100644
--- a/src/dumbyUtils.mjs
+++ b/src/dumbyUtils.mjs
@@ -144,7 +144,7 @@ export const addGeoSchemeByText = async (node) => {
 
     // Return anchor element with Geo Scheme
     const a = document.createElement('a')
-    a.className = 'not-geolink from-geocoding'
+    a.className = 'not-geolink from-text'
     a.href = `geo:0,0?xy=${x},${y}`
     a.textContent = match.at(0)
     return a