<?xml version="1.0" encoding="UTF-8"?>
<rss xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:taxo="http://purl.org/rss/1.0/modules/taxonomy/" version="2.0">
  <channel>
    <title>topic programatically hide widget or widgets-group in Launchpad theme widgets-panel in Web AppBuilder Custom Widgets Questions</title>
    <link>https://community.esri.com/t5/web-appbuilder-custom-widgets-questions/programatically-hide-widget-or-widgets-group-in/m-p/876034#M13566</link>
    <description>&lt;HTML&gt;&lt;HEAD&gt;&lt;/HEAD&gt;&lt;BODY&gt;&lt;P style="background-color: #ffffff; border: 0px;"&gt;I use WEB AppBuilder (Developer Edition) 2.17,&amp;nbsp;Launchpad theme, on 3D scenes.&lt;/P&gt;&lt;P style="background-color: #ffffff; border: 0px;"&gt;I created in widgets-panel a widget-group with 3 widgets inside it, each of them is activated from another widget,&lt;/P&gt;&lt;P style="background-color: #ffffff; border: 0px;"&gt;so I need that this widgets-group&amp;nbsp;of 3 widgets will NOT be seen, and also will not occupy space within widgets-panel.&lt;/P&gt;&lt;P style="background-color: #ffffff; border: 0px;"&gt;&lt;/P&gt;&lt;P style="background-color: #ffffff; border: 0px;"&gt;I inserted next code at end of WidgetManager.js loadWidget function setTimeout (between lines 127 and 128) -&lt;/P&gt;&lt;P style="background-color: #ffffff; border: 0px; padding-left: 60px;"&gt;&lt;SPAN style="font-size: 12px; color: #993300;"&gt;if (setting.uri.includes("AnchorBarController") &amp;amp;&amp;amp; !that.isDbgGroup) {&lt;/SPAN&gt;&lt;BR /&gt;&lt;SPAN style="font-size: 12px; color: #993300;"&gt;&amp;nbsp; &amp;nbsp; let parent = document.querySelector(".iconList .iconGroup");&lt;/SPAN&gt;&lt;BR /&gt;&lt;SPAN style="font-size: 12px; color: #993300;"&gt;&amp;nbsp; &amp;nbsp; if (parent) {&lt;/SPAN&gt;&lt;BR /&gt;&lt;SPAN style="font-size: 12px; color: #993300;"&gt;&amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; if (parent.lastChild) {&lt;/SPAN&gt;&lt;BR /&gt;&lt;SPAN style="font-size: 12px; color: #993300;"&gt;&amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; if (parent.lastChild.id === "uniqName_3_13")&lt;/SPAN&gt;&lt;BR /&gt;&lt;SPAN style="font-size: 12px; color: #993300;"&gt;&amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; parent.removeChild(parent.lastElementChild);&lt;/SPAN&gt;&lt;BR /&gt;&lt;SPAN style="font-size: 12px; color: #993300;"&gt;&amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; }&lt;/SPAN&gt;&lt;BR /&gt;&lt;SPAN style="font-size: 12px; color: #993300;"&gt;&amp;nbsp; &amp;nbsp; }&lt;/SPAN&gt;&lt;BR /&gt;&lt;SPAN style="font-size: 12px; color: #993300;"&gt;}&lt;/SPAN&gt;&lt;/P&gt;&lt;P style="background-color: #ffffff; border: 0px;"&gt;&lt;SPAN style="font-size: 15px;"&gt;But there are 3 drawbacks in how I implemented the hiding:&lt;/SPAN&gt;&lt;/P&gt;&lt;OL&gt;&lt;LI style="background-color: #ffffff; border: 0px;"&gt;&lt;SPAN style="font-size: 15px;"&gt;This works well in app,&lt;/SPAN&gt;&lt;BR /&gt;&lt;SPAN style="font-size: 15px;"&gt;and also in WAB itself when I open the app by clicking "Launch", but NOT when I open the app by clicking "Configure app" and when I'm in the app I change Scene (since then these classes within dom have different names).&lt;/SPAN&gt;&lt;/LI&gt;&lt;LI style="background-color: #ffffff; border: 0px;"&gt;&lt;SPAN style="font-size: 15px;"&gt;Depending on class name given by Theme could cause mistakes.&lt;/SPAN&gt;&lt;/LI&gt;&lt;LI style="background-color: #ffffff; border: 0px;"&gt;&lt;SPAN style="font-size: 15px;"&gt;The widgets-group is hidden but still occupies place within widgets-panel.&lt;/SPAN&gt;&lt;/LI&gt;&lt;/OL&gt;&lt;P style="background-color: #ffffff; border: 0px;"&gt;&lt;/P&gt;&lt;P style="background-color: #ffffff; border: 0px;"&gt;So, I need a more &lt;STRONG&gt;robust&lt;/STRONG&gt; way to hide that widgets-group programatically.&lt;/P&gt;&lt;P style="background-color: #ffffff; border: 0px;"&gt;I also wish, if possible, that this widgets-group will &lt;STRONG&gt;not&lt;/STRONG&gt; occupy place within the widgets-panel (but I still need of course that these widgets in the hidden widgets-group could be activated from another widget).&lt;/P&gt;&lt;/BODY&gt;&lt;/HTML&gt;</description>
    <pubDate>Thu, 01 Oct 2020 09:04:43 GMT</pubDate>
    <dc:creator>MichaelLev</dc:creator>
    <dc:date>2020-10-01T09:04:43Z</dc:date>
    <item>
      <title>programatically hide widget or widgets-group in Launchpad theme widgets-panel</title>
      <link>https://community.esri.com/t5/web-appbuilder-custom-widgets-questions/programatically-hide-widget-or-widgets-group-in/m-p/876034#M13566</link>
      <description>&lt;HTML&gt;&lt;HEAD&gt;&lt;/HEAD&gt;&lt;BODY&gt;&lt;P style="background-color: #ffffff; border: 0px;"&gt;I use WEB AppBuilder (Developer Edition) 2.17,&amp;nbsp;Launchpad theme, on 3D scenes.&lt;/P&gt;&lt;P style="background-color: #ffffff; border: 0px;"&gt;I created in widgets-panel a widget-group with 3 widgets inside it, each of them is activated from another widget,&lt;/P&gt;&lt;P style="background-color: #ffffff; border: 0px;"&gt;so I need that this widgets-group&amp;nbsp;of 3 widgets will NOT be seen, and also will not occupy space within widgets-panel.&lt;/P&gt;&lt;P style="background-color: #ffffff; border: 0px;"&gt;&lt;/P&gt;&lt;P style="background-color: #ffffff; border: 0px;"&gt;I inserted next code at end of WidgetManager.js loadWidget function setTimeout (between lines 127 and 128) -&lt;/P&gt;&lt;P style="background-color: #ffffff; border: 0px; padding-left: 60px;"&gt;&lt;SPAN style="font-size: 12px; color: #993300;"&gt;if (setting.uri.includes("AnchorBarController") &amp;amp;&amp;amp; !that.isDbgGroup) {&lt;/SPAN&gt;&lt;BR /&gt;&lt;SPAN style="font-size: 12px; color: #993300;"&gt;&amp;nbsp; &amp;nbsp; let parent = document.querySelector(".iconList .iconGroup");&lt;/SPAN&gt;&lt;BR /&gt;&lt;SPAN style="font-size: 12px; color: #993300;"&gt;&amp;nbsp; &amp;nbsp; if (parent) {&lt;/SPAN&gt;&lt;BR /&gt;&lt;SPAN style="font-size: 12px; color: #993300;"&gt;&amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; if (parent.lastChild) {&lt;/SPAN&gt;&lt;BR /&gt;&lt;SPAN style="font-size: 12px; color: #993300;"&gt;&amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; if (parent.lastChild.id === "uniqName_3_13")&lt;/SPAN&gt;&lt;BR /&gt;&lt;SPAN style="font-size: 12px; color: #993300;"&gt;&amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; parent.removeChild(parent.lastElementChild);&lt;/SPAN&gt;&lt;BR /&gt;&lt;SPAN style="font-size: 12px; color: #993300;"&gt;&amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; }&lt;/SPAN&gt;&lt;BR /&gt;&lt;SPAN style="font-size: 12px; color: #993300;"&gt;&amp;nbsp; &amp;nbsp; }&lt;/SPAN&gt;&lt;BR /&gt;&lt;SPAN style="font-size: 12px; color: #993300;"&gt;}&lt;/SPAN&gt;&lt;/P&gt;&lt;P style="background-color: #ffffff; border: 0px;"&gt;&lt;SPAN style="font-size: 15px;"&gt;But there are 3 drawbacks in how I implemented the hiding:&lt;/SPAN&gt;&lt;/P&gt;&lt;OL&gt;&lt;LI style="background-color: #ffffff; border: 0px;"&gt;&lt;SPAN style="font-size: 15px;"&gt;This works well in app,&lt;/SPAN&gt;&lt;BR /&gt;&lt;SPAN style="font-size: 15px;"&gt;and also in WAB itself when I open the app by clicking "Launch", but NOT when I open the app by clicking "Configure app" and when I'm in the app I change Scene (since then these classes within dom have different names).&lt;/SPAN&gt;&lt;/LI&gt;&lt;LI style="background-color: #ffffff; border: 0px;"&gt;&lt;SPAN style="font-size: 15px;"&gt;Depending on class name given by Theme could cause mistakes.&lt;/SPAN&gt;&lt;/LI&gt;&lt;LI style="background-color: #ffffff; border: 0px;"&gt;&lt;SPAN style="font-size: 15px;"&gt;The widgets-group is hidden but still occupies place within widgets-panel.&lt;/SPAN&gt;&lt;/LI&gt;&lt;/OL&gt;&lt;P style="background-color: #ffffff; border: 0px;"&gt;&lt;/P&gt;&lt;P style="background-color: #ffffff; border: 0px;"&gt;So, I need a more &lt;STRONG&gt;robust&lt;/STRONG&gt; way to hide that widgets-group programatically.&lt;/P&gt;&lt;P style="background-color: #ffffff; border: 0px;"&gt;I also wish, if possible, that this widgets-group will &lt;STRONG&gt;not&lt;/STRONG&gt; occupy place within the widgets-panel (but I still need of course that these widgets in the hidden widgets-group could be activated from another widget).&lt;/P&gt;&lt;/BODY&gt;&lt;/HTML&gt;</description>
      <pubDate>Thu, 01 Oct 2020 09:04:43 GMT</pubDate>
      <guid>https://community.esri.com/t5/web-appbuilder-custom-widgets-questions/programatically-hide-widget-or-widgets-group-in/m-p/876034#M13566</guid>
      <dc:creator>MichaelLev</dc:creator>
      <dc:date>2020-10-01T09:04:43Z</dc:date>
    </item>
  </channel>
</rss>

