<?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 Keep loading screen until everything has finished loading in ArcGIS Web AppBuilder Questions</title>
    <link>https://community.esri.com/t5/arcgis-web-appbuilder-questions/keep-loading-screen-until-everything-has-finished/m-p/5224#M140</link>
    <description>&lt;HTML&gt;&lt;HEAD&gt;&lt;/HEAD&gt;&lt;BODY&gt;&lt;P&gt;I've a problem similar to the one discussed in this thread:&lt;/P&gt;&lt;P&gt;&lt;A href="https://community.esri.com/thread/231977" target="_blank"&gt;Keep Loading Screen Up Longer in WAB&lt;/A&gt;&amp;nbsp;&lt;/P&gt;&lt;P&gt;&lt;/P&gt;&lt;P&gt;I am filtering the feature layer in my app&amp;nbsp;based on the logged in user before loading. I'm then changing the extent of the map based on the filtered features. Both of these steps are fine.&lt;/P&gt;&lt;P&gt;&lt;/P&gt;&lt;P&gt;I apply the filter in MapManager.js and then I get the extent of the filtered features using an "update-end" event like below. The event is required otherwise the graphics array will be zero presumably because the graphics layers aren't don't seem to be available yet.&lt;/P&gt;&lt;P&gt;&lt;/P&gt;&lt;PRE class="lia-code-sample line-numbers language-none"&gt;&lt;CODE&gt;this.filterManager.applyWidgetFilter("mylayer", null, "email = test@example.com");

var layer = this.map.getLayer("mylayer");

on.once(layer, 'update-end', function(){
 var myextent = graphicsUtils.graphicsExtent(layer.graphics);
 map.setExtent(myextent);
 });‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍&lt;SPAN class="line-numbers-rows"&gt;&lt;SPAN&gt;‍&lt;/SPAN&gt;&lt;SPAN&gt;‍&lt;/SPAN&gt;&lt;SPAN&gt;‍&lt;/SPAN&gt;&lt;SPAN&gt;‍&lt;/SPAN&gt;&lt;SPAN&gt;‍&lt;/SPAN&gt;&lt;SPAN&gt;‍&lt;/SPAN&gt;&lt;SPAN&gt;‍&lt;/SPAN&gt;&lt;SPAN&gt;‍&lt;/SPAN&gt;&lt;/SPAN&gt;&lt;/CODE&gt;&lt;/PRE&gt;&lt;P&gt;Anyway this all works fine. My map loads, gets filtered and then zooms to the extent of the filtered features.&lt;/P&gt;&lt;P&gt;&lt;/P&gt;&lt;P&gt;I would really like the zoom when changing extents to be invisible to the end user however (i.e. the map has already zoomed to the extent of the filtered features by the time the loading screen is removed). The only way I can think to do this is to keep the loading screen up a little longer. I don't think it will be possible to set the initial extent any earlier due to needing to load the graphics layer in order to determine the filtered extent.&lt;/P&gt;&lt;P&gt;&lt;/P&gt;&lt;P&gt;I've played around with the suggestion in the thread linked above with no success. For example, I've commented out&lt;/P&gt;&lt;PRE class="lia-code-sample line-numbers language-none"&gt;&lt;CODE&gt;&lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: slategray;"&gt;html.setStyle(jimuConfig.mainPageId, 'display', 'block');&lt;/SPAN&gt;&lt;/CODE&gt;&lt;/PRE&gt;&lt;P&gt;&amp;nbsp;, in main.js , and then added&lt;/P&gt;&lt;PRE class="lia-code-sample line-numbers language-none"&gt;&lt;CODE&gt;html&lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #999999;"&gt;.&lt;/SPAN&gt;&lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #d74444;"&gt;setStyle&lt;/SPAN&gt;&lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #999999;"&gt;(&lt;/SPAN&gt;window&lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #999999;"&gt;.&lt;/SPAN&gt;jimuConfig&lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #999999;"&gt;.&lt;/SPAN&gt;loadingId&lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #999999;"&gt;,&lt;/SPAN&gt; &lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #669900;"&gt;'display'&lt;/SPAN&gt;&lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #999999;"&gt;,&lt;/SPAN&gt; &lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #669900;"&gt;'none'&lt;/SPAN&gt;&lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #999999;"&gt;)&lt;/SPAN&gt;&lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #999999;"&gt;
