Keep Loading Screen Up Longer in WAB

NathanHeickLACSD

Is anyone familiar with where and how to modify the behavior of the loading screen?  Sometimes it comes up and sometimes it doesn't.  Either way, it seems to go away when the map is loaded.  Then, I will see the map for about 6 seconds while all the header controller and other widgets are loading up.  I am using the Splash widget too.  I want the loading screen to stay up behind the Splash widget until it is closed.  If I could get that to happen, I might get a nice background image for the loading screen and get a nice loading GIF.  So, does anyone know where this part of the code is?

Thanks,

Nathan

RobertScheitlin__GISP

Nathan,

   Having the app loading screen stay up until the user click on the splash screen is Not an option. It is possible to have the App Loading stay visible until the Splash Screen is shown. This would eliminate the map and header widget not being ready before the loading screen is removed issue. In the main.js file in your app find the "onAppConfigChanged" function and comment out these lines (8 and 9):

    <SPAN class="keyword token">function</SPAN> <SPAN class="token function">onAppConfigChanged</SPAN><SPAN class="punctuation token">(</SPAN>_appConfig<SPAN class="punctuation token">,</SPAN> reason<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">{</SPAN>
      appConfig <SPAN class="operator token">=</SPAN> _appConfig<SPAN class="punctuation token">;</SPAN>

      <SPAN class="keyword token">if</SPAN><SPAN class="punctuation token">(</SPAN>reason <SPAN class="operator token">===</SPAN> <SPAN class="string token">'loadingPageChange'</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">{</SPAN>
        <SPAN class="keyword token">return</SPAN><SPAN class="punctuation token">;</SPAN>
      <SPAN class="punctuation token">}</SPAN>

      <SPAN class="comment token">//html.setStyle(jimuConfig.loadingId, 'display', 'none');</SPAN>
      <SPAN class="comment token">//html.setStyle(jimuConfig.mainPageId, 'display', 'block');</SPAN>
    <SPAN class="punctuation token">}</SPAN><SPAN class="line-numbers-rows"><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN></SPAN>

Then in the splash widget.js in the onOpen function make these additions (lines 8 and 9):

      onOpen<SPAN class="punctuation token">:</SPAN> <SPAN class="keyword token">function</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
        <SPAN class="keyword token">if</SPAN> <SPAN class="punctuation token">(</SPAN><SPAN class="operator token">!</SPAN>utils<SPAN class="punctuation token">.</SPAN><SPAN class="token function">isInConfigOrPreviewWindow</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
          <SPAN class="keyword token">var</SPAN> isFirstKey <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN><SPAN class="token function">_getCookieKey</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
          <SPAN class="keyword token">var</SPAN> isfirst <SPAN class="operator token">=</SPAN> <SPAN class="token function">cookie</SPAN><SPAN class="punctuation token">(</SPAN>isFirstKey<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
          <SPAN class="keyword token">if</SPAN> <SPAN class="punctuation token">(</SPAN>esriLang<SPAN class="punctuation token">.</SPAN><SPAN class="token function">isDefined</SPAN><SPAN class="punctuation token">(</SPAN>isfirst<SPAN class="punctuation token">)</SPAN> <SPAN class="operator token">&&</SPAN> isfirst<SPAN class="punctuation token">.</SPAN><SPAN class="token function">toString</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="operator token">===</SPAN> <SPAN class="string token">'false'</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
            <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN><SPAN class="token function">close</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
          <SPAN class="punctuation token">}</SPAN>
          html<SPAN class="punctuation token">.</SPAN><SPAN class="token function">setStyle</SPAN><SPAN class="punctuation token">(</SPAN>window<SPAN class="punctuation token">.</SPAN>jimuConfig<SPAN class="punctuation token">.</SPAN>loadingId<SPAN class="punctuation token">,</SPAN> <SPAN class="string token">'display'</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="string token">'none'</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
          html<SPAN class="punctuation token">.</SPAN><SPAN class="token function">setStyle</SPAN><SPAN class="punctuation token">(</SPAN>window<SPAN class="punctuation token">.</SPAN>jimuConfig<SPAN class="punctuation token">.</SPAN>mainPageId<SPAN class="punctuation token">,</SPAN> <SPAN class="string token">'display'</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="string token">'block'</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
        <SPAN class="punctuation token">}</SPAN>
        <SPAN class="comment token">// if (true === this._requireConfirm) {</SPAN>
        <SPAN class="comment token">//   //checkbox</SPAN>
        <SPAN class="comment token">//   this.confirmCheck.focus();</SPAN>
        <SPAN class="comment token">// } else if ((false === this._requireConfirm && false === this._showOption) ||</SPAN>
        <SPAN class="comment token">//   (false === this._requireConfirm && true === this._showOption)) {</SPAN>
        <SPAN class="comment token">//   this.okNode.focus();</SPAN>
        <SPAN class="comment token">// }</SPAN>
        <SPAN class="keyword token">if</SPAN> <SPAN class="punctuation token">(</SPAN><SPAN class="operator token">!</SPAN><SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>_requireConfirm <SPAN class="operator token">&&</SPAN> <SPAN class="operator token">!</SPAN><SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>_showOption<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
          <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>okNode<SPAN class="punctuation token">.</SPAN><SPAN class="token function">focus</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
        <SPAN class="punctuation token">}</SPAN> <SPAN class="keyword token">else</SPAN> <SPAN class="punctuation token">{</SPAN>
          <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>confirmCheck<SPAN class="punctuation token">.</SPAN><SPAN class="token function">focus</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
        <SPAN class="punctuation token">}</SPAN>

        <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN><SPAN class="token function">_eventShow</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
      <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">,</SPAN><SPAN class="line-numbers-rows"><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN></SPAN>