Where should I put javascript code when map loaded

[MaximeDemers]

Hi,

I am relatively new in developing into Web App Builder applications. I have a dummy question. I have a small snippet of javascript code to add to an application but this not part of any widget.

In fact, I want to set a refresh interval to a feature layer. What would be the ideal place for putting such snippet that needs to be executed when the map is loaded?

Thank you,

Maxime

[RobertScheitlin__GISP]

jimu.js\MapManager.js

[AndresCastillo]

Hi Robert,

What made you choose MapManager.js?

Is there documentation on the core js files that make up wab dev edition?

Once you find the file you want to insert code into, what methodology should one use to determine where in that file is ideal to execute that code?

I wrote a blog with my ideas:

https://community.esri.com/people/andrescastillo08/blog/2019/07/24/how-to-customize-an-app-using-jav...

But I'd like to see how you go about doing this.

Thank you.

[RobertScheitlin__GISP]

Andres,

   Sorry there is nothing that will guide you about which file to use, except to follow the code logic and life cycle. The MapManager is the file where the map is created so it is the most logical choice when dealing with map layers. As far as which function you have to follow the code flow and if it is a 2D map then the defered result function of the _show2DWebmap function.

[MaximeDemers]

Maybe I should create an event dispatcher accessible from the window, that will dispatch a map created event and maybe an app ready event when all widgets are loaded. Adding custom code in a mess like MapManager.js is something I don't want to do and maintain in long term.

[MaximeDemers · Accepted solution]

I finally decided to use the "mapLoaded" event published by window.topic (see dojo/topic — The Dojo Toolkit - Reference Guide ) in the MapManager.js. I put my custom code in libs/custom/custom.js, and add an entry in libs/main.js

I like this solution because, I prefer to modify WAB source code the least possible

custom.js

const REFRESH_INTERVAL = 1; //en minutes (0.5 pour 30 secondes)

define([
  'dojo/_base/declare',

], function(declare) {
  var CustomCode = declare([], {
    name: "Pannes HS éditeur custom code",

    startup: function() {
      window.topic.subscribe("mapLoaded", this._onMapLoaded.bind(this));
    },

    _onMapLoaded: function(map) {
      console.log("_onMapLoaded")
      this.map = map;
      this._setRefreshIntervales();
    },

    _setRefreshIntervales: function() {
      this.map.graphicsLayerIds.forEach(function(layerId) {
        this.map.getLayer(layerId).setRefreshInterval(REFRESH_INTERVAL);
      }.bind(this));
    }
  });

  new CustomCode().startup();

});‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