&lt;/SPAN&gt;html&lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #999999;"&gt;.&lt;/SPAN&gt;&lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #d74444;"&gt;setStyle&lt;/SPAN&gt;&lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #999999;"&gt;(&lt;/SPAN&gt;window&lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #999999;"&gt;.&lt;/SPAN&gt;jimuConfig&lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #999999;"&gt;.&lt;/SPAN&gt;mainPageId&lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #999999;"&gt;,&lt;/SPAN&gt; &lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #669900;"&gt;'display'&lt;/SPAN&gt;&lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #999999;"&gt;,&lt;/SPAN&gt; &lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #669900;"&gt;'block'&lt;/SPAN&gt;&lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #999999;"&gt;)&lt;/SPAN&gt;&lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #999999;"&gt;;&lt;/SPAN&gt;&lt;/CODE&gt;&lt;/PRE&gt;&lt;P&gt;, into my update-end event function but I get weird behavior and I'm not able to hide the zooming.&lt;/P&gt;&lt;P&gt;&lt;/P&gt;&lt;P&gt;Maybe it's not possible to do anything about this or maybe I just need my code in a different place?&lt;/P&gt;&lt;/BODY&gt;&lt;/HTML&gt;</description>
    <pubDate>Fri, 10 Dec 2021 20:12:43 GMT</pubDate>
    <dc:creator>MarkC1</dc:creator>
    <dc:date>2021-12-10T20:12:43Z</dc:date>
    <item>
      <title>Keep loading screen until everything has finished loading</title>
      <link>https://community.esri.com/t5/arcgis-web-appbuilder-questions/keep-loading-screen-until-everything-has-finished/m-p/5224#M140</link>
      <description>&lt;HTML&gt;&lt;HEAD&gt;&lt;/HEAD&gt;&lt;BODY&gt;&lt;P&gt;I've a problem similar to the one discussed in this thread:&lt;/P&gt;&lt;P&gt;&lt;A href="https://community.esri.com/thread/231977" target="_blank"&gt;Keep Loading Screen Up Longer in WAB&lt;/A&gt;&amp;nbsp;&lt;/P&gt;&lt;P&gt;&lt;/P&gt;&lt;P&gt;I am filtering the feature layer in my app&amp;nbsp;based on the logged in user before loading. I'm then changing the extent of the map based on the filtered features. Both of these steps are fine.&lt;/P&gt;&lt;P&gt;&lt;/P&gt;&lt;P&gt;I apply the filter in MapManager.js and then I get the extent of the filtered features using an "update-end" event like below. The event is required otherwise the graphics array will be zero presumably because the graphics layers aren't don't seem to be available yet.&lt;/P&gt;&lt;P&gt;&lt;/P&gt;&lt;PRE class="lia-code-sample line-numbers language-none"&gt;&lt;CODE&gt;this.filterManager.applyWidgetFilter("mylayer", null, "email = test@example.com");

var layer = this.map.getLayer("mylayer");

