There's a slight typo in that original code sample.new esri.esri.dijit.InfoWindowshould be new esri.dijit.InfoWindowThis works.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=7,IE=9, IE=10">
<!--The viewport meta tag is used to improve the presentation and behavior of the samples
on iOS devices-->
<meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
<title></title>
<link rel="stylesheet" href="http://js.arcgis.com/3.7/js/dojo/dijit/themes/claro/claro.css">
<link rel="stylesheet" href="http://js.arcgis.com/3.7/js/esri/css/esri.css">
<style>
html, body {
height: 100%; width: 100%;
margin: 0; padding: 0;
}
body{
background-color:white; overflow:hidden;
font-family: "Kimberley", sans-serif
}
#header {
-moz-border-radius: 5px;
border-radius:5px;
margin:5px;
padding-top: 4px;
padding-right: 15px;
background-color:#211E21;
color:#FFC98C;
font-size:16pt; text-align:right;font-weight:bold;
border: solid 2px #2A2F30;
height:55px;
}
#subheader {
font-size:small;
color: #cfcfcf;
text-align:right;
padding-right:20px;
}
#map {
margin:5px;
border:solid 4px #2A2F30;
padding:0px;
}
.shadow{
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
border-radius: 6px;
-webkit-box-shadow: 0 8px 6px -6px #999;
-moz-box-shadow: 0 8px 6px -6px #999;
box-shadow: 0 8px 6px -6px #999;
}
</style>
<script>var dojoConfig = { parseOnLoad: true };</script>
<script src="http://js.arcgis.com/3.7/"></script>
<script>
dojo.require("dijit.layout.BorderContainer");
dojo.require("dijit.layout.ContentPane");
dojo.require("esri.map");
dojo.require("dojo.number");
dojo.require("esri.layers.FeatureLayer");
dojo.require("esri.dijit.InfoWindow");
var map, trailLayer;
var template;
var soeParams;
var soeURL = "http://sampleserver4.arcgisonline.com/ArcGIS/rest/services/Elevation/ESRI_Elevation_World/MapServer/exts/ElevationsSOE/ElevationLayers/1/GetElevationProfile";
function init() {
//This sample requires a proxy page to handle communications with the ArcGIS Server services. You will need to
//replace the url below with the location of a proxy on your machine. See the 'Using the proxy page' help topic
//for details on setting up a proxy page.
esri.config.defaults.io.proxyUrl = "../proxy/proxy.php";
map = new esri.Map("map", {
basemap: "satellite",
center: [-117.069, 36.215],
zoom: 13
});
var infoWindow = new esri.dijit.InfoWindow({}, dojo.create("div", null, map.root));
map.infoWindow.resize(625, 240);
infoWindow.startup();
map.setInfoWindow(infoWindow);
//setup SOE parameters
soeParams = {};
soeParams.ImageWidth = 600;
soeParams.ImageHeight= 200;
soeParams.BackgroundColorHex="#ffffff";
soeParams.DisplaySegments=false;
soeParams.f="json";
//add the trails feature layer to the map
template = new esri.InfoTemplate();
template.setTitle("<b>${notes}</b>");
template.setContent(getTextContent);
trailLayer = new esri.layers.FeatureLayer("http://sampleserver5.arcgisonline.com/ArcGIS/rest/services/LocalGovernment/Recreation/MapServer/1", {
mode: esri.layers.FeatureLayer.MODE_ONDEMAND,
infoTemplate:template,
outFields: ["*"]
});
//create a new renderer for the feature layer
var lineSymbol = new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID,new dojo.Color([0,255,0,.70]), 5);
trailLayer.setRenderer(new esri.renderer.SimpleRenderer(lineSymbol));
map.addLayer(trailLayer);
//add world place names to the map
var referenceLayer = new esri.layers.ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/ArcGIS/rest/services/Reference/World_Boundaries_and_Places/MapServer");
map.addLayer(referenceLayer);
}
//Generate the content for the info window when the feature is clicked.
function getTextContent(graphic) {
var geometry = esri.geometry.webMercatorToGeographic(graphic.geometry);
var deferred = new dojo.Deferred();
//generate elevation profile
soeParams.InputPolyline = dojo.toJson(geometry.toJson());
esri.request({
url: soeURL,
content: soeParams,
callbackParamName: "callback",
load: function(fset) {
deferred.callback("<img src='" + fset.profileImageUrl + "'/>");
},
error: function(error) {
deferred.errback("Error occurred while generating profile");
}
});
return deferred;
}
dojo.ready(init);
</script>
</head>
<body class="claro">
<div id="mainWindow"
data-dojo-type="dijit.layout.BorderContainer"
data-dojo-props="design:'headline', gutters:false"
style="width:100%; height:100%;">
<div id="header" data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'top'">
Click a trail to view the elevation profile
</div>
<div id="map" data-dojo-type="dijit.layout.ContentPane" class="shadow" data-dojo-props="region:'top'"></div>
</div>
</body>
</html>