Update services for v1beta3 api

www/master/components/dashboard/js/modules/controllers/listServicesController.js

@@ -7,7 +7,7 @@ app.controller('ListServicesCtrl', [
   '$scope',
   '$interval',
   '$routeParams',
-  'k8sApi',
+  'k8sv1Beta3Api',
   '$rootScope',
   '$location',
   function($scope, $interval, $routeParams, k8sApi, $rootScope, $location) {
@@ -19,7 +19,7 @@ app.controller('ListServicesCtrl', [
       {name: 'Labels', field: 'labels'},
       {name: 'Selector', field: 'selector'},
       {name: 'IP', field: 'ip'},
-      {name: 'Port', field: 'port'}
+      {name: 'Ports', field: 'port'}
     ];
 
     $scope.custom = {
@@ -67,41 +67,36 @@ app.controller('ListServicesCtrl', [
         if (data.items.constructor === Array) {
           data.items.forEach(function(service) {
 
-            var _name = '', _uses = '', _component = '', _provider = '';
+            var _labels = '';
 
-            if (service.labels !== null && typeof service.labels === 'object') {
-              Object.keys(service.labels)
-                  .forEach(function(key) {
-                    if (key == 'name') {
-                      _name += ',' + service.labels[key];
-                    }
-                    if (key == 'component') {
-                      _component += ',' + service.labels[key];
-                    }
-                    if (key == 'provider') {
-                      _provider += ',' + service.labels[key];
-                    }
-                  });
+            if (service.metadata.labels) {
+              _labels = _.map(service.metadata.labels, function(v, k) { return k + '=' + v }).join(', ');
             }
 
             var _selectors = '';
 
-            if (service.selector !== null && typeof service.selector === 'object') {
-              Object.keys(service.selector)
-                  .forEach(function(key) {
-                    if (key == 'name') {
-                      _selectors += ',' + service.selector[key];
-                    }
-                  });
+            if (service.spec.selector) {
+              _selectors = _.map(service.spec.selector, function(v, k) { return k + '=' + v }).join(', ');
+            }
+
+            var _ports = '';
+
+            if (service.spec.ports) {
+              _ports = _.map(service.spec.ports, function(p) {
+                var n = '';
+                if(p.name)
+                  n = p.name + ': ';
+                 n = n + p.port;
+                return n;
+               }).join(', ');
             }
 
             $scope.content.push({
-              name: service.id,
-              ip: service.portalIP,
-              port: service.port,
-              selector: addLabel(_fixComma(_selectors), 'name='),
-              labels: addLabel(_fixComma(_name), 'name=') + ' ' + addLabel(_fixComma(_component), 'component=') + ' ' +
-                          addLabel(_fixComma(_provider), 'provider=')
+              name: service.metadata.name,
+              ip: service.spec.portalIP,
+              port: _ports,
+              selector: _selectors,
+              labels: _labels
             });
           });
         }

www/master/components/dashboard/js/modules/controllers/serviceController.js

@@ -22,7 +22,7 @@ ServiceController.prototype.handleError = function(data, status, headers, config
 app.controller('ServiceCtrl', [
   '$scope',
   '$routeParams',
-  'k8sApi',
+  'k8sv1Beta3Api',
   '$location',
   function($scope, $routeParams, k8sApi, $location) {
     $scope.controller = new ServiceController();
@@ -31,6 +31,8 @@ app.controller('ServiceCtrl', [
     $scope.controller.getData($routeParams.serviceId);
 
     $scope.doTheBack = function() { window.history.back(); };
+    $scope.go = function(d) { $location.path('/dashboard/services/' + d.metadata.name); }
+    $scope.getSelectorUrlFragment = function(sel){ return _.map(sel, function(v, k) { return k + '=' + v }).join(','); };
 
   }
 ]);

www/master/components/dashboard/views/service.html

@@ -10,68 +10,81 @@
 
       <div class="heading">
         <span class="label">Service: </span>
-        <span>{{service.id}}</span>
+        <span>{{service.metadata.name}}</span>
       </div>
 
 
-      <table>
+      <table class="align-top">
         <tbody>
           <tr>
             <td class="name">Created</td>
             <td class="value">
-              {{service.creationTimestamp | date:'medium'}}
+              {{service.metadata.creationTimestamp | date:'medium'}}
             </td>
           </tr>
 
           <tr>
-            <td class="name">Port</td>
+            <td class="name">Ports</td>
             <td class="value">
-              {{service.port}}
+              <div ng-repeat="port in service.spec.ports">
+                <span ng-show="port.name">
+                  {{port.name}}:
+                </span>
+                {{port.port}}/{{port.protocol}}
+             </div>
             </td>
           </tr>
 
+
           <tr>
-            <td class="name">Container Port</td>
+            <td class="name">IP</td>
             <td class="value">
-              {{service.containerPort}}
+              {{service.spec.portalIP}}
             </td>
           </tr>
 
-          <tr>
-            <td class="name">Portal IP</td>
+          <tr ng-show="service.spec.publicIPs">
+            <td class="name">Public IPs</td>
             <td class="value">
-              {{service.portalIP}}
-            </td>
-          </tr>
-
-          <tr>
-            <td class="name">Protocol</td>
-            <td class="value">
-              {{service.protocol}}
+              {{service.spec.publicIPs | join:', '}}
             </td>
           </tr>
 
           <tr>
             <td class="name">Session Affinity</td>
             <td class="value">
-              {{service.sessionAffinity}}
+              {{service.spec.sessionAffinity}}
             </td>
           </tr>
 
           <tr>
             <td class="name">Labels</td>
             <td class="value">
-              <div ng-repeat="(label, value) in service.labels">
+              <div ng-repeat="(label, value) in service.metadata.labels">
                 {{label}}: {{value}}
               </div>
             </td>
           </tr>
 
+          <tr ng-show="service.spec.selector">
+            <td class="name">Selector</td>
+            <td class="value">
+              <span ng-repeat="(label, value) in service.spec.selector">
+                {{label}}={{value}}{{$last ? '' : ', '}}
+              </span>
+            </td>
+          </tr>
+
+
           <tr>
             <td class="name">Related Pods</td>
             <td class="value">
-              <div ng-repeat="(label, value) in service.selector">
-                <a ng-href="#/dashboard/groups/type/selector/{{label}}={{value}},type=pod">{{label}}: {{value}}</a>
+              <div ng-show="service.spec.selector && Object.keys(service.spec.selector).length > 1">
+                <a ng-href="#/dashboard/groups/type/selector/{{getSelectorUrlFragment(service.spec.selector)}},type=pod">{{getSelectorUrlFragment(service.spec.selector)}}</a>
+              </div>
+
+              <div ng-repeat="(label, value) in service.spec.selector">
+                <a ng-href="#/dashboard/groups/type/selector/{{label}}={{value}},type=pod">{{label}}={{value}}</a>
               </div>
             </td>
           </tr>
@@ -79,8 +92,12 @@
           <tr>
             <td class="name">Related Replication Controllers</td>
             <td class="value">
-              <div ng-repeat="(label, value) in service.selector">
-                <a ng-href="#/dashboard/groups/type/selector/{{label}}={{value}},type=replicationController">{{label}}: {{value}}</a>
+              <div ng-show="service.spec.selector && Object.keys(service.spec.selector).length > 1">
+                <a ng-href="#/dashboard/groups/type/selector/{{getSelectorUrlFragment(service.spec.selector)}},type=replicationController">{{getSelectorUrlFragment(service.spec.selector)}}</a>
+              </div>
+
+              <div ng-repeat="(label, value) in service.spec.selector">
+                <a ng-href="#/dashboard/groups/type/selector/{{label}}={{value}},type=replicationController">{{label}}={{value}}</a>
               </div>
             </td>
           </tr>