feat: allow the new layer group

infra-geo-ouverte · Feb 3, 2025 · 203738c · 203738c
1 parent b649674
commit 203738c
Show file tree

Hide file tree

Showing 10 changed files with 4,012 additions and 2,547 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/src/app/pages/portal/portal.component.html b/src/app/pages/portal/portal.component.html
@@ -71,7 +71,9 @@
       [map]="map"
       [igoContextMenu]="contextMenu"
       (menuPosition)="onContextMenuOpen($event)"
-      [ngClass]="{ 'igo-attribution-offset': map.getBaseLayers().length > 1 }"
+      [ngClass]="{
+        'igo-attribution-offset': map.layerController.baseLayers.length > 1
+      }"
       [@mapStateX]="sidenavOpened ? 'right' : 'left'"
       (@mapStateX.start)="updateMapBrowserClass()"
       [@mapStateY]="getControlsOffsetY()"

diff --git a/src/app/pages/portal/portal.component.ts b/src/app/pages/portal/portal.component.ts
@@ -1613,7 +1613,7 @@ export class PortalComponent implements OnInit, OnDestroy {
           sourceOptions
         })
         .subscribe((l) => {
-          this.map.addLayer(l);
+          this.map.layerController.add(l);
         })
     );
   }

diff --git a/src/app/pages/portal/sidenav/sidenav.component.ts b/src/app/pages/portal/sidenav/sidenav.component.ts
@@ -18,7 +18,7 @@ import { IgoInteractiveTourModule } from '@igo2/common/interactive-tour';
 import { PanelComponent } from '@igo2/common/panel';
 import { Tool, Toolbox, ToolboxComponent } from '@igo2/common/tool';
 import { ConfigService } from '@igo2/core/config';
-import { IgoMap } from '@igo2/geo';
+import { IgoMap, isLayerItem } from '@igo2/geo';
 import { CatalogState, ToolState } from '@igo2/integration';
 
 import { TranslateModule } from '@ngx-translate/core';
