Change widget labels or tooltips for on-screen widgets

NickHarvey

Hi All - I'm trying to set the tooltips or labels for my on-screen widgets in WAB DE 1.2....Two in particular that I'm unable to change/set are the Home Button and the My Location button.  There are label settings in the main config.json (ex:  "label": "Home Button",) for the on-screen widgets, but changing them, restarting WAB and clearing the cache doesn't appear to help)...It appears that my in-panel widgets can be set in each nls\strings.js (For example I can change the tool tip / label for the Legend widget to "My Legend" with success).  Any assistance, tips appreciated.  

thanks!

-Nick 

RobertScheitlin__GISP

Nick,

  If you look at the code in the MyLocation widget you will notice that the LocateButton dijit is never really added to the HTML so you will never see the LocateButton dijits UI. WAB just uses the LocateButton in code so you could set the tooltip to whatever you want but you would never see it.

Also the correct code would be esriBundle.widgets.locateButton.locate.title (not sure where you got zoomLocateButton).

Here is what you can do to the MyLocation widget to get tooltips though:

Lines: 34, 43, 48, 54, 57

define([
    'dojo/_base/declare',
    'jimu/BaseWidget',
    "esri/dijit/LocateButton",
    'dojo/_base/html',
    'dojo/on',
    'dojo/_base/lang',
    'jimu/dijit/Message',
    'dojo/touch'
  ],
  function(
    declare,
    BaseWidget,
    LocateButton,
    html,
    on,
    lang) {
    var clazz = declare([BaseWidget], {

      name: 'MyLocation',
      baseClass: 'jimu-widget-mylocation',

      startup: function() {
        this.inherited(arguments);
        this.placehoder = html.create('div', {
          'class': 'place-holder'
        }, this.domNode);

        if (window.navigator.geolocation) {
          this.own(on(this.placehoder, 'click', lang.hitch(this, this.onLocationClick)));
        } else {
          html.setAttr(this.placehoder, 'title', this.nls.browserError);
        }
        this.placehoder.title = "Find Nick's Location";
      },

      onLocationClick: function() {
        if (html.hasClass(this.domNode, "onCenter") ||
          html.hasClass(this.domNode, "locating")) {
          html.removeClass(this.domNode, "onCenter");
          html.removeClass(this.placehoder, "tracking");
          this._destroyGeoLocate();
          this.placehoder.title = "Find Nick's Location";
        } else {
          this._createGeoLocate();
          this.geoLocate.locate();
          html.addClass(this.placehoder, "locating");
          this.placehoder.title = "Locating";
        }
      },

      onLocate: function(parameters) {
        html.removeClass(this.placehoder, "locating");
        this.placehoder.title = "Find Nick's Location";
        if (this.geoLocate.useTracking) {
          html.addClass(this.placehoder, "tracking");
          this.placehoder.title = "Tracking Nick's location";
        }

        if (parameters.error) {
          console.error(parameters.error);
          // new Message({
          //   message: this.nls.failureFinding
          // });
        } else {
          html.addClass(this.domNode, "onCenter");
          this.neverLocate = false;
        }
      },

      _createGeoLocate: function() {
        var json = this.config.locateButton;
        json.map = this.map;
        // json.useTracking = true;
        json.centerAt = true;
        this.geoLocate = new LocateButton(json);
        this.geoLocate.startup();

        this.geoLocate.own(on(this.geoLocate, "locate", lang.hitch(this, this.onLocate)));
      },

      _destroyGeoLocate: function() {
        if (this.geoLocate) {
          this.geoLocate.clear();
          this.geoLocate.destroy();
        }

        this.geoLocate = null;
      },

      destroy: function() {
        this._destroyGeoLocate();
        this.inherited(arguments);
      }
    });
    clazz.inPanel = false;
    clazz.hasUIFile = false;
    return clazz;
  });