Draw toolbar tooltips

[TimWitt2]

Hey everybody,

I am trying to dynamically change the draw tooltips. I know if I just want to change the text one time I can access it by using

i.e.

esri.bundle.toolbars.draw.resume = "New text here";

But what If I want to change the innerHTML constantly during a mouse-move event?

Would I have to access it like this?

dojo.byId ("whatever the id of the draw tool tooltip is for resume").innerHTML = evt.x;

I am having a hard time finding the Id. Or is there a different way to do this?

Thanks!

Tim

[KellyHutchins]

One option would be to modify the text when the mouse moves:

on(map.graphics, "mouse-move",function(){

            esri.bundle.toolbars.draw.resume = "mouse moving";

});

[TimWitt2]

Thanks for the reply Kelly,

when I try that it doesn't work. However it works when I update the innerHTML in a div that I placed into a pane.

linelenMouseEvt = map.on("mouse-move", function (evt) {  
  if (clickedPointsArr.length > 0) {  
  distParams = new DistanceParameters();  
  var mp = evt.mapPoint; 
  distParams.distanceUnit = geometryService.UNIT_FOOT;
  distParams.geometry1 = clickedPointsArr[clickedPointsArr.length - 1];  
  distParams.geometry2 = mp;  
  distParams.geodesic = true;  
  geometryService.distance(distParams, function (distance) {  
  lastdrawnsegmentlength = distance;  
  totalsegmentlength1 = previousSegmentLength;  
  totalsegmentlength = totalsegmentlength1 + lastdrawnsegmentlength;  
  totalLength = parseFloat(totalsegmentlength).toFixed(2);
  console.log(totalLength);
  dojo.byId("current").innerHTML = totalLength; // works here
  esri.bundle.toolbars.draw.resume = totalLength; // doesn't work here
  }); 
  }
  });

Once I finish my first drawing, the last number shows up in the esri.bundle.toolbars.draw.resume tooltip box, once I start drawing the second line.

Tim

[TimWitt2]

Kelly Hutchins I assume this doesn't work because the tooltip is not created in the "mouse-move" function?

[BenFousek]

Tim,

Check this out hardcider/Measure.js at master · btfou/hardcider · GitHub . It's a tooltip updater method in my measure widget. Look at line 218. You need to call the toolbar's _setTooltipMessage() method every time you want the tooltip to update.

This widget relies on helper methods extending esri/map. this.map.setDrawTooltips({}) calls this method:

//set/reset draw tooltips
setDrawTooltips: function(draw) {
    draw = draw || {};
    var defaults = {
        addMultipoint: 'Click to start adding points',
        addPoint: 'Click to add a point',
        addShape: 'Click to add a shape, or press down to start and let go to finish',
        complete: 'Double-click to finish',
        finish: 'Double-click to finish',
        freehand: 'Press down to start and let go to finish',
        resume: 'Click to continue drawing',
        start: 'Click to start drawing'
    };
    lang.mixin(esriBundle.toolbars.draw, defaults, draw);
}

[TimWitt2]

Thanks Ben, I'll check it out!

[BenFousek]

Hey Tim Witt‌. Somebody pointed out your Advanced Draw fiddle to me the other day. Nice work. Just realized it was yours. I'm updating/reworking my draw module for another project. You have a quite a bit of the same features but here's my old one hardcider/viewer/js/hardcider/draw at master · btfou/hardcider · GitHub. It just provides methods (dev must provide buttons, etc in app) but the new one will be an all encompassing templated widget.