HDFS-10493. Add links to datanode web UI in namenode datanodes page. Contributed by Weiwei Yang.

hadoop-hdfs-project/hadoop-hdfs/src/main/webapps/hdfs/dfshealth.html

@@ -300,6 +300,7 @@
   <thead>
     <tr>
       <th>Node</th>
+      <th>Http Address</th>
       <th>Last contact</th>
       <th style="width:180px; text-align:center">Capacity</th>
       <th>Blocks</th>
@@ -310,6 +311,13 @@
   {#LiveNodes}
   <tr>
     <td ng-value="{state}-{name}" class="dfshealth-node-icon dfshealth-node-{state}">{name} ({xferaddr})</td>
+    <td ng-value="{state}-{name}">
+    {@select key=secureMode}
+      {@eq value="off"}<a href='//{infoAddr}'>{infoAddr}</a>{/eq}
+      {@eq value="on"}<a href='//{infoSecureAddr}'>{infoSecureAddr}</a>{/eq}
+      {@default}<a href='//{infoAddr}'>{infoAddr}</a>{/default}
+    {/select}
+    </td>
     <td ng-value="{lastContact}">{lastContact}s</td>
     <td ng-value="{usedPercentage}">
       <div>
@@ -328,6 +336,7 @@
   {#DeadNodes}
   <tr class="danger">
     <td ng-value="{state}-{name}" class="dfshealth-node-icon dfshealth-node-{state}">{name} ({xferaddr})</td>
+    <td></td>
     <td>{#helper_relative_time value="{lastContact}"/}</td>
     <td></td>
     <td></td>

hadoop-hdfs-project/hadoop-hdfs/src/main/webapps/hdfs/dfshealth.js

@@ -210,6 +210,15 @@
         for (var i = 0, e = nodes.length; i < e; ++i) {
           var n = nodes[i];
           n.usedPercentage = Math.round((n.used + n.nonDfsUsedSpace) * 1.0 / n.capacity * 100);
+
+          var addr = n.infoSecureAddr;
+          var position = addr.lastIndexOf(":");
+          var port = addr.substring(position + 1, addr.length);
+          n.secureMode = "off";
+          if (port != 0) {
+            n.secureMode = "on";
+          }
+
           if (n.adminState === "In Service") {
             n.state = "alive";
           } else if (nodes[i].adminState === "Decommission In Progress") {
@@ -248,6 +257,7 @@
           $('#table-datanodes').dataTable( {
             'lengthMenu': [ [25, 50, 100, -1], [25, 50, 100, "All"] ],
             'columns': [
+              { 'orderDataType': 'ng-value', 'searchable': true },
               { 'orderDataType': 'ng-value', 'searchable': true },
               { 'orderDataType': 'ng-value', 'type': 'numeric' },
               { 'orderDataType': 'ng-value', 'type': 'numeric' },