show widget dynamically

[HelenZhou]

Hello.

I have a WAB application at version 2.16. There is a custom widget, which is set "visible: false," in the application's config.json. I would like to change it as visible if the log in user is in a permitted group. According to this discussion, Show hide layers widget based on Portal Named user level , I add the following codes to this custom widget.js  postCreate module. But the code never hits to postCreate module. Where should I put those lines of codes?

thanks so much.

           postCreate: function () {
                console.log('postCreate');
                var widgetCfg = this._getWidgetConfig('MyCustomWidget');
                widgetCfg.visible = true;
                if(window._layoutManager.params.urlParams.mode === 'config'){
                  topic.publish('builder/widgetChanged', widgetCfg);
                }else{
                  topic.publish('widgetChanged', widgetCfg);
                }                
            },

[RobertScheitlin__GISP]

Like I already said in that thread. I can't tell you exactly where to put this as i am not aware of your exact workflow.

You need this code somewhere in your app that will be used to control the visibility of on screen widgets. Like some other widget that will always be added to your app.

[HelenZhou]

Thanks Robert. There is a custom widget, which is set "visible: false," in the application's config.json. I would like the custom widget show up when the application loads if the log in user is in a permitted group. The permission is already checked before the map and widget load in the application. I have tried to put the "topic.publish"

code in the jimu.js\layoutManagers\BaseLayoutManager.js postCreate. The _onWidgetChanged is still not fired in \\tst-gis6\c$\inetpub\wwwroot\iMapWAB\jimu.js\ConfigManager.js.

[RobertScheitlin__GISP]

Helen,

1. What theme are you using?
2. Where is the widget that you are trying to change the visibility for (i.e in one of the on screen widget positions, in the Header controller widget, in the anchorbar controller)?
3. Where in the WAB code are you checking the user permission?

   The permission is already checked before the map and widget load in the application

[HelenZhou]

Thanks so much, Robert.

• What theme are you using? I am using TabTheme
• Where is the widget that you are trying to change the visibility for (i.e in one of the on screen widget positions, in the Header controller widget, in the anchorbar controller)? The widget is one of the on screen widget. Its visibility is set to false at the config.json
• Where in the WAB code are you checking the user permission? When the user opens the web site,  Some .Net codes check if the log in user is in certain AD group. I save the checking permission result in the cookie. For example, if the user is in the AD group, I save the permission cookie as "yes". I then retrieve the permission cookie in java script code. I will turn on the widget if the permission cookie is "yes". This is where I have issue. I don't know where I should put the topic.publish to trigger the changes of the widget configuration. "topic.publish('widgetChanged', widgetCfg);"

[RobertScheitlin__GISP · Accepted solution]

Helen,

   OK I did some simple testing and I had to issue enabling a widget that had it's visibility set to false from inside the MapManager.js. Here is my code (simplified test no user authentication just set a widget to be visible after 5 seconds). 

....
      _showMap: function(appConfig) {
        // console.timeEnd('before map');
        console.time('Load Map');
        //for now, we can't create both 2d and 3d map
        if (appConfig.map['3D']) {
          if (appConfig.map.itemId) {
            this._show3DWebScene(appConfig);
          } else {
            this._show3DLayersMap(appConfig);
          }
        } else {
          if (appConfig.map.itemId) {
            this._show2DWebMap(appConfig);
          } else {
            console.log('No webmap found. Please set map.itemId in config.json.');
          }
        }
        setTimeout(
          lang.hitch(this, this._checkWidgetVisibility), 5000
        );
      },

      _checkWidgetVisibility: function(){
        var widgetCfg = this._getWidgetConfig('Draw');
        widgetCfg.visible = true;
        if(window._layoutManager.params.urlParams.mode === 'config'){
          topic.publish('builder/widgetChanged', widgetCfg);
        }else{
          topic.publish('widgetChanged', widgetCfg);
        }
      },

      _getWidgetConfig: function(widgetName){  
        var widgetCnfg = null;  
        array.some(this.appConfig.widgetPool.widgets, function(aWidget) {  
          if(aWidget.name == widgetName) {  
            widgetCnfg = aWidget;  
            return true;  
          }  
          return false;  
        });  
        if(!widgetCnfg){  
          /*Check OnScreen widgets if not found in widgetPool*/  
          array.some(this.appConfig.widgetOnScreen.widgets, function(aWidget) {  
            if(aWidget.name == widgetName) {  
              widgetCnfg = aWidget;  
              return true;  
            }  
            return false;  
          });  
        }  
        return widgetCnfg;  
      },
....‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

[HelenZhou]

thank you so much, Robert. that is exactly what I want. I call "_checkWidgetVisibility" without setting time out.