AnsweredAssumed Answered

InfoWindow content populated by function

Question asked by schlot on Aug 7, 2015
Latest reply on Aug 10, 2015 by schlot

I have a complicated definition for infoTemplate content which I'm populating with a function.  Because I'm using bootstrap-map, there's some issue with the 'Zoom to' not getting applied in the footer the way you'd expect.  I've managed this with code, but now I'm attempting to split this functionality out into it's own myinfoTemplate.js file. ( I'm attempting to break free of my spaghetti code habits.) 

 

define ([  
"dojo/dom-construct",
"dojo/on",
"dojo/dom",
"dojo/query",

      ] , function (domConstruct,on,dom,query) {  
    return {
      generateInfoContent: function(graphic){
        var currentGraphic = graphic;
        var formatString = "";
        var addrTest = graphic.attributes.AD_LINE1;
        var addr2Test = graphic.attributes.AD_LINE2;
        var provCode = graphic.attributes.ID_PROV_TYPE_FK;
        var specCode = graphic.attributes.ID_SPECIALTY_FK;
        var locTest = graphic.attributes.LOC_CODE.substring(0, 1);
        var phoneTest = phoneFormatter(graphic.attributes.PH_NUMBER);
        
        
        formatString = "<b>" + graphic.attributes.NA_PROVIDER + "</b>";
        if (addrTest.length > 1) {
          formatString += "<br>" + addrTest;
        }
        if (addr2Test.length > 1) {
          formatString += "<br>" + addr2Test; 
        }
        formatString += "<br>" + graphic.attributes.AD_CITY + ", " + graphic.attributes.AD_STATE + "  " + graphic.attributes.AD_ZIP_CODE +
        "<br>" //+        phoneTest;
        if (locTest) {
          formatString = formatString + "</br> ** Location Approximate ** ";
        }
        //popup from bootstrap doesn't display Zoom To link, so add it here       


         if (!dom.byId('zoomLink')) {
         var link = domConstruct.create("a", {
         "class": "action zoomTo myZoom",
         "id": "zoomLink",
         "title": "My Zoom",
         "innerHTML": "Zoom To", //text that appears in the popup for the link
         "href": "javascript: void(0);"
         }, query(".sizer", map.infoWindow.domNode)[1]); //fails on this line, cannot read property 'infoWindow' of undefined
         on(link, "click", this.zoomTo);

 //dom.byId('toMessage').innerHTML = "Address for: " + graphic.attributes.NA_PROVIDER;      
        
        //formats phone number to contain () and dash - used by setInfoContent and queryHandler_populateProviders
        function phoneFormatter(input){
          var area = input.substr(0, 3);
          var pre = input.substr(3, 3);
          var suf = input.substr(6, 4);
          return "(" + area + ") " + pre + "-" + suf;
        }
        
        function zoomTo(){
          var geom = currentGraphic.geometry;
          var lod = map.getLevel();
          if (lod < 8) {
            map.centerAndZoom(geom, 8);
          }
          else {
            map.centerAndZoom(geom, lod + 1);
          }
          map.infoWindow.setFeatures(currentGraphic);
          map.infoWindow.show(currentGraphic.geometry);
          
        }
        return formatString;
      } 
    }
});

 

Now that's it's separate, it gets hung up on  }, query(".sizer", this.map.infoWindow.domNode)[1]);.  How do I tell it what 'map' is?

 

I'm calling this from my map.js file as

      var infoTemplate = new InfoTemplate();
  infoTemplate.setTitle("Site Information");
  infoTemplate.setContent(myInfoTemplate.generateInfoContent); 

 

This all works when I comment out the lines that deal with the link.  But I need that part! 

Outcomes