<html><head>

	<link href="css/esrpartstyle.css" rel="stylesheet" type="text/css">
	<script src="../../ClientGlobalContext.js.aspx" type="text/javascript"></script>
	<script src="../../bah_jquery1.4.1.min.js" type="text/javascript"></script>
	<script src="../../bah_SDK.REST.js" type="text/javascript"></script>
	<script>
	    var _esrObj = null;

	    function buildQueryFilter(field, value, and) {
	        if (value == '') {
	            if (and) {
	                return " and " + field + " eq null";
	            } else {
	                return field + " eq null";
	            }
	        }
	        else {
	            if (and) {
	                return " and " + field + " eq '" + value + "'";
	            } else {
	                return field + " eq '" + value + "'";
	            }
	        }

	    }

	    function getParameterByName(name, url) {
	        if (!url) url = window.location.href;
	        name = name.replace(/[\[\]]/g, "\\$&");
	        var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
                results = regex.exec(url);
	        if (!results) return null;
	        if (!results[2]) return '';
	        return decodeURIComponent(results[2].replace(/\+/g, " "));
	    }

	    function doPageLoad() {
	        var esrEndpoint = "";
	        var datavalue = getParameterByName('data');
	        if(datavalue != null){
	            var params = decodeURIComponent(datavalue).split("&");
	            for (var i in params) {
	                params[i] = params[i].replace(/\+/g, " ").split("=");
	                if (params[i][0] == "esr") {
	                    esrEndpoint = params[i][1];
	                }
	            }
	        }
	        if (esrEndpoint != "") {
	            $.ajax({
	                url: esrEndpoint,
	                dataType: 'json',
	                timeout: 4000,
	                error: function () {
	                    _esrObj = null;
	                    outputData();
	                },
	                success: function (result) {
	                    _esrObj = result;
	                    outputData();
	                }
	            });
	        }
	    }

	    function outputData() {
	        //reset display fields
	        $('#DataGrid tbody').empty();

	        //set display fields
	        if (_esrObj != null) {
	            if (!_esrObj.ErrorOccurred) {
	                if ("Demographics" in _esrObj.Data) {
						if (_esrObj.Data.Demographics != null && "ContactInfo" in _esrObj.Data.Demographics) {
							if (_esrObj.Data.Demographics.ContactInfo != null && "Phones" in _esrObj.Data.Demographics.ContactInfo){
								if (_esrObj.Data.Demographics.ContactInfo.Phones != null && "Phone" in _esrObj.Data.Demographics.ContactInfo.Phones) {
									if(Array.isArray(_esrObj.Data.Demographics.ContactInfo.Phones.Phone)){
										for (var i = 0; i < _esrObj.Data.Demographics.ContactInfo.Phones.Phone.length; ++i) {
											var phoneNumber = _esrObj.Data.Demographics.ContactInfo.Phones.Phone[i].PhoneNumber;
											var phoneType = _esrObj.Data.Demographics.ContactInfo.Phones.Phone[i].Type;
											$('#DataGrid tr:last').after('<tr><td>'+phoneNumber+'</td><td>'+phoneType+'</td></tr>');
										}
									}
								}
							}
						}
					}
	            }
	        }
	    }

		$(function() {
            doPageLoad();

		});
</script>
<meta charset="utf-8"></head>
<body>
<div class="panel panel-primary" id="DataGridContainer">
    <div class="panel-heading">Phone numbers</div>
    <div class="panel-body">
        <div id="GridTableWrapper">
            <table class="table table-condensed table-striped" id="DataGrid">
                <thead>
                <tr>
                    <th>Phone number</th>                    
                    <th>Type</th>
                </tr>
                </thead>
                <tbody>
                </tbody>
            </table>
        </div>
    </div>
</div>


</body></html>