@abi-software/flatmap-viewer 2.6.0-a.1 → 2.6.1

package/README.rst

@@ -26,7 +26,7 @@ Running
 
 ::
 
-    $ npm run dev
+    $ npm start
 
 Maps can then be viewed at http://localhost:3000
 
@@ -38,7 +38,7 @@ The map server endpoint is specified as ``MAP_ENDPOINT`` in ``src/main.js``. It
 Package Installation
 ====================
 
-* ``npm install @abi-software/flatmap-viewer@2.5.9``
+* ``npm install @abi-software/flatmap-viewer@2.6.1``
 
 Documentation
 -------------

package/package.json

@@ -1,30 +1,29 @@
 {
   "name": "@abi-software/flatmap-viewer",
-  "version": "2.6.0-a.1",
+  "version": "2.6.1",
   "description": "Flatmap viewer using Maplibre GL",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/AnatomicMaps/flatmap-viewer.git"
   },
   "main": "src/main.js",
-  "type": "module",
   "files": [
     "src",
     "static"
   ],
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",
-    "dev": "vite serve app --port 3000",
-    "build": "tsc && vite build",
-    "preview": "vite preview",
+    "start": "node app",
+    "build": "webpack --mode production",
     "docs": "cd docs; poetry run make html"
   },
   "author": "David Brooks",
   "license": "MIT",
   "dependencies": {
-    "@deck.gl/core": "^8.9.33",
-    "@deck.gl/layers": "^8.9.33",
-    "@deck.gl/mapbox": "^8.9.33",
+    "@babel/runtime": "^7.10.4",
+    "@deck.gl/core": "^8.9.35",
+    "@deck.gl/layers": "^8.9.35",
+    "@deck.gl/mapbox": "^8.9.35",
     "@mapbox/mapbox-gl-draw": "^1.4.3",
     "@turf/area": "^6.5.0",
     "@turf/bbox": "^6.5.0",
@@ -32,6 +31,7 @@
     "@turf/projection": "^6.5.0",
     "bezier-js": "^6.1.0",
     "colord": "^2.9.3",
+    "core-js-pure": "^3.36.1",
     "html-es6cape": "^2.0.2",
     "maplibre-gl": ">=3.6.0",
     "mathjax-full": "^3.2.2",
@@ -39,8 +39,22 @@
     "polylabel": "^1.1.0"
   },
   "devDependencies": {
+    "@babel/core": "^7.5.5",
+    "@babel/plugin-transform-runtime": "^7.5.5",
+    "@babel/preset-env": "^7.10.4",
+    "babel-loader": "^8.1.0",
+    "browser-sync": "^2.26.7",
+    "bs-fullscreen-message": "^1.1.0",
+    "clean-webpack-plugin": "^3.0.0",
+    "css-loader": "^6.7.3",
     "eslint": "^8.7.0",
-    "typescript": "^5.2.2",
-    "vite": "^5.1.4"
+    "express": "^4.17.1",
+    "html-webpack-plugin": "^4.5.2",
+    "strip-ansi": "^7.0.1",
+    "style-loader": "^3.3.2",
+    "webpack": "^5.16.0",
+    "webpack-cli": "^4.4.0",
+    "webpack-dev-middleware": "^4.1.0",
+    "webpack-node-externals": "^1.7.2"
   }
 }

package/src/controls/annotation.js

@@ -41,9 +41,10 @@ limitations under the License.
 
 //==============================================================================
 
-import MapboxDraw from "@mapbox/mapbox-gl-draw/dist/mapbox-gl-draw-unminified.js"
+import MapboxDraw from "@mapbox/mapbox-gl-draw"
 import '@mapbox/mapbox-gl-draw/dist/mapbox-gl-draw.css'
 
+
 //==============================================================================
 
 const drawStyleIds = MapboxDraw.lib.theme.map(s => s.id)
@@ -100,6 +101,7 @@ export class AnnotationDrawControl
         map.on('draw.create', this.createdFeature.bind(this))
         map.on('draw.delete', this.deletedFeature.bind(this))
         map.on('draw.update', this.updatedFeature.bind(this))
+        map.on('draw.selectionchange', this.selectionChangedEvent.bind(this))
         this.show(this.__visible)
         return this.__container
     }
