Configuring widgetPool group to open multiple widgets in a panel

2380
5
06-17-2016 07:15 AM
Jay_Gregory
Occasional Contributor III

I have been developing some custom widgets and functionality to get some charts and data to show up on the side of the map (see attached image).  I am getting this strange error when opening my app, which is:

create panel error: Error: Tried to register widget with id==_33_panel but that id is already registered, panelId: _33_panel.

Ultimately, I'm confused on how to create a group, panel, and widget configuration so that the widgets open simultaneously without issue.

Here is my widgetPool section in my config.json for my theme layout.....

 "widgetPool": {
    "panel": {
      "uri": "themes/EONTheme/panels/FoldablePanel/Panel",
      "position": {
        "top": 5,
        "right": 5,
        "bottom": 5,
        "zIndex": 5
      }
    },
  "groups":[{
  "label": "EON Group",
  "panel":{
  "uri": "themes/EONTheme/panels/EONBorderPanel/Panel",
    "position": {
          "top": 150,
          "right": 17,
          "width": 220,
          "height": 220
        }
  },
  "widgets":[{"uri":"widgets/EONSummary/Widget"},{"uri":"widgets/EONChart/Widget","label":"Chart1"},{"uri":"widgets/EONChart/Widget","label":"Chart2"}]
  }]
 }

My custom panel, EONBorderPanel has a size of 220x220 px, but I also have three widgets in the group (EONSummary, and two EONChart widgets).

My CSS for my eonborderpanel located in common.css for my theme is:

.jimu-eonborder-panel>.jimu-widget-frame.jimu-container{
  background-color: rgba(0,0,0,0.4);
  border: 1px solid rgba(0,0,0,0.6);
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  margin-bottom: 2px;
  width: 220px;
  height: 220px;
}

I have also set those panels as 220x220 px. 

So my question is am I getting this error because the app is trying to open three EONBorderPanels at the same time with the same id?  Is that why I'm getting this error?  And how to I prevent it?

Any help would be appreciated!

0 Kudos
5 Replies
Jay_Gregory
Occasional Contributor III

This seems to have to do with setting the widgetPool group of widgets to open automatically on app load (clicking the group icon and changing the tiny circle from orange to green in the header controller widget section).  I don't get this error if I manually open the widget once the whole page has loaded.  So this might have to do with load timing. 

Is there any way to open a widget programmatically once the app has finished loading..?  What js file / method might control that behavior?

0 Kudos
RobertScheitlin__GISP
MVP Emeritus

Jay,

  No there is no support for opening a grouped widget on load. That is why you would not be presented with the load at start open for any grouped widget when using the UI.

0 Kudos
Jay_Gregory
Occasional Contributor III

Thanks Robert!  But it seems like I am able configure a group to open at load.  See attached screenshot with the New Group circle green (indicating open at load).

0 Kudos
RobertScheitlin__GISP
MVP Emeritus

Jay,

  That may be because of your custom theme or panel then as you should not get that option using OTB theme and widgets.

0 Kudos
Jay_Gregory
Occasional Contributor III

Hmmmm, that's not the behavior I'm seeing with the latest version of Web AppBuilder Developer edition.  I was able to recreate the error using the Foldable Theme and a grouped widget in the header controller without any custom code I've created.  Which means it must be a bug of some sort.....

Anyway, thanks for your input!

0 Kudos