Whats wrong with my logic?

RachelAlbritton · ‎04-21-2016

I am trying to set the contents of an infoTemplate based on an if/else statement, however, its not giving me the results that I would expect. Certain fields in the 'thumbnails' field contain a field that is call 'NoImage2.jpg'. If the field contains this title I want this field removed from the infotemplate window. When I test the logic, the infotemplate always returns the else statement. If I remove the else statement and have the function only evaluate the if statement, the windows comeback blank, even for the objects that it should apply to. I'm clearly overlooking something but I can't figure it out. Thanks in advance.

 map = new Map("map",{
          basemap: "streets",
          center:[-111.836, 40.765], //long, lat
          zoom: 14
        });
            
            bldgContentObject = {
            objectid: '${OBJECTID}',
            formalName: '"${formal_name:formatStructureNameForThumbnailModal}"',
            informalName: '"${informal_name:formatStructureNameForThumbnailModal}"',
            streetAddress: '${street_address}',
            city: '${city}',
            state: '${state}',
            zipCode: '${zip_code}',
            thumbnails: '${thumbnails}',
            buildingNumber: '${building_number}',
            abbreviation: '${abbreviation}',
            lattitude: '${lattitude:gsvLat}',
            longitude: '${longitude:gsvLon}',
            gsvHeading: '${gsv_heading:gsvHeading}',
            gsvPitch: '${gsv_pitch:gsvPitch}'
          };
          
        symbol = new SimpleFillSymbol(SimpleFillSymbol.STYLE_NULL,
        new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID)); //new Color([0,0,0])), new Color([0,0,0]));
        //infoTemplate = new InfoTemplate("${informal_name}", "<b>BN: </b>${building_number}<br><b>Abbrv: </b>${abbreviation}<br><b>Thumbnail: </b>${thumbnails}<br>");
        
        infoTemplate = new InfoTemplate();
        infoTemplate.setTitle (bldgContentObject.informalName);
        var infoContent1 = "<b>BN: </b>"+bldgContentObject.buildingNumber+"<br><b>Thumbnail: </b>"+bldgContentObject.thumbnails;
      var infoContent2 = "<b>BN: </b>"+bldgContentObject.buildingNumber;
        //infoTemplate.setContent("<b>BN: </b>${building_number}<br><b>Abbrv: </b>${abbreviation}<br><b>Thumbnail: </b>${thumbnails}<br>"); //Works
        //infoTemplate.setContent(infoContent1); //This logic works
        infoTemplate.setContent(templateContent());
    
        function templateContent (){
    //return bldgContentObject.thumbnails; //name in the thumbnails field (string)
        if (bldgContentObject.thumbnails === "'NoImage2.jpg'"){return infoContent2;} //returns a content window with only the title
        //if (bldgContentObject.thumbnails === "NoImage2.jpg"){return infoContent2;}) //same results as above
        //if bldgContentObject.thumbnails === '"NoImage2.jpg"'){return infoContent2;}// same results as above
    else {return infoContent1;}
        
        }
        
        map.on("click", doQuery);
        
        queryTask = new QueryTask("http://fmags.fm.utah.edu/arcgis/rest/services/mapservices/public_basemap_2014/MapServer/41");
        queryTask.on("complete", addToMap);
           
        query = new Query();
        query.returnGeometry = true;
        query.outFields = ["*"];
           
      });
      
          function doQuery(evt) {
        //clear currently displayed results
        map.graphics.clear();
               
        query.geometry = evt.mapPoint;
            query.outSpatialReference  = map.spatialReference;
        queryTask.execute(query);
          }
            
        function addToMap(results) {           
        var featureArray = results.featureSet.features;
            var feature = featureArray[0];          
            map.graphics.add(feature.setSymbol(symbol).setInfoTemplate(infoTemplate));
      }
    </script>
  </head>

  <body>
    <div id="map"></div>
  </body>
</html>

RobertScheitlin__GISP · ‎04-21-2016

Rachel,

OK, keep the setContent the way you had it but update your function to this and see if it works for you:

function templateContent (graphic){     
    if (graphic.attributes.thumbnails === "NoImage2.jpg"){
        return infoContent2;
    } else {
        return infoContent1;
    } 
}

RachelAlbritton · ‎04-21-2016

Thanks for the suggestion, but it still doesn't work. The popup gives me the title, but the content window just says "no information available"

RobertScheitlin__GISP · ‎04-21-2016

Rachel,

Try adding in a console.info in the function then.

function templateContent (graphic){

console.info(graphic.attributes.thumbnails);

if (graphic.attributes.thumbnails === "NoImage2.jpg"){

return infoContent2;

} else {

return infoContent1;

}

RachelAlbritton · ‎04-28-2016

Robert -

Sorry for the delayed response - following all of your advice I melded a few of the methods together and I got it to work:

//Create infoTemplate

infoTemplate = new InfoTemplate("${informal_name}",infoContent);

function infoContent (graphic){

if (graphic.attributes.thumbnails === "NoImage2.jpg")

{content = "BN: "+graphic.attributes.building_number+" Abbrv: "+graphic.attributes.abbreviation+" ";}

else

{content = "BN: "+graphic.attributes.building_number+" Abbrv: "+graphic.attributes.abbreviation+" Photo Name: "+graphic.attributes.thumbnails;}

console.log(graphic.attributes.thumbnails);

return content;

}

The resource page you linked me to (Format info window content | Guide | ArcGIS API for JavaScript ) was especially helpfull as well. It just took some time reading and reading all the examples.

Thank you for your help!

KenBuja · ‎04-28-2016

Since part of your content is the same for both cases, you could do this

function infoContent (graphic){
    content = "<b>BN: </b>"+graphic.attributes.building_number+"<br><b>Abbrv: </b>"+graphic.attributes.abbreviation+"<br>";
    if (graphic.attributes.thumbnails !== "NoImage2.jpg"){
        content += "<b>Photo Name: </b>"+graphic.attributes.thumbnails;
    }
    console.log(graphic.attributes.thumbnails);
    return content;
}