@@ -103,8 +103,11 @@ export class SidenavComponent implements OnInit, OnDestroy {
           tool.name === 'activeTimeFilter' ||
           tool.name === 'activeOgcFilter'
         ) {
-          for (const layer of this.map.layers) {
-            if (layer.options.active === true) {
+          for (const layer of this.map.layerController.layersFlattened) {
+            if (
+              isLayerItem(layer) &&
+              this.map.layerController.isSelected(layer)
+            ) {
               this.title$.next(layer.title);
             }
           }

diff --git a/src/app/pages/portal/toast-panel/toast-panel.component.ts b/src/app/pages/portal/toast-panel/toast-panel.component.ts
@@ -38,7 +38,6 @@ import {
   FeatureMotion,
   GeoServiceDefinition,
   IgoMap,
-  Layer,
   LayerService,
   PropertyTypeDetectorService,
   SearchResult,
@@ -515,7 +514,7 @@ export class ToastPanelComponent implements OnInit, OnDestroy {
     this.computeFeatureGeoServiceStatus();
     combineLatest([
       this.resultSelected$,
-      this.map.layers$ as BehaviorSubject<Layer[]>
+      this.map.layerController.layers$
     ]).subscribe(() => {
       this.computeFeatureGeoServiceStatus();
     });
@@ -802,25 +801,27 @@ export class ToastPanelComponent implements OnInit, OnDestroy {
   }
 
   handleLayer() {
-    const layersIds = this.map.layers.map((layer) => layer.id);
+    const layersIds = this.map.layerController.all.map((layer) => layer.id);
     let potententialLayerToAdd = this.potententialLayerToAdd$.getValue();
     if (!potententialLayerToAdd) {
       this.computeFeatureGeoServiceStatus();
     }
     potententialLayerToAdd = this.potententialLayerToAdd$.getValue();
 
     if (layersIds.includes(potententialLayerToAdd.id)) {
-      const layerToRemove = this.map.getLayerById(potententialLayerToAdd.id);
+      const layerToRemove = this.map.layerController.getById(
+        potententialLayerToAdd.id
+      );
       if (layerToRemove) {
-        this.map.removeLayer(layerToRemove);
+        this.map.layerController.remove(layerToRemove);
         this.potententialLayerisAdded$.next(false);
       }
     } else {
       this.layerService
         .createAsyncLayer(potententialLayerToAdd.sourceOptions)
         .subscribe((layer) => {
           this.map.layersAddedByClick$.next([layer]);
-          this.map.addLayer(layer);
+          this.map.layerController.add(layer);
           this.potententialLayerisAdded$.next(true);
         });
     }
@@ -840,7 +841,7 @@ export class ToastPanelComponent implements OnInit, OnDestroy {
       );
       const soId = generateIdFromSourceOptions(so.sourceOptions);
       this.potententialLayerToAdd$.next({ id: soId, sourceOptions: so });
-      const layersIds = this.map.layers.map((l) => l.id);
+      const layersIds = this.map.layerController.all.map((l) => l.id);
       this.potententialLayerisAdded$.next(
         layersIds.includes(soId) ? true : false
       );

diff --git a/src/contexts/_contexts.json b/src/contexts/_contexts.json
@@ -58,5 +58,9 @@
   {
     "uri": "keepCurrentViewFalse",
     "title": "Un contexte qui impose sa vue"
+  },
+  {
+    "uri": "layerGroup",
+    "title": "Group de couche"
   }
 ]
diff --git a/src/contexts/layerGroup.json b/src/contexts/layerGroup.json
@@ -0,0 +1,133 @@
+{
+  "uri": "_default",
+  "title": "Group de couche",
+  "base": "_base",
+  "layers": [
+    {
+      "id": 64,
+      "title": "Imagerie",
+      "baseLayer": true,
+      "sourceOptions": {
+        "type": "xyz",
+        "url": "/carto/tms/1.0.0/orthos@EPSG_3857/{z}/{x}/{-y}.jpeg",
+        "optionsFromCapabilities": true,
+        "maxZoom": 19,
+        "attributions": "  © <a href='http://www.droitauteur.gouv.qc.ca/copyright.php'  target='_blank'><img src='/igo2/portail/particular/images/logo_qc.svg' width='66' height='20'>Gouvernement du Québec</a> /  Fondé sur<a href='https://github.com/infra-geo-ouverte/igo2' target='_blank'> IGO2</a>",
+        "params": {}
+      },
+      "name": "imagerie",
+      "visible": true,
+      "opacity": 1,
+      "zIndex": 8
+    },
+    {
+      "title": "MSP DESSERTE MUN 911",
+      "maxResolution": 26458.31904584105,
+      "minResolution": 0.02645831904584105,
+      "extent": [
+        -10042999.556489397, 5291172.618263009, -5207770.682189084,
+        9422636.923998903
+      ],
+      "metadata": {
+        "url": "https://www.donneesquebec.ca/recherche/fr/dataset/6a052cb5-42e6-4735-8626-02f62f1294d0",
+        "extern": true
+      },
+      "legendOptions": {
+        "stylesAvailable": [{ "name": "default", "title": "default" }]
+      },
+      "id": 1696,
+      "sourceOptions": {
+        "type": "wms",
+        "url": "https://geoegl.msp.gouv.qc.ca/apis/ws/igo_gouvouvert.fcgi",
+        "optionsFromCapabilities": true,
+        "params": { "LAYERS": "MSP_DESSERTE_MUN_911", "VERSION": "1.3.0" },
+        "queryable": false,
+        "queryFormat": "gml2",
+        "queryTitle": "Municipalite"
+      },
+      "name": "msp_desserte_mun_911",
+      "opacity": 1,
+      "visible": true,
+      "zIndex": 11
+    },
+    {
+      "id": 16165,
+      "type": "group",
+      "title": "Test1",
+      "children": [
+        {
+          "title": "MSP Tel. Urgence",
+          "maxResolution": null,
+          "minResolution": null,
+          "extent": [
+            -10042999.556489397, 5291172.618263009, -5207770.682189084,
+            9422636.923998903
+          ],
+          "metadata": {
+            "url": "https://www.donneesquebec.ca/recherche/dataset/telephone-durgence",
+            "extern": true,
+            "abstract": "Téléphones de secours (Source : MTQ)",
+            "keywordList": ["Téléphones de secours (secteur routier)"]
+          },
+          "legendOptions": {
+            "stylesAvailable": [{ "name": "default", "title": "default" }]
+          },
+          "id": 1693,
+          "parentId": "16165",
+          "sourceOptions": {
+            "type": "wms",
+            "url": "https://geoegl.msp.gouv.qc.ca/apis/ws/igo_gouvouvert.fcgi",
+            "optionsFromCapabilities": true,
+            "params": { "LAYERS": "telephone_urg", "VERSION": "1.3.0" },
+            "queryable": true,
+            "queryFormat": "gml2",
+            "queryTitle": "desclocal"
+          },
+          "name": "msp_tel._urgence",
+          "opacity": 1,
+          "visible": true
+        }
+      ],
+      "name": "test1",
+      "collapsed": false,
+      "opacity": 1,
+      "visible": true,
+      "zIndex": 12
+    },
+    {
+      "id": 16166,
+      "type": "group",
+      "title": "Test2",
+      "children": [
+        {
+          "id": 16169,
+          "type": "group",
+          "title": "Test3",
+          "parentId": "16166",
+          "children": [
+            {
+              "id": 16171,
+              "type": "group",
+              "title": "Test4",
+              "parentId": "16166.16169",
+              "children": [],
+              "name": "test4",
+              "collapsed": false,
+              "opacity": 1,
+              "visible": true
+            }
+          ],
+          "name": "test3",
+          "collapsed": false,
+          "opacity": 1,
+          "visible": true
+        }
+      ],
+      "name": "test2",
+      "collapsed": false,
+      "opacity": 1,
+      "visible": true,
+      "zIndex": 13
+    }
+  ]
+}
diff --git a/src/environments/environment.ts b/src/environments/environment.ts
@@ -41,6 +41,14 @@ export const environment: AppEnvironmentOptions = {
       url: '/apis/igo2',
       defaultContextUri: '5'
     },*/
+    layer: {
+      group: {
+        enable: true,
+        canCreate: true,
+        canRename: true,
+        maxHierarchyLevel: 4
+      }
+    },
     catalog: {
       sources: [
         {

diff --git a/src/index.html b/src/index.html
@@ -19,7 +19,7 @@
     />
     <link
       rel="stylesheet"
-      href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,1,0"
+      href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0..1,0"
     />
     <link id="theme-styles" rel="stylesheet" />
     <meta name="theme-color" content="#1976d2" />

diff --git a/src/styles.scss b/src/styles.scss
@@ -4,6 +4,14 @@
 @use 'style/reset.scss';
 @use 'style/theme.scss';
 
+.material-symbols-outlined {
+  font-variation-settings:
+    'FILL' 1,
+    'wght' 400,
+    'GRAD' 0,
+    'opsz' 24;
+}
+
 .shepherd-element[data-popper-reference-hidden]:not(.shepherd-centered) {
   opacity: 1;
   visibility: visible;