Remove map service/layers from layer list

[enricobonansea]

is it possible to remove a map service (or single layer) from the layer list? 

It seems to me that in the WAB previous version this option was avaiable in the layer list widget.

Thank you
Enrico

[RobertScheitlin__GISP]

Enrico,

   Sure in the LayerList widgets settings you choose which layer are visible in the widgets list:

[enricobonansea]

Robert, 

my question was not so clear, sorry.

I ask if it is possible to remove a map service that  has been added before by other widget (ie Geoportal serach, add data widgets)

In one of the previous versions of WAB this option was available  right-clicking on the layer, while now (WAB dev 2.1)  is not visible.

Thank you
enrico

[RobertScheitlin__GISP]

Enrico,

   I wonder if that was a custom feature as I do not see the "Remove Layer" anywhere in the LayerList widgets code in version 2.0.

[enricobonansea]

Maybe you're right : the specific example refers to an old customized app, based on some older version of WAB, but iIt seems me that the remove option was available in the past by default..(.?)

Anyway , i think this is a fundamental feature  that  "layer list widget " should have.

Do you think it is possible add  this function in layer list? 

thank you 

[DevonBise]

Thread bump.  Having this feature would be a fantastic addition as we have users who will add Operational Layers "by mistake" to the application and then confuse themselves.  Keeping a clean interface is ideal - especially for users who are not particularly tech-savvy.

[enricobonansea]

Devon, I totally agree.

If the app has "Add" functions (Add data, Geoportal search, addshapefile etc)  SHOULD have  a Remove  tool.

We investigated the code but we haven't found any solution... but we are JS  programming  newbie ...

Hope someone could contribute !

[RobertScheitlin__GISP]

Enrico,

  The Add Data widget has a remove button when you add a layer. I also think I remember a remove layer option on the Layer List widget but there was likely a reason it was removed.

[enricobonansea · Accepted solution]

We worked on the issue and we seem to have found a  a workaround.

It works also if we are sure that it could be ehanced and otimized.

The only problem we notice is this message in  firebug,. We don't know what it means but it  do not impact on the functionality:

Any suggestion is appreciated

Bye

Enrico & Manuela

Here the modified files (in red the modified lines):

..\widgets\LayerList\PopupMenu.js

