Trreview: handle layer UI when filtered

3liz · Jun 1, 2023 · bba686b · bba686b
1 parent 39eb987
commit bba686b
Show file tree

Hide file tree

Showing 4 changed files with 15 additions and 14 deletions.
diff --git a/assets/src/components/Treeview.js b/assets/src/components/Treeview.js
@@ -20,7 +20,7 @@ export default class Treeview extends HTMLElement {
             ${layerGroup.getLayers().getArray().slice().reverse().map(layer => html`
             <li>
                 <input class="${layerGroup.get('mutuallyExclusive') ? 'rounded-checkbox' : ''}" type="checkbox" id="node-${layer.get('name')}" .checked=${layer.getVisible()} @click=${() => layer.setVisible(!layer.getVisible())} >
-                <div class="node">
+                <div class="node ${layer.getSource().getParams()?.['FILTERTOKEN'] ? 'filtered' : ''}">
                     <label for="node-${layer.get('name')}">${layer.get('name')}</label>
                     <i class="icon-info-sign" @click=${() => this._toggleMetadata(layer.get('name'), layer instanceof LayerGroup)}></i>
                 </div>

diff --git a/assets/src/legacy/attributeTable.js b/assets/src/legacy/attributeTable.js
@@ -1976,7 +1976,6 @@ var lizAttributeTable = function() {
 
             // Get first elements of the pile and withdraw it from the pile
             var typeName = typeNamePile.shift();
-            var cleanName = lizMap.cleanName(typeName);
 
             // Get corresponding filter
             var aFilter = typeNameFilter[typeName];
@@ -1988,16 +1987,7 @@ var lizAttributeTable = function() {
                 applyEmptyLayerFilter( typeName, typeNamePile, typeNameFilter, typeNameDone, cascade );
             }
 
-            // Change background in switcher
-            var trFilteredBgcolor = 'inherit';
-            var displayUnFilterSwitcherTool = false;
-            if( aFilter ){
-                trFilteredBgcolor = 'rgba(255, 171, 0, 0.4)';
-                displayUnFilterSwitcherTool = true;
-            }
-            $('#switcher .treeTable tr#group-' + cleanName).css('background-color', trFilteredBgcolor );
-            $('#switcher .treeTable tr#layer-' + cleanName).css('background-color', trFilteredBgcolor );
-            $('#layerActionUnfilter' ).toggle( ( lizMap.lizmapLayerFilterActive !== null ) ).css( 'background-color', 'rgba(255, 171, 0, 0.4)');
+            $('#layerActionUnfilter').toggle((lizMap.lizmapLayerFilterActive !== null));
         }
 
         function buildChildParam( relation, typeNameDone ) {
@@ -2407,8 +2397,8 @@ var lizAttributeTable = function() {
                         var cFilter = null;
                         var cExpFilter = null;
                         // Get WMS layer name (can be different depending on QGIS Server version)
-                        let layer = lizMap.mainLizmap.baseLayersMap.getLayerByTypeName(lizMap.cleanName(cName));
-                        var wmsCname = layer.getSource?.().getParams?.()?.['LAYERS'] || cName;
+                        let layer = lizMap.mainLizmap.baseLayersMap.getLayerByName(lizMap.cleanName(cName));
+                        var wmsCname = layer?.getSource?.().getParams?.()?.['LAYERS'] || cName;
 
                         // Build filter for children
                         // and add child to the typeNameFilter and typeNamePile objects

diff --git a/assets/src/modules/BaseLayersMap.js b/assets/src/modules/BaseLayersMap.js
@@ -251,6 +251,10 @@ export default class BaseLayersMap extends olMap {
                     const changedLayer = evt.target;
                     const parentGroup = this.getLayerOrGroupByName(changedLayer.get('parentName'));
 
+                    if(!parentGroup){
+                        return;
+                    }
+
                     if (changedLayer.getVisible()) {
                         parentGroup?.setVisible(true);
                     }

diff --git a/lizmap/www/assets/css/map.css b/lizmap/www/assets/css/map.css
@@ -2992,6 +2992,12 @@ lizmap-paste-geom svg {
   vertical-align: text-top;
 }
 
+/* Treeview */
+
+lizmap-treeview .filtered, button#layerActionUnfilter.btn {
+  background-color: rgba(255, 171, 0, 0.4);
+}
+
 lizmap-treeview ul {
   list-style: none;
 }
@@ -3000,6 +3006,7 @@ lizmap-treeview .node {
   display: inline-flex;
   width: calc(100% - 25px);
   vertical-align: top;
+  padding-left: 2px;
 }
 
 lizmap-treeview input[type="checkbox"] {