GUI -- Host view implemented on client and server side.

Change-Id: I5b84f75e0843a5a669e4661bb9db41e81b78a78d
diff --git a/web/gui/src/main/webapp/app/view/host/host.css b/web/gui/src/main/webapp/app/view/host/host.css
index 2b97bfb..f8a60fb 100644
--- a/web/gui/src/main/webapp/app/view/host/host.css
+++ b/web/gui/src/main/webapp/app/view/host/host.css
@@ -15,9 +15,9 @@
  */
 
 /*
- ONOS GUI -- Device View -- CSS file
+ ONOS GUI -- Host View -- CSS file
  */
 
-#ov-device th {
+#ov-host th {
     cursor: pointer;
 }
\ No newline at end of file
diff --git a/web/gui/src/main/webapp/app/view/host/host.html b/web/gui/src/main/webapp/app/view/host/host.html
index 7ab65e2..722a92a 100644
--- a/web/gui/src/main/webapp/app/view/host/host.html
+++ b/web/gui/src/main/webapp/app/view/host/host.html
@@ -7,34 +7,22 @@
            sort-callback="sortCallback(urlSuffix)">
         <thead>
             <tr>
-                <th colId="available"></th>
-                <th colId="type"></th>
                 <th colId="id" sortable>Host ID </th>
-                <th colId="mfr" sortable>Vendor </th>
-                <th colId="hw" sortable>H/W Version </th>
-                <th colId="sw" sortable>S/W Version </th>
-                <th colId="chassisid" sortable>Chassis ID </th>
-                <th colId="serial" sortable>Serial # </th>
-                <th colId="protocol" sortable>Protocol </th>
+                <th colId="mac" sortable>MAC Address </th>
+                <th colId="vlan" sortable>VLAN ID </th>
+                <th colId="ips" sortable>IP Addresses </th>
+                <th colId="location" sortable>Location </th>
             </tr>
         </thead>
 
         <tbody>
         <tr ng-repeat="host in ctrl.hostData"
             ng-repeat-done>
-            <td class="table-icon">
-                <div icon icon-id="{{host._iconid_available}}"></div>
-            </td>
-            <td class="table-icon">
-                <div icon icon-id="{{host._iconid_type}}"></div>
-            </td>
             <td>{{host.id}}</td>
-            <td>{{host.mfr}}</td>
-            <td>{{host.hw}}</td>
-            <td>{{host.sw}}</td>
-            <td>{{host.chassisid}}</td>
-            <td>{{host.serial}}</td>
-            <td>{{host.protocol}}</td>
+            <td>{{host.mac}}</td>
+            <td>{{host.vlan}}</td>
+            <td>{{host.ips}}</td>
+            <td>{{host.location}}</td>
         </tr>
         </tbody>
     </table>
diff --git a/web/gui/src/main/webapp/app/view/host/host.js b/web/gui/src/main/webapp/app/view/host/host.js
index 0849cdb..378f597 100644
--- a/web/gui/src/main/webapp/app/view/host/host.js
+++ b/web/gui/src/main/webapp/app/view/host/host.js
@@ -23,24 +23,19 @@
 
     angular.module('ovHost', [])
     .controller('OvHostCtrl',
-        ['$log', '$scope', '$location', 'WebSocketService',
+        ['$log', '$scope', '$location', 'FnService', 'WebSocketService',
 
-        function ($log, $scope, $location, wss) {
+        function ($log, $scope, $location, fs, wss) {
             var self = this;
             self.hostData = [];
 
             $scope.responseCallback = function(data) {
-                self.hostData = data.devices;
+                self.hostData = data.hosts;
                 $scope.$apply();
             };
 
-            $scope.sortCallback = function (urlSuffix) {
-                // FIXME: fix hardcoded sort params
-                if (!urlSuffix) {
-                    urlSuffix = '';
-                }
-                var payload = { sortCol: 'id', sortDir: 'asc' };
-                wss.sendEvent('hostDataRequest', payload);
+            $scope.sortCallback = function (requestParams) {
+                wss.sendEvent('hostDataRequest', requestParams);
             };
 
             var handlers = {
@@ -53,8 +48,8 @@
                 wss.unbindHandlers(handlers);
             });
 
-            $log.log('OvHostCtrl has been created');
-
             $scope.sortCallback();
+
+            $log.log('OvHostCtrl has been created');
         }]);
 }());