@@ -189,6 +191,8 @@ export class AnnotationDrawControl
     {
         const feature = this.#cleanFeature(event)
         if (feature) {
+            // specify updated callback type, either `move` or `change_coordinates`
+            feature.action = event.action
             if (this.__uncommittedFeatureIds.has(feature.id)) {
                 // Ignore updates on an uncommitted create or update
             } else {
@@ -205,6 +209,13 @@ export class AnnotationDrawControl
         this.#sendEvent('modeChanged', event)
     }
 
+    selectionChangedEvent(event)
+    //==========================
+    {
+        // Used to indicate a feature is selected or deselected
+        this.#sendEvent('selectionChanged', event)
+    }
+
     inDrawingMode()
     //=============
     {
@@ -221,8 +232,6 @@ export class AnnotationDrawControl
             this.__committedFeatures.set(feature.id, feature)
         }
         this.__uncommittedFeatureIds.delete(feature.id)
-this.__flatmap.showPopup(feature.id, '<div>committed</div>')
-
     }
 
     abortEvent(event)
@@ -255,12 +264,18 @@ this.__flatmap.showPopup(feature.id, '<div>committed</div>')
         }
     }
     
-    clearFeature()
-    //============
+    clearFeatures()
+    //=============
     {
         this.__draw.deleteAll()
     }
 
+    removeFeature()
+    //=============
+    {
+        this.__draw.trash()
+    }
+
     addFeature(feature)
     //=================
     {
@@ -270,15 +285,17 @@ this.__flatmap.showPopup(feature.id, '<div>committed</div>')
         this.__uncommittedFeatureIds.delete(ids[0])
     }
 
-    getFeature(featureId)
-    //===================
+    refreshGeometry(feature)
+    //======================
     {
-        return this.__draw.get(featureId) || null
+        return this.__draw.get(feature.id) || null
     }
 
-    selectFeature(featureId)
-    //======================
+    changeMode(type)
+    //===============
     {
+        // Change the mode directly without listening to modes callback
+        this.__draw.changeMode(type.mode, type.options)
     }
 }
 

package/src/flatmap-viewer.js

@@ -436,6 +436,21 @@ class FlatMap
         return this.__uuid;
     }
 
+    /**
+     * The map's URL on the map server.
+     *
+     * @type string
+     */
+    get url()
+    //========
+    {
+        let url = this.makeServerUrl('')
+        if (url.endsWith('/')) {
+            return url.substring(0, url.length - 1)
+        }
+        return url
+    }
+
     /**
      * The map's ``index.json`` as returned from the map server.
      *
@@ -598,7 +613,7 @@ class FlatMap
     //=====================
     {
         if (this._userInteractions !== null) {
-            return new [...this._userInteractions.pathModelNodes(modelId)]
+            return [...this._userInteractions.pathModelNodes(modelId)]
         }
     }
 
@@ -1025,7 +1040,11 @@ class FlatMap
             'models',
             'source',
             'taxons',
-            'hyperlinks'
+            'hyperlinks',
+            'completeness',
+            'missing-nodes',
+            'alert',
+            'biological-sex'
         ];
         const jsonProperties = [
             'hyperlinks'
@@ -1118,7 +1137,18 @@ class FlatMap
     //======================
     {
         if (this._userInteractions) {
-            this._userInteractions.clearAnnotationFeature()
+            this._userInteractions.clearAnnotationFeatures()
+        }
+    }
+
+    /**
+     * Delete the selected drawn feature
+     */
+    removeAnnotationFeature()
+    //=======================
+    {
+        if (this._userInteractions) {
+            this._userInteractions.removeAnnotationFeature()
         }
     }
 
@@ -1155,6 +1185,24 @@ class FlatMap
         }
     }
 
+    /**
+     * Changes draw to another mode. The mode argument must be one of the following:
+     * `simple_select`, `direct_select`, `draw_line_string`,
+     * `draw_polygon` or `draw_point`. Options is accepted in first three modes.
+     * More details in mapbox-gl-draw github repository.
+     *
+     * @param type      {Object}     The object 
+     * @param type.mode {string}     Either ``simple_select``, ``direct_select``, etc
+     * @param type.options {Object}  Feature id(s) object.
+     */
+    changeAnnotationDrawMode(type)
+    //============================
+    {
+        if (this._userInteractions) {
+            this._userInteractions.changeAnnotationDrawMode(type)
+        }
+    }
+
     /**
      * Generate a callback as a result of some event with a flatmap feature.
      *