on.once(layer, 'update-end', function(){
 var myextent = graphicsUtils.graphicsExtent(layer.graphics);
 map.setExtent(myextent);
 });‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍&lt;SPAN class="line-numbers-rows"&gt;&lt;SPAN&gt;‍&lt;/SPAN&gt;&lt;SPAN&gt;‍&lt;/SPAN&gt;&lt;SPAN&gt;‍&lt;/SPAN&gt;&lt;SPAN&gt;‍&lt;/SPAN&gt;&lt;SPAN&gt;‍&lt;/SPAN&gt;&lt;SPAN&gt;‍&lt;/SPAN&gt;&lt;SPAN&gt;‍&lt;/SPAN&gt;&lt;SPAN&gt;‍&lt;/SPAN&gt;&lt;/SPAN&gt;&lt;/CODE&gt;&lt;/PRE&gt;&lt;P&gt;Anyway this all works fine. My map loads, gets filtered and then zooms to the extent of the filtered features.&lt;/P&gt;&lt;P&gt;&lt;/P&gt;&lt;P&gt;I would really like the zoom when changing extents to be invisible to the end user however (i.e. the map has already zoomed to the extent of the filtered features by the time the loading screen is removed). The only way I can think to do this is to keep the loading screen up a little longer. I don't think it will be possible to set the initial extent any earlier due to needing to load the graphics layer in order to determine the filtered extent.&lt;/P&gt;&lt;P&gt;&lt;/P&gt;&lt;P&gt;I've played around with the suggestion in the thread linked above with no success. For example, I've commented out&lt;/P&gt;&lt;PRE class="lia-code-sample line-numbers language-none"&gt;&lt;CODE&gt;&lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: slategray;"&gt;html.setStyle(jimuConfig.mainPageId, 'display', 'block');&lt;/SPAN&gt;&lt;/CODE&gt;&lt;/PRE&gt;&lt;P&gt;&amp;nbsp;, in main.js , and then added&lt;/P&gt;&lt;PRE class="lia-code-sample line-numbers language-none"&gt;&lt;CODE&gt;html&lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #999999;"&gt;.&lt;/SPAN&gt;&lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #d74444;"&gt;setStyle&lt;/SPAN&gt;&lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #999999;"&gt;(&lt;/SPAN&gt;window&lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #999999;"&gt;.&lt;/SPAN&gt;jimuConfig&lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #999999;"&gt;.&lt;/SPAN&gt;loadingId&lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #999999;"&gt;,&lt;/SPAN&gt; &lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #669900;"&gt;'display'&lt;/SPAN&gt;&lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #999999;"&gt;,&lt;/SPAN&gt; &lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #669900;"&gt;'none'&lt;/SPAN&gt;&lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #999999;"&gt;)&lt;/SPAN&gt;&lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #999999;"&gt;
&lt;/SPAN&gt;html&lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #999999;"&gt;.&lt;/SPAN&gt;&lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #d74444;"&gt;setStyle&lt;/SPAN&gt;&lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #999999;"&gt;(&lt;/SPAN&gt;window&lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #999999;"&gt;.&lt;/SPAN&gt;jimuConfig&lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #999999;"&gt;.&lt;/SPAN&gt;mainPageId&lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #999999;"&gt;,&lt;/SPAN&gt; &lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #669900;"&gt;'display'&lt;/SPAN&gt;&lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #999999;"&gt;,&lt;/SPAN&gt; &lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #669900;"&gt;'block'&lt;/SPAN&gt;&lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #999999;"&gt;)&lt;/SPAN&gt;&lt;SPAN class="" style="margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 15px; font-family: inherit; vertical-align: baseline; outline: 0px !important; color: #999999;"&gt;;&lt;/SPAN&gt;&lt;/CODE&gt;&lt;/PRE&gt;&lt;P&gt;, into my update-end event function but I get weird behavior and I'm not able to hide the zooming.&lt;/P&gt;&lt;P&gt;&lt;/P&gt;&lt;P&gt;Maybe it's not possible to do anything about this or maybe I just need my code in a different place?&lt;/P&gt;&lt;/BODY&gt;&lt;/HTML&gt;</description>
      <pubDate>Fri, 10 Dec 2021 20:12:43 GMT</pubDate>
      <guid>https://community.esri.com/t5/arcgis-web-appbuilder-questions/keep-loading-screen-until-everything-has-finished/m-p/5224#M140</guid>
      <dc:creator>MarkC1</dc:creator>
      <dc:date>2021-12-10T20:12:43Z</dc:date>
    </item>
  </channel>
</rss>

