[JavaScript] Remove mainLizmap from Tooltip module

3liz · Jan 20, 2025 · 8dc5a03 · 8dc5a03
1 parent 56c0046
commit 8dc5a03
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 15 deletions.
diff --git a/assets/src/modules/Lizmap.js b/assets/src/modules/Lizmap.js
@@ -167,7 +167,7 @@ export default class Lizmap {
                 this.popup = new Popup(this.initialConfig, this.state, this.map, this.digitizing);
                 this.legend = new Legend(this.state.layerTree);
                 this.search = new Search(this.map, this.lizmap3);
-                this.tooltip = new Tooltip();
+                this.tooltip = new Tooltip(this.map, this.initialConfig.tooltipLayers, this.lizmap3);
                 this.locateByLayer = new LocateByLayer(
                     this.initialConfig.locateByLayer,
                     this.initialConfig.vectorLayerFeatureTypeList,

diff --git a/assets/src/modules/Tooltip.js b/assets/src/modules/Tooltip.js
@@ -4,7 +4,8 @@
  * @copyright 2024 3Liz
  * @license MPL-2.0
  */
-import { mainLizmap, mainEventDispatcher } from '../modules/Globals.js';
+import { mainEventDispatcher } from '../modules/Globals.js';
+import { TooltipLayersConfig } from './config/Tooltip.js';
 import GeoJSON from 'ol/format/GeoJSON.js';
 import VectorLayer from 'ol/layer/Vector.js';
 import VectorSource from 'ol/source/Vector.js';
@@ -16,14 +17,23 @@ import { Circle, Fill, Stroke, Style } from 'ol/style.js';
  */
 export default class Tooltip {
 
-    constructor() {
+    /**
+     * Create the tooltip Map
+     * @param {Map}        map        - OpenLayers map
+     * @param {TooltipLayersConfig} tooltipLayersConfig - The config tooltipLayers
+     * @param {object}        lizmap3       - The old lizmap object
+     */
+    constructor(map, tooltipLayersConfig, lizmap3) {
+        this._map = map;
+        this._tooltipLayersConfig = tooltipLayersConfig;
+        this._lizmap3 = lizmap3;
         this._activeTooltipLayer;
         this._tooltipLayers = new Map();
     }
 
     /**
      * Activate tooltip for a layer order
-     * @param {number} layerOrder
+     * @param {number} layerOrder a layer order
      */
     activate(layerOrder) {
         if (layerOrder === "") {
@@ -32,9 +42,9 @@ export default class Tooltip {
         }
 
         // Remove previous layer if any
-        mainLizmap.map.removeLayer(this._activeTooltipLayer);
+        this._map.removeLayer(this._activeTooltipLayer);
 
-        const layerTooltipCfg = mainLizmap.initialConfig.tooltipLayers.layerConfigs[layerOrder];
+        const layerTooltipCfg = this._tooltipLayersConfig.layerConfigs[layerOrder];
         const layerName = layerTooltipCfg.name;
         const tooltipLayer = this._tooltipLayers.get(layerName);
         this._displayGeom = layerTooltipCfg.displayGeom;
@@ -115,7 +125,7 @@ export default class Tooltip {
             });
 
             this._activeTooltipLayer.getSource().on('featuresloaderror', () => {
-                lizMap.addMessage(lizDict['tooltip.loading.error'], 'danger', true);
+                this._lizmap3.addMessage(lizDict['tooltip.loading.error'], 'danger', true);
                 console.warn(`Tooltip layer '${layerName}' could not be loaded.`);
             });
 
@@ -124,14 +134,14 @@ export default class Tooltip {
             this._tooltipLayers.set(layerName, this._activeTooltipLayer);
         }
 
-        mainLizmap.map.addToolLayer(this._activeTooltipLayer);
+        this._map.addToolLayer(this._activeTooltipLayer);
 
         const tooltip = document.getElementById('tooltip');
 
         let currentFeature;
 
         this._onPointerMove = event => {
-            const pixel = mainLizmap.map.getEventPixel(event.originalEvent);
+            const pixel = this._map.getEventPixel(event.originalEvent);
             const target = event.originalEvent.target;
 
             if (currentFeature) {
@@ -146,7 +156,7 @@ export default class Tooltip {
 
             const feature = target.closest('.ol-control')
                 ? undefined
-                : mainLizmap.map.forEachFeatureAtPixel(pixel, feature => {
+                : this._map.forEachFeatureAtPixel(pixel, feature => {
                     return feature; // returning a truthy value stop detection
                 }, {
                     hitTolerance: 5,
@@ -173,26 +183,26 @@ export default class Tooltip {
             currentFeature = feature;
         };
 
-        mainLizmap.map.on('pointermove', this._onPointerMove);
+        this._map.on('pointermove', this._onPointerMove);
 
         this._onPointerLeave = () => {
             currentFeature = undefined;
             tooltip.style.visibility = 'hidden';
         };
 
-        mainLizmap.map.getTargetElement().addEventListener('pointerleave', this._onPointerLeave);
+        this._map.getTargetElement().addEventListener('pointerleave', this._onPointerLeave);
     }
 
     /**
      * Deactivate tooltip
      */
     deactivate() {
-        mainLizmap.map.removeLayer(this._activeTooltipLayer);
+        this._map.removeLayer(this._activeTooltipLayer);
         if (this._onPointerMove) {
-            mainLizmap.map.un('pointermove', this._onPointerMove);
+            this._map.un('pointermove', this._onPointerMove);
         }
         if (this._onPointerLeave) {
-            mainLizmap.map.getTargetElement().removeEventListener('pointerleave', this._onPointerLeave);
+            this._map.getTargetElement().removeEventListener('pointerleave', this._onPointerLeave);
         }
     }
 }