...
_initDeniedItems: function() {
  var deniedItemsFromConfigKeys = [];
  var menuItemDictionary = {
    "ZoomTo": "zoomto",
    "Transparency": "transparency",
    "EnableOrDisablePopup": "controlPopup",
    "MoveupOrMovedown": "moveup movedown",
    "OpenAttributeTable": "table",
    "DescriptionOrShowItemDetailsOrDownload": "url",
    "RemoveLayer": "removelayer",  //
  };
...

..\widgets\LayerList\PopupMenuInfo.js

...
constructor: function(layerInfo, displayItemInfos, layerType, layerListWidget) {
var l = displayItemInfos.length;
if (l > 5) {
  displayItemInfos = { key: 'removelayer' }; //
}
...

...

    onPopupMenuClick: function(evt) {
      var result = {
        closeMenu: true
      };
      switch (evt.itemKey) {
        case 'zoomto' /*this.nls.itemZoomTo'Zoom to'*/ :
          this._onItemZoomToClick(evt);
          break;
        case 'moveup' /*this.nls.itemMoveUp'Move up'*/ :
          this._onMoveUpItemClick(evt);
          break;
        case 'movedown' /*this.nls.itemMoveDown'Move down'*/ :
          this._onMoveDownItemClick(evt);
          break;
        case 'table' /*this.nls.itemToAttributeTable'Open attribute table'*/ :
          this._onTableItemClick(evt);
          break;
        case 'transparencyChanged':
          this._onTransparencyChanged(evt);
          result.closeMenu = false;
          break;
        case 'controlPopup':
          this._onControlPopup();
          break;
         case 'removelayer': //
          this._onItemRemoveLayer(evt);
          break;
      }
      return result;
    },

...

...
_initCandidateMenuItems: function() {
  //descriptionTitle: NlsStrings.value.itemDesc,
  // var layerObjectUrl = (this._layerInfo.layerObject && this._layerInfo.layerObject.url) ?
  //                       this._layerInfo.layerObject.url :
  //                       '';
  this._candidateMenuItems = [{
    key: 'separator',
    label: ''
  }, {
    key: 'empty',
    label: this.nls.empty
  }, {
    key: 'zoomto',
    label: this.nls.itemZoomTo
  }, {
    key: 'transparency',
    label: this.nls.itemTransparency
  }, {
    key: 'moveup',
    label: this.nls.itemMoveUp
  }, {
    key: 'movedown',
    label: this.nls.itemMoveDown
  }, {
    key: 'table',
    label: this.nls.itemToAttributeTable
  }, {
    key: 'controlPopup',
    label: this.nls.removePopup
  }, {
    key: 'url',
    label: this._getATagLabel()
  },{
    key: 'separator',
    label: ''
  },{ //
    key: 'removelayer',
    label: this.nls.itemRemoveLayer
  }];
},
......
_onItemRemoveLayer: function(evt) { //
  this._layerInfo.map.removeLayer(this._layerInfo.layerObject);
}
......\configs\LayerList\config_Contenuti mappa.json  (the original file shoud be layerlist.json){
  "showLegend": true,
  "contextMenu": {
    "ZoomTo": true,
    "Transparency": true,
    "EnableOrDisablePopup": true,
    "MoveupOrMovedown": true,
    "OpenAttributeTable": true,
    "DescriptionOrShowItemDetailsOrDownload": true,
    "RemoveLayer": true
  },
  "layerOptions": {}
}...\jimu.js\nls\main.js...
layerInfosMenu: {
  titleBasemap: "Basemaps",
  titleLayers: "Operational Layers",
  labelLayer: "Layer Name",
  itemZoomTo: "Zoom to",
  itemTransparency: "Transparency",
  itemTransparent: "Transparent",
  itemOpaque: "Opaque",
  itemMoveUp: "Move up",
  itemMoveDown: "Move down",
  itemDesc: "Description",
  itemDownload: "Download",
  itemToAttributeTable: "Open Attribute Table",
  itemRemoveLayer: "Remove Layer"
},
......\jimu.js\nls\it\main.js...
"layerInfosMenu": {
  "titleBasemap": "Mappe di base",
  "titleLayers": "Layer operativi",
  "labelLayer": "Nome layer",
  "itemZoomTo": "Zoom a",
  "itemTransparency": "Trasparenza",
  "itemTransparent": "Trasparente",
  "itemOpaque": "Opaco",
  "itemMoveUp": "Sposta su",
  "itemMoveDown": "Sposta giù",
  "itemDesc": "Descrizione",
  "itemDownload": "Download",
  "itemToAttributeTable": "Apri tabella attributi",
  "itemRemoveLayer": "Rimuovi il layer"
},
......\widgets\LayerList\nls\strings.jsdefine({
  root: ({
    _widgetLabel: "Layer List",
    titleBasemap: "Basemaps",
    titleLayers: "Operational Layers",
    labelLayer: "Layer Name",
    itemZoomTo: "Zoom to",
    itemTransparency: "Transparency",
    itemTransparent: "Transparent",
    itemOpaque: "Opaque",
    itemMoveUp: "Move up",
    itemMoveDown: "Move down",
    itemDesc: "Description",
    itemDownload: "Download",
    itemToAttributeTable: "Open Attribute Table",
    itemShowItemDetails: "Show Item Details",
    empty: "empty",
    removePopup: "Disable Pop-up",
    enablePopup: "Enable Pop-up",
    turnAllLayersOff: "Turn All Layers Off",
    turnAllLayersOn: "Turn All Layers On",
    expandAllLayers: "Expand All Layers",
    collapseAlllayers: "Collapse All layers",
    turnAllLabelsOff: "Turn All Labels Off",
    turnAllLabelsOn: "Turn All Labels On",
    showLabels: "Show Labels",
    hideLables: "Hide Labels",
    itemTransparency: "Remove Layer"
  }),
......\widgets\LayerList\nls\it\strings.jsdefine({
  "_widgetLabel": "Elenco layer",
  "titleBasemap": "Mappe di base",
  "titleLayers": "Layer operativi",
  "labelLayer": "Nome layer",
  "itemZoomTo": "Zoom a",
  "itemTransparency": "Trasparenza",
  "itemTransparent": "Trasparente",
  "itemOpaque": "Opaco",
  "itemMoveUp": "Sposta su",
  "itemMoveDown": "Sposta giù",
  "itemDesc": "Descrizione",
  "itemDownload": "Download",
  "itemToAttributeTable": "Apri tabella attributi",
  "itemShowItemDetails": "Mostra dettagli elemento",
  "empty": "vuoto",
  "removePopup": "Disabilita popup",
  "enablePopup": "Abilita popup",
  "turnAllLayersOff": "Disattiva tutti i layer",
  "turnAllLayersOn": "Attiva tutti i layer",
  "expandAllLayers": "Espandi tutti i layer",
  "collapseAlllayers": "Comprimi tutti i layer",
  "turnAllLabelsOff": "Disattiva tutte le etichette",
  "turnAllLabelsOn": "Attiva tutte le etichette",
  "showLabels": "Mostra Etichette",
  "hideLables": "Nascondi Etichette",
  "itemRemoveLayer": "Rimuovi il layer"
});...\widgets\LayerList\config.json{
  "showLegend": true,
  "contextMenu": {
    "ZoomTo": true,
    "Transparency": true,
    "EnableOrDisablePopup": true,
    "MoveupOrMovedown": true,
    "OpenAttributeTable": true,
    "DescriptionOrShowItemDetailsOrDownload": true,
    "RemoveLayer": true
  }
}

[RobertScheitlin__GISP]

Enrico,

   For some reason you images are not showing in your post.  What are you using to determine if the remove layer option should be shown?

if (l > 5) {
  displayItemInfos[l] = { key: 'removelayer' }; //
}‍‍‍