Sometimes the home button does not load on the map

[EdwardSohn1]

Following is the code that loads the home button on the map:
but sometimes the home button does not load.
(This also happens to the geolocation button as well).
Please see attached screenshot.  This is where the home button and the geoloc button "did" load.
But sometimes these buttons do not load (just missing).  Otherwise the application functions normally.

This seems to happen initially when the browser is started.  And once the refresh browser button is hit, usually the home/geoloc buttons do load.  Sometimes however, this condition persists until after several refreshes.

Other times other parts of the UI fail to load (such as the tools buttons, and even sections of the basemap).

Users can hit refresh browser to load the map completely, but would like to avoid this scenario.


var homeButton = $('<div class="esriSimpleSliderIncrementButton"><img style="vertical-align: -2px;" src="map.web/resources/icons/mapcommand-home.png"></div>');

homeButton.fastClick(function () {
if( homeClickCallback && typeof homeClickCallback == 'function' )
  homeClickCallback(map._params.extent);
else
  map.setExtent(map._params.extent);
});
  
$(map.container).find('.esriSimpleSlider div:nth-child(1)').after(homeButton);

///////////////////////////////////////////////////////////////////////////////////////

Also this may be related issue but sometimes get the javascript error:

"require is not defined" at (and I may not be doing the following correctly but...):
This happened sporadically (very rarely) and seem independent of the above behavior however:

  require(["dojo"], function (dojo) {
                dojo.addOnLoad(
                    function () {
                        require([
                                "dojo/i18n!./map.web/resources/nls/template.js?v=" + version,
                                "storymaps/ui/loadingIndicator/LoadingIndicator",
                                "esri/urlUtils",
                                "esri/layers/GraphicsLayer",
                                "esri/layers/FeatureLayer",
                                "storymaps/utils/Helper",
                                "dijit/TooltipDialog",
                                "esri/renderers/SimpleRenderer",
                                "esri/tasks/query",
                                "esri/lang",
                                "dojo/dom-style",
                                "dijit/popup",
                                "esri/graphic",
                                "esri/dijit/BasemapGallery",
                                "esri/dijit/Scalebar",
                                "dojo/fx/Toggler",
                                "dojo/fx",
                                "dojo/dom",
                                "dojo/on",
                                "dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dijit/TitlePane", "esri/arcgis/utils", "dojo/parser",
                                "templateConfig/commonConfig.js?v=" + version,
                                "dojo/domReady!",
                                "dojo/ready"
                        ], function (
                                _i18n,
                                LoadingIndicator,
                                urlUtils,
                                GraphicsLayer,
                                FeatureLayer,
                                Helper,
                                TooltipDialog,
                                SimpleRenderer,
                                _query,
                                esriLang,
                                domStyle,
                                dijitPopup,
                                Graphic,
                                BasemapGallery,
                                Scalebar,
                                Toggler,
                                coreFx,
                                dom,
                                on
                            ) { ....

[EdwardSohn1]

This "may" have to do with loading of jquery libraries.

Was doing

loadJS('map.web/lib/_jquery-1.10.2.min.js');
somewhere in the body of the home page.

Moved it to the header:

  <script src="map.web/lib/_jquery-1.10.2.min.js"></script>

[EdwardSohn1]

Actually the issue also had to do with underlying javascript implementation with deferreds.
The events for adding those home/geoloc buttons had to be put after the map loaded.

[EdwardSohn1]

These steps resolved some of the issues.  The issue with some of the images not loading (including dojo buttons) still appear to happen sometimes....  and goes away after refreshing.

[JonathanUihlein]

Your dependencies aren't loaded in the correct order.

For example, you attempt to load "esri/arcgis/utils", "dojo/parser" and "dojo/ready" but there's no variable assignment in the following function.

Also, is there a particular reason you have this bit of code:

require(["dojo"], function (dojo) {
                dojo.addOnLoad(
                    function () {
                        require([...

[KenBuja]

Your dependencies aren't loaded in the correct order.

For example, you attempt to load "esri/arcgis/utils", "dojo/parser" and "dojo/ready" but there's no variable assignment in the following function.

The variable names in the function have to be in the same order as modules in the require (which they appear to be in this case), but the modules loaded in the require part don't necessarily need a variable name in the function. These just have to come after the last module with a variable name.

[JonathanUihlein]

The variable names in the function have to be in the same order as modules in the require (which they appear to be in this case), but the modules loaded in the require part don't necessarily need a variable name in the function. These just have to come after the last module with a variable name.

I believe you need a variable name in the function if you intend to invoke the module directly in code (which sohnem2 did, as apparent by his code).

Do you have any advice for sohnem2, Ken?

[KenBuja]

I'm not seeing any code that makes reference to those modules.

[JonathanUihlein]

I'm not seeing any code that makes reference to those modules.

I'm not sure that's advice for sohnem2.

Thank you for your valuable contribution to this thread; we both appreciate it.

[EdwardSohn1]

I changed to:

                dojo.addOnLoad(
                    function () {
                        require([
                                "dojo/i18n!./map.web/resources/nls/template.js?v=" + version,
                                "storymaps/ui/loadingIndicator/LoadingIndicator",
                                "esri/urlUtils",
                                "esri/layers/GraphicsLayer",
                                "esri/layers/FeatureLayer",
                                "storymaps/utils/Helper",
                                "dijit/TooltipDialog",
                                "esri/renderers/SimpleRenderer",
                                "esri/tasks/query",
                                "esri/lang",
                                "dojo/dom-style",
                                "dijit/popup",
                                "esri/graphic",
                                "esri/dijit/BasemapGallery",
                                "esri/dijit/Scalebar",
                                "dojo/fx/Toggler",
                                "dojo/fx",
                                "dojo/dom",
                                "dojo/on",
                                "dijit/layout/BorderContainer",
                                "dijit/layout/ContentPane",
                                "dijit/TitlePane",
                                "esri/arcgis/utils",
                                "dojo/parser",
                                "templateConfig/commonConfig.js?v=" + version,
                                "dojo/domReady!",
                                "dojo/ready"
                        ], function (
                                _i18n,
                                LoadingIndicator,
                                urlUtils,
                                GraphicsLayer,
                                FeatureLayer,
                                Helper,
                                TooltipDialog,
                                SimpleRenderer,
                                _query,
                                esriLang,
                                domStyle,
                                dijitPopup,
                                Graphic,
                                BasemapGallery,
                                Scalebar,
                                Toggler,
                                coreFx,
                                dom,
                                on,
                                BorderContainer,
                                ContentPane,
                                TitlePane,
                                arcgisUtils,
                                Parser,
                                templateConfig,
                                domReady,
                                ready
                            ) {

added additional variables, (and yes those additional variables are not being called in the function so may not be needed).  Also took out the first require.

I still get the loading issue, please see attached image.  This is sporadic and goes away if user just refreshes the browser.  I would like it to load properly at first however.