topic Re: Keep Loading Screen Up Longer in WAB in ArcGIS Web AppBuilder Questions

Keep Loading Screen Up Longer in WAB

NathanHeickLACSD — Wed, 10 Apr 2019 15:53:27 GMT

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

Re: Keep Loading Screen Up Longer in WAB

RobertScheitlin__GISP — Sat, 11 Dec 2021 09:08:30 GMT

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):

    function onAppConfigChanged(_appConfig, reason){
      appConfig = _appConfig;

      if(reason === 'loadingPageChange'){
        return;
      }

      //html.setStyle(jimuConfig.loadingId, 'display', 'none');
      //html.setStyle(jimuConfig.mainPageId, 'display', 'block');
    }‍‍‍‍‍‍‍‍‍‍

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

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

        this._eventShow();
      },‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Re: Keep Loading Screen Up Longer in WAB

NathanHeickLACSD — Tue, 16 Apr 2019 23:15:27 GMT

Hi Robert,

I tried your solution, but it had a lot of unintended side effects. In IE, there was a big blue box at the top of the top screen and the splash screen had formatting issues. In Chrome, it didn't display the blue screen at all.

Re: Keep Loading Screen Up Longer in WAB

RobertScheitlin__GISP — Wed, 17 Apr 2019 12:33:45 GMT

Nathan,

I did all my testing in Chrome and I just tested in IE11 and Firefox and all work great...

Re: Keep Loading Screen Up Longer in WAB

NathanHeickLACSD — Wed, 17 Apr 2019 17:10:06 GMT

Sorry, I found my mistake. I copied the code from the main.js file to the Widget.js file, not noticing the difference between jimuConfig and window.jimuConfig.

After I fixed that, it worked pretty well. The Splash widget scrollbar does not show up for some reason. Due to some of my customizations, I got better results by only making the change for the loading page and displaying the main page in main.js. That way, the map and legend finish loading up completely behind the loading page and are fully ready when the loading page is hidden.

Either way, thanks for pointing me to where to begin.