Deployment WIP

app/components/k8s/deployment-row/component.js

@@ -0,0 +1,17 @@
+import Ember from 'ember';
+
+export default Ember.Component.extend({
+  k8s: Ember.inject.service(),
+
+  model: null,
+  expanded: false,
+
+  tagName: '',
+
+  actions: {
+    toggleExpand() {
+      this.toggleProperty('expanded');
+    }
+  },
+
+});

app/components/k8s/deployment-row/template.hbs

@@ -0,0 +1,39 @@
+<tr>
+  <td>
+    <a href="#" {{action "toggleExpand"}}><i class="icon {{if expanded 'icon-minus-square' 'icon-plus-square'}}"/></a>
+    {{#link-to "k8s-tab.namespace.deployments.deployment" model.displayName}}{{model.displayName}}{{/link-to}}
+  </td>
+  <td>
+    {{model.displayReplicas}}
+  </td>
+  <td class="force-wrap">
+    {{#each model.selectorsAsArray as |sel|}}
+      <span class="badge badge-default">{{sel.label}}={{sel.value}}</span>
+    {{else}}
+      <span class="text-muted">{{t 'generic.none'}}</span>
+    {{/each}}
+  </td>
+  <td class="force-wrap">
+    {{#each model.spec.template.spec.containers as |container index|}}
+      <span tooltip="{{if (gt model.spec.template.spec.containers.length 1) container.image}}">
+        {{~unless (eq index 0) ', '~}}
+        {{~container.name~}}
+        {{~#if (eq model.spec.template.spec.containers.length 1)~}}
+          <span class="text-muted"> ({{container.image}})</span>
+        {{~/if~}}
+      </span>
+    {{else}}
+      <span class="text-muted">{{t 'generic.none'}}</span>
+    {{/each}}
+  </td>
+  <td class="actions">
+    {{action-menu model=model}}
+  </td>
+</tr>
+{{#if expanded}}
+  <tr class="nohover">
+    <td colspan="5" class="subtable">
+      {{k8s/pod-section model=model.selectedPods}}
+    </td>
+  </tr>
+{{/if}}

app/k8s-tab/namespace/deployments/deployment/route.js

@@ -0,0 +1,9 @@
+import Ember from 'ember';
+
+export default Ember.Route.extend({
+  k8s: Ember.inject.service(),
+
+  model(params) {
+    return this.get('k8s').getDeployment(params.name);
+  }
+});

app/k8s-tab/namespace/deployments/deployment/template.hbs

@@ -0,0 +1,53 @@
+<section class="header">
+  <h1>{{#link-to "k8s-tab.namespace.deployments"}}{{t 'k8sTab.namespace.deployments.deployment.header'}}{{/link-to}} {{model.displayName}}</h1>
+  <div class="pull-right">
+    {{action-menu model=model}}
+  </div>
+</section>
+
+<section>
+  <div class="container-multi-stat">
+    <div class="container-flex bordered">
+      <div class="col-flex"><label>{{t 'k8sTab.multistat.header.type'}}</label> {{model.spec.type}}</div>
+      <div class="col-flex"><label>{{t 'k8sTab.multistat.header.cluster'}}</label> {{model.spec.clusterIP}}</div>
+      <div class="col-flex"><label>{{t 'k8sTab.multistat.header.balancer'}}</label> {{default-str model.spec.loadBalancerIP default="None"}}</div>
+      <div class="col-flex"><label>{{t 'k8sTab.multistat.header.session'}}</label> {{model.spec.sessionAffinity}}</div>
+      <div class="col-flex">
+        <label>{{t 'k8sTab.multistat.header.external'}}</label>
+        {{#each model.spec.externalIPs as |ip index|}}
+          {{if (eq index 0) '' ','}}{{ip}}
+        {{else}}
+          {{t 'generic.none'}}
+        {{/each}}
+      </div>
+      <div class="col-flex">
+        <label>{{t 'k8sTab.multistat.header.selectors'}}</label>
+        {{#each model.selectorsAsArray as |sel|}}
+          <span class="badge badge-default">{{sel.label}}={{sel.value}}</span>
+        {{else}}
+          {{t 'generic.none'}}
+        {{/each}}
+      </div>
+    </div>
+  </div>
+</section>
+
+<section>
+  <ul class="nav nav-tabs nav-tabs-well shadowed" role="tablist">
+    <li role="tab" class="tab" data-section="pods" {{action "selectTab" "pods" target="view"}}><a href="#">{{t 'k8sTab.navTabs.pods'}}</a></li>
+    <li role="tab" class="tab" data-section="labels" {{action "selectTab" "labels" target="view"}}><a href="#">{{t 'k8sTab.navTabs.labels'}}</a></li>
+    <li role="tab" class="tab" data-section="ports" {{action "selectTab" "ports" target="view"}}><a href="#">{{t 'k8sTab.navTabs.ports'}}</a></li>
+  </ul>
+
+  <div class="horizontal-form well" role="tabpanel">
+    <div class="section container-fluid" data-section="pods">
+      {{k8s/pod-section model=model.selectedPods}}
+    </div>
+    <div class="section container-fluid" data-section="labels">
+      {{labels-section model=model labelSource=model.metadata.labels showKind=false sortBy="key"}}
+    </div>
+    <div class="section container-fluid" data-section="ports">
+      {{k8s/service-ports model=model.spec.ports}}
+    </div>
+  </div>
+</section>

app/k8s-tab/namespace/deployments/deployment/view.js

@@ -0,0 +1,8 @@
+import Ember from 'ember';
+import SelectTab from 'ui/mixins/select-tab';
+
+export default Ember.View.extend(SelectTab, {
+  didInsertElement() {
+    this.send('selectTab', 'pods');
+  },
+});

app/k8s-tab/namespace/deployments/index/controller.js

@@ -0,0 +1,16 @@
+import Ember from 'ember';
+import Sortable from 'ui/mixins/sortable';
+import FilterNamespace from 'ui/mixins/filter-k8s-namespace';
+
+export default Ember.Controller.extend(Sortable, FilterNamespace, {
+  filterableContent: Ember.computed.alias('model.allDeployments'),
+  sortableContent: Ember.computed.alias('filtered'),
+
+  sortBy: 'name',
+  sorts: {
+    state:        ['stateSort','name','id'],
+    name:         ['name','id'],
+    serviceType:  ['serviceType','name','id'],
+    selector:     ['selector','name','id'],
+  },
+});

app/k8s-tab/namespace/deployments/index/route.js

@@ -0,0 +1,10 @@
+import Ember from 'ember';
+
+export default Ember.Route.extend({
+  model() {
+    return Ember.Object.create({
+      namespace: this.modelFor('k8s-tab.namespace'),
+      allDeployments: this.modelFor('k8s-tab.namespace.deployments'),
+    });
+  },
+});

app/k8s-tab/namespace/deployments/index/template.hbs

@@ -0,0 +1,27 @@
+<section class="header">
+  <h1>{{t 'k8sTab.namespace.deployments.index.header'}}</h1>
+
+  {{#link-to "k8s-tab.apply" (query-params kind="ReplicationController") classNames="btn btn-sm btn-primary"}}{{t 'k8sTab.namespace.deployments.index.linkTo'}}{{/link-to}}
+</section>
+
+<section class="well instances">
+  <table class="grid fixed" style="margin-bottom: 0;">
+    <thead>
+      <tr>
+        {{sortable-th sortable=this action="changeSort" name="name" label='generic.name'}}
+        <th width="80">{{t 'k8sTab.namespace.deployments.index.table.header.replicas'}}</th>
+        <th>{{t 'k8sTab.namespace.deployments.index.table.header.selectors'}}</th>
+        <th>{{t 'k8sTab.namespace.deployments.index.table.header.containers'}}</th>
+        <th class="actions" width="85">&nbsp;</th>
+      </tr>
+    </thead>
+    <tbody>
+      {{#each arranged as |deployment|}}
+        {{k8s/deployment-row model=deployment}}
+      {{else}}
+        <tr><td colspan="5" class="text-center text-muted">{{t 'k8sTab.namespace.deployments.index.table.body.noData'}}</td></tr>
+      {{/each}}
+    </tbody>
+  </table>
+</section>
+

app/k8s-tab/namespace/deployments/route.js

@@ -0,0 +1,9 @@
+import Ember from 'ember';
+
+export default Ember.Route.extend({
+  k8s: Ember.inject.service(),
+
+  model() {
+    return this.get('k8s').allDeployments();
+  },
+});

app/k8s-tab/route.js

@@ -17,6 +17,8 @@ export default Ember.Route.extend({
       services: k8s.allServices(),
       rcs: k8s.allRCs(),
       pods: k8s.allPods(),
+      deployments: k8s.allDeployments(),
+      replicasets: k8s.allReplicaSets(),
       containers: this.get('store').findAll('container'),
     }).then((hash) => {
       return k8s.selectNamespace().then(() => {

app/mixins/k8s-pod-selector.js

@@ -18,9 +18,17 @@ export default Ember.Mixin.create({
     }
     else if ( typeof sel === 'object' )
     {
-      Object.keys(sel).forEach((key) => {
-        out.push({label: key, value: sel[key]});
-      });
+      if ( sel.matchLabels ) {
+        Object.keys(sel.matchLabels).forEach((key) => {
+          out.push({label: key, value: sel.matchLabels[key]});
+        });
+      }
+      else
+      {
+        Object.keys(sel).forEach((key) => {
+          out.push({label: key, value: sel[key]});
+        });
+      }
     }
 
     return out;

app/models/k8s-deployment.js

@@ -0,0 +1,5 @@
+import ReplicationController from 'ui/models/k8s-replicationcontroller';
+
+var Deployment = ReplicationController.extend();
+
+export default Deployment;

app/router.js

@@ -199,6 +199,10 @@ Router.map(function() {
             this.route('service', {path: '/:name'});
           });
 
+          this.route('deployments', {path: '/deployments'}, function() {
+            this.route('deployment', {path: '/:name'});
+          });
+
           this.route('rcs', {path: '/rcs'}, function() {
             this.route('rc', {path: '/:name'});
           });

app/services/k8s.js

@@ -321,14 +321,24 @@ export default Ember.Service.extend({
     {
       if ( opt.url.substr(0,1) !== '/' )
       {
-        opt.url = `${self.get('kubernetesEndpoint')}/${C.K8S.BASE_VERSION}/` + opt.url;
+        let version;
+        if ( C.K8S.EXTENSION_TYPES.indexOf(type) >= 0 )
+        {
+          version = C.K8S.EXTENSION_VERSION;
+        }
+        else
+        {
+          version = C.K8S.BASE_VERSION;
+        }
+
+        opt.url = `${self.get('kubernetesEndpoint')}/${version}/` + opt.url;
       }
 
       return findWithUrl(opt.url);
     }
     else
     {
-      return Ember.RSVP.reject(new ApiError('k8s find requirs opt.url'));
+      return Ember.RSVP.reject(new ApiError('k8s find requires opt.url'));
     }
 
     function findWithUrl(url) {
@@ -590,6 +600,14 @@ export default Ember.Service.extend({
   getServices() { return this._getCollection('service','services'); },
   getService(name) { return this._getNamespacedResource('service','services',name); },
 
+  allDeployments() { return this._allCollection('deployment','deployments'); },
+  getDeployments() { return this._getCollection('deployment','deployments'); },
+  getDeployment(name) { return this._getNamespacedResource('deployment','deployments',name); },
+
+  allReplicaSets() { return this._allCollection('replicaset','replicasets'); },
+  getReplicaSets() { return this._getCollection('replicaset','replicasets'); },
+  getReplicaSet(name) { return this._getNamespacedResource('replicaset','replicasets',name); },
+
   allRCs() { return this._allCollection('replicationcontroller','replicationcontrollers'); },
   getRCs() { return this._getCollection('replicationcontroller','replicationcontrollers'); },
   getRC(name) { return this._getNamespacedResource('replicationcontroller','replicationcontrollers',name); },

app/utils/constants.js

@@ -232,7 +232,9 @@ var C = {
   K8S: {
     BASE: 'api',
     BASE_VERSION: 'api/v1',
+    EXTENSION_VERSION: 'apis/extensions/v1beta1',
     TYPE_PREFIX: 'k8s-',
+    EXTENSION_TYPES: ['k8s-deployment','k8s-replicaset'],
     ID_SEPARATOR: '::',
     DEFAULT_NS: 'defaultNamespace',
   },

app/utils/navigation-tree.js

@@ -56,6 +56,14 @@ const navTree = [
         ctx: [getProjectId, getNamespaceId],
         condition: k8sReady,
       },
+      {
+        id: 'k8s-deployments',
+        localizedLabel: 'nav.k8s.deployments',
+        icon: 'icon icon-tachometer',
+        route: 'k8s-tab.namespace.deployments',
+        ctx: [getProjectId, getNamespaceId],
+        condition: k8sReady,
+      },
       {
         id: 'k8s-rcs',
         localizedLabel: 'nav.k8s.rcs',