Improve directives for specific host view

Change-Id: Ib2661e0501a23a505889c601fc59a201a64ffc36

app/components/host/host.html

@@ -1,9 +1,16 @@
 <article ng-controller="HostCtrl">
   <section class="main__content tabpanel" ng-if="data.live && data.config">
-    <bansho-host-main></bansho-host-main>
+     <h1>{{hostName}}</h1>
-    <bansho-host-services-list></bansho-host-services-list>
+     <bansho-host-main hostName="{{hostName}}"></bansho-host-main>
-    <bansho-host-load></bansho-host-load>
+     <bansho-host-services-list hostName="{{hostName}}"></bansho-host-services-list>
-    <bansho-host-cpu></bansho-host-cpu>
+
-    <bansho-host-info></bansho-host-info>
+     <h2>Cpu</h2>
-  </section>
+     <bansho-host-cpu></bansho-host-cpu>
+
+     <h2>Load</h2>
+     <bansho-host-load></bansho-host-load>
+
+     <h2>Info</h2>
+     <bansho-host-info></bansho-host-info>
+    </section>
 </article>

app/components/host/host.js

@@ -22,8 +22,8 @@ angular.module('bansho.host', ['bansho.live',
         });
     }])
 
-    .directive('banshoHost', ['$http', '$compile', 'hostConfig',
+    .directive('banshoHost', ['$http', '$compile', 'backendClient', 'hostConfig',
-        function ($http, $compile, hostConfig) {
+        function ($http, $compile, backendClient, hostConfig) {
             return {
                 restrict: 'E',
                 compile: function () {

app/components/host/host_main/host_main.html

@@ -1,6 +1,5 @@
 <div ng-controller="HostMainCtrl">
   <ul>
-    <li>{{hostName}}</li>
     <li>{{data.live.state}}</li>
     <li>{{data.config.alias}}</li>
     <li>{{data.live.plugin_output}}</li>

app/components/host/host_main/host_main.js

@@ -9,6 +9,9 @@ angular.module('bansho.host.main', [])
     .directive('banshoHostMain', function () {
         return {
             restrict: 'E',
+            compile: function (scope, element, attrs) {
+                scope.hostName = attrs.hostName;
+            },
             templateUrl: 'components/host/host_main/host_main.html'
         };
     });

app/components/host/host_services_list/host_services_list.html

@@ -1,5 +1,8 @@
-<div>
+<div ng-hide="services.length === 0">
-  <ul>
+  <h2>Services</h2>
-    <li ng-repeat="service in data.live.services">{{service}}</li>
+  <div>
-  </ul>
+    <ul>
+      <li ng-repeat="service in services">{{service}}</li>
+    </ul>
+  </div>
 </div>

app/components/host/host_services_list/host_services_list.js

@@ -2,13 +2,19 @@
 
 angular.module('bansho.host.services_list', [])
 
-    .controller('HostServicesListCtrl', ['$scope', function ($scope) {
+    .controller('HostServicesListCtrl', ['$scope', 'backendClient', function ($scope, backendClient) {
-        angular.noop();
+        backendClient.getServicesByHost($scope.hostName).success(function (data) {
+            $scope.services = data;
+        });
     }])
 
     .directive('banshoHostServicesList', function () {
         return {
             restrict: 'E',
-            templateUrl: 'components/host/host_services_list/host_services_list.html'
+            compile: function (scope, element, attrs) {
+                scope.hostName = attrs.hostName;
+            },
+            templateUrl: 'components/host/host_services_list/host_services_list.html',
+            controller: 'HostServicesListCtrl'
         };
     });

app/components/live/surveil.js

@@ -58,6 +58,20 @@ angular.module('bansho.live', [])
                     });
             };
 
+            var getServicesByHost = function (hostName) {
+                var fields = [],
+                    filters = {
+                        'is': {
+                            'host_name': [hostName]
+                        }
+                    };
+
+                return this.getObjects(fields, filters, 'services')
+                    .error(function () {
+                        throw new Error('getService : POST Request failed');
+                    });
+            }
+
             var getHostOpenProblems = function () {
                 var fields = ['state'],
                     filters = {
@@ -394,6 +408,7 @@ angular.module('bansho.live', [])
                 getTotalHosts: getTotalHosts,
                 getTotalServices: getTotalServices,
                 downtime: downtime,
-                recheck: recheck
+                recheck: recheck,
+                getServicesByHost: getServicesByHost
             };
         }]);