Skip to content

Commit ecd6687

Browse files
benjaminapetersenbenjaminapetersen
committed
Add tabs & details to StatefulSets page, update PetSet -> StatefulSet
1 parent 75e3af8 commit ecd6687

File tree

8 files changed

+100
-71
lines changed

8 files changed

+100
-71
lines changed

‎app/index.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -231,7 +231,7 @@ <h1>JavaScript Required</h1>
231231
<script src="scripts/controllers/deployment.js"></script>
232232
<script src="scripts/controllers/deploymentConfig.js"></script>
233233
<script src="scripts/controllers/replicaSet.js"></script>
234-
<script src="scripts/controllers/petSet.js"></script>
234+
<script src="scripts/controllers/statefulSet.js"></script>
235235
<script src="scripts/controllers/services.js"></script>
236236
<script src="scripts/controllers/service.js"></script>
237237
<script src="scripts/controllers/secrets.js"></script>

‎app/scripts/app.js

+6-3
Original file line numberDiff line numberDiff line change
@@ -174,9 +174,9 @@ angular
174174
templateUrl: 'views/edit/deployment-config.html',
175175
controller: 'EditDeploymentConfigController'
176176
})
177-
.when('/project/:project/browse/petsets/:petset', {
178-
templateUrl: 'views/browse/pet-set.html',
179-
controller: 'PetSetController',
177+
.when('/project/:project/browse/stateful-sets/:statefulset', {
178+
templateUrl: 'views/browse/stateful-set.html',
179+
controller: 'StatefulSetController',
180180
reloadOnSearch: false
181181
})
182182
.when('/project/:project/browse/rs/:replicaSet', {
@@ -409,6 +409,9 @@ angular
409409
.when('/project/:project/browse/deployments-replicationcontrollers/:rc', {
410410
redirectTo: '/project/:project/browse/rc/:rc'
411411
})
412+
.when('/project/:project/browse/pet-sets/:petset', {
413+
redirectTo: '/project/:project/browse/stateful-sets/:statefulset'
414+
})
412415
.otherwise({
413416
redirectTo: '/'
414417
});

‎app/scripts/controllers/deployments.js

+3-3
Original file line numberDiff line numberDiff line change
@@ -69,9 +69,9 @@ angular.module('openshiftConsole')
6969
resource: 'petsets',
7070
group: 'apps',
7171
version: 'v1alpha1'
72-
}, context, function(petsets) {
73-
console.log('petsets?', petsets.by('metadata.name'));
74-
$scope.petsets = petsets.by('metadata.name');
72+
}, context, function(statefulSets) {
73+
console.log('statefulSets?', statefulSets.by('metadata.name'));
74+
$scope.statefulSets = statefulSets.by('metadata.name');
7575
}));
7676

7777

‎app/scripts/controllers/petSet.js ‎app/scripts/controllers/statefulSet.js

+18-16
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
11
'use strict';
22

3-
// TODO: StatefulSetController rename
4-
// Kube docs: http://kubernetes.io/docs/user-guide/petset/
3+
// TODO: statefulSetController rename
4+
// Kube docs: http://kubernetes.io/docs/user-guide/statefulSet/
55
angular
66
.module('openshiftConsole')
7-
.controller('PetSetController', function(
7+
.controller('StatefulSetController', function(
88
$filter,
99
$scope,
1010
$routeParams,
@@ -14,15 +14,15 @@ angular
1414
ProjectsService) {
1515

1616
$scope.projectName = $routeParams.project;
17-
$scope.petSetName = $routeParams.petset;
17+
$scope.statefulSetName = $routeParams.statefulset || $routeParams.petset; // TODO: eliminate petset fallback
1818
$scope.forms = {};
1919
$scope.alerts = {};
2020
// TODO: update getBreadcrumbs, currently returns:
21-
// Pet Sets > hello-petset
21+
// Pet Sets > hello-statefulSet
2222
// But the link for `Pet Sets` isn't valid. Where do we want these to live?
2323
$scope.breadcrumbs = BreadcrumbsService.getBreadcrumbs({
24-
name: $routeParams.petset,
25-
kind: 'PetSet',
24+
name: $scope.statefulSetName,
25+
kind: 'statefulSet', // TODO: update to statefulSet
2626
namespace: $routeParams.project
2727
});
2828
$scope.emptyMessage = "Loading...";
@@ -33,7 +33,7 @@ angular
3333
AlertMessageService.clearAlerts();
3434

3535
var watches = [];
36-
var requestContext;
36+
var projectContext;
3737

3838
var updatePods = function(pods, selector) {
3939
if (!pods || !selector) {
@@ -45,38 +45,40 @@ angular
4545
};
4646

4747
var resourceGroupVersion = {
48-
resource: 'petsets',
48+
resource: 'petsets',// TODO: statefulSets
4949
group: 'apps',
5050
version: 'v1alpha1'
5151
};
5252

5353
ProjectsService
5454
.get($routeParams.project)
5555
.then(_.spread(function(project, context) {
56-
requestContext = context;
56+
projectContext = context;
5757

58-
watches.push(DataService.watchObject(resourceGroupVersion, $routeParams.petset, context, function(petSet) {
58+
watches.push(DataService.watchObject(resourceGroupVersion, $scope.statefulSetName, context, function(statefulSet) {
59+
console.log('statefulSet', statefulSet);
5960
angular.extend($scope, {
6061
resourceGroupVersion: resourceGroupVersion,
61-
petSet: petSet,
62+
statefulSet: statefulSet,
6263
loaded: true,
64+
projectContext: context
6365
// TODO: support scaling
6466
// scale: function() {},
6567
// isScalable: function() { return true; }
6668
});
6769
var pods;
6870
var selector;
69-
$scope.$watch('petSet.spec.selector', function() {
70-
selector = new LabelSelector($scope.petSet.spec.selector);
71-
$scope.podsForPetSet = updatePods(pods, selector);
71+
$scope.$watch('statefulSet.spec.selector', function() {
72+
selector = new LabelSelector($scope.statefulSet.spec.selector);
73+
$scope.podsForStatefulSet = updatePods(pods, selector);
7274
}, true);
7375
// TODO: this is leaky. every time the outer watch updates,
7476
// we are creating a new watch on pods:
7577
// - console.log('# of watches?', watches.length); // steadily increments
7678
// we have this in a lot of places...
7779
watches.push(DataService.watch('pods', context, function(podData) {
7880
pods = podData.by('metadata.name');
79-
$scope.podsForPetSet = updatePods(pods, selector);
81+
$scope.podsForStatefulSet = updatePods(pods, selector);
8082
}));
8183
}));
8284
}));

‎app/scripts/filters/canI.js

-1
Original file line numberDiff line numberDiff line change
@@ -72,7 +72,6 @@ angular
7272
]
7373
};
7474
return function(resource) {
75-
console.log('canIDoAny', resource);
7675
return _.some(resourceRulesMap[resource], function(rule) {
7776
return _.some(rule.verbs, function(verb) {
7877
return canIFilter({resource: rule.resource, group: rule.group}, verb);

‎app/scripts/services/navigate.js

+4-2
Original file line numberDiff line numberDiff line change
@@ -196,8 +196,10 @@ angular.module("openshiftConsole")
196196
.segmentCoded(name.substring(0, ind))
197197
.segmentCoded(name.substring(ind + 1));
198198
break;
199-
case "PetSet":
200-
url.segment("petsets")
199+
// PetSet & StatefulSet handle the same
200+
case "PetSet" :
201+
case "StatefulSet":
202+
url.segment("stateful-sets")
201203
.segmentCoded(name);
202204
break;
203205
case "PersistentVolumeClaim":

‎app/views/browse/pet-set.html ‎app/views/browse/stateful-set.html

+46-35
Original file line numberDiff line numberDiff line change
@@ -9,10 +9,10 @@
99
<alerts alerts="alerts"></alerts>
1010
<div>
1111
<h1>
12-
{{petSet.metadata.name}}
12+
{{statefulSet.metadata.name}}
1313
<div
1414
class="pull-right dropdown"
15-
ng-if="petSet"
15+
ng-if="statefulSet"
1616
ng-show="resourceGroupVersion.resource | canIDoAny">
1717
<button
1818
type="button"
@@ -30,28 +30,28 @@ <h1>
3030
<ul class="dropdown-menu actions action-button">
3131
<!-- TODO: kinda works, but cant seem to edit. neat. -->
3232
<li ng-if="resourceGroupVersion | canI : 'update'">
33-
<a ng-href="{{petSet | editYamlURL}}" role="button">Edit YAML</a>
33+
<a ng-href="{{statefulSet | editYamlURL}}" role="button">Edit YAML</a>
3434
</li>
3535
<li ng-if="resourceGroupVersion | canI : 'delete'">
36-
<!-- TODO: Warn about replicas? deleting petsets doesn't delete the pods -->
36+
<!-- TODO: Warn about replicas? deleting statefulSets doesn't delete the pods -->
3737
<!-- TODO: hpa-list attrib? figure out autoscaling -->
3838
<delete-link
39-
kind="PetSet"
39+
kind="statefulSet"
4040
group="apps"
41-
resource-name="{{petSet.metadata.name}}"
42-
project-name="{{petSet.metadata.namespace}}"
43-
replicas="petSet.status.replicas"
41+
resource-name="{{statefulSet.metadata.name}}"
42+
project-name="{{statefulSet.metadata.namespace}}"
43+
replicas="statefulSet.status.replicas"
4444
alerts="alerts">
4545
</delete-link>
4646
</li>
4747
</ul>
4848
</div>
4949
</h1>
5050
<labels
51-
labels="petSet.metadata.labels"
51+
labels="statefulSet.metadata.labels"
5252
clickable="true"
53-
kind="petsets"
54-
project-name="{{petSet.metadata.namespace}}"
53+
kind="statefulSets"
54+
project-name="{{statefulSet.metadata.namespace}}"
5555
limit="3"></labels>
5656
</div>
5757
</div>
@@ -71,21 +71,21 @@ <h1>
7171
<dt>Status:</dt>
7272
<dd>
7373
<!-- the deploymentStatus filter seems to work fine here -->
74-
<status-icon status="petSet | deploymentStatus"></status-icon>
75-
{{petSet | deploymentStatus}}
74+
<status-icon status="statefulSet | deploymentStatus"></status-icon>
75+
{{statefulSet | deploymentStatus}}
7676
</dd>
77-
<dt ng-if-start="petSet | annotation:'deploymentStatusReason'">Status Reason:</dt>
78-
<dd ng-if-end>{{petSet | annotation:'deploymentStatusReason'}}</dd>
77+
<dt ng-if-start="statefulSet | annotation:'deploymentStatusReason'">Status Reason:</dt>
78+
<dd ng-if-end>{{statefulSet | annotation:'deploymentStatusReason'}}</dd>
7979
<dt>Replicas:</dt>
8080
<dd>
8181
<!-- Enable scaling if this is a plain replication controller or it's the active deployment,
8282
as long as it doesn't have an HPA. -->
8383
<!-- TODO: replicaSets have a donut to the right -->
84-
<replicas status="petSet.status.replicas"
85-
spec="petSet.spec.replicas"
84+
<replicas status="statefulSet.status.replicas"
85+
spec="statefulSet.spec.replicas"
8686
disable-scaling="!isScalable()"
8787
scale-fn="scale(replicas)"
88-
deployment="petSet">
88+
deployment="statefulSet">
8989
</replicas>
9090
<!-- Do we have autoscalers for these?
9191
<span ng-if="autoscalers.length">(autoscaled)</span>
@@ -94,26 +94,34 @@ <h1>
9494
</dl>
9595
<h3>Template</h3>
9696
<pod-template
97-
pod-template="petSet.spec.template"
97+
pod-template="statefulSet.spec.template"
9898
detailed="true">
9999
</pod-template>
100100

101+
<h3>Storage</h3>
102+
<volumes
103+
volumes="statefulSet.spec.template.spec.volumes"
104+
namespace="projectName"
105+
can-remove="false"></volumes>
106+
101107
<h3>Pods</h3>
102-
<pods-table pods="podsForPetSet"></pods-table>
108+
<pods-table
109+
pods="podsForStatefulSet"></pods-table>
103110

104-
<annotations annotations="petSet.metadata.annotations"></annotations>
111+
<annotations
112+
annotations="statefulSet.metadata.annotations"></annotations>
105113

106114
</div>
107115
</uib-tab>
108116

109-
<uib-tab active="selectedTab.environment" ng-if="petSet">
117+
<uib-tab active="selectedTab.environment" ng-if="statefulSet">
110118
<uib-tab-heading>Environment</uib-tab-heading>
111119
<div class="resource-environment">
112-
<ng-form name="forms.petSetEnvVars">
113-
<div ng-repeat="container in petSet.spec.template.spec.containers">
120+
<ng-form name="forms.statefulSetEnvVars">
121+
<div ng-repeat="container in statefulSet.spec.template.spec.containers">
114122
<h3>Container {{container.name}} Environment Variables</h3>
115123
<p>
116-
Environment variables for PetSets are readonly.
124+
Environment variables for statefulSets are readonly.
117125
<span ng-if="!(container.env.length)">
118126
There are no environment variables for this container.
119127
</span>
@@ -134,28 +142,31 @@ <h3>Container {{container.name}} Environment Variables</h3>
134142
</div>
135143
</uib-tab>
136144

137-
<!-- TODO: impl these tabs
145+
138146
<uib-tab active="selectedTab.metrics">
139147
<uib-tab-heading>Metrics</uib-tab-heading>
140148
<div class="resource-metrics">
141-
Metrics
149+
<deployment-metrics
150+
ng-if="selectedTab.metrics && podsForStatefulSet"
151+
pods="podsForStatefulSet"
152+
containers="statefulSet.spec.template.spec.containers"
153+
alerts="alerts">
154+
</deployment-metrics>
142155
</div>
143156
</uib-tab>
144157

145-
<uib-tab active="selectedTab.logs">
146-
<uib-tab-heading>Logs</uib-tab-heading>
147-
<div class="resource-logs">
148-
Logs
149-
</div>
150-
</uib-tab>
151158

152159
<uib-tab active="selectedTab.events">
153160
<uib-tab-heading>Events</uib-tab-heading>
154161
<div class="resource-events">
155-
Events
162+
<events
163+
resource-kind="PetSet"
164+
resource-name="{{statefulSet.metadata.name}}"
165+
project-context="projectContext"
166+
ng-if="selectedTab.events"></events>
156167
</div>
157168
</uib-tab>
158-
-->
169+
159170

160171
</uib-tabset>
161172
</div>

‎app/views/deployments.html

+22-10
Original file line numberDiff line numberDiff line change
@@ -26,28 +26,37 @@ <h1>
2626
<div class="middle-content">
2727
<div class="container-fluid">
2828
<alerts alerts="alerts"></alerts>
29-
<!-- TODO: keep petsets here or put on own page? -->
29+
<!-- TODO: keep statefulSets here or put on own page? -->
3030
<div class="row">
3131
<div class="col-md-12">
32-
<h3>PetSets/StatefulSets</h3>
32+
<h3>StatefulSets</h3>
3333
<table class="table table-bordered table-hover table-mobile">
3434
<thead>
3535
<tr>
3636
<th>Name</th>
37-
<th>Last Version</th>
37+
<th>Generation</th>
3838
<th>Status</th>
3939
<th>Created</th>
4040
<th>Trigger</th>
4141
</tr>
4242
</thead>
43-
<tbody ng-repeat="(petSetName, petSet) in petsets">
43+
<tbody ng-repeat="(statefulSetName, statefulSet) in statefulSets">
4444
<tr>
4545
<td data-title="Name">
46-
<a ng-href="{{petSet | navigateResourceURL}}">{{petSet.metadata.name}}</a>
46+
<a ng-href="{{statefulSet | navigateResourceURL}}">{{statefulSet.metadata.name}}</a>
47+
</td>
48+
<td data-title="Generation">{{statefulSet.metadata.generation}}</td>
49+
<td data-title="Status">
50+
<status-icon status="statefulSet | deploymentStatus"></status-icon>
51+
{{statefulSet | deploymentStatus}}
52+
<span ng-if="(statefulSet | deploymentStatus) == 'Active' || (statefulSet | deploymentStatus) == 'Running'">,
53+
<span ng-if="statefulSet.spec.replicas !== statefulSet.status.replicas">{{statefulSet.status.replicas}}/</span>
54+
{{statefulSet.spec.replicas}} replica<span ng-if="statefulSet.spec.replicas != 1">s</span>
55+
</span>
56+
</td>
57+
<td data-title="Created">
58+
<span am-time-ago="statefulSet.metadata.creationTimestamp"></span>
4759
</td>
48-
<td data-title="Last Version">-</td>
49-
<td data-title="Status">-</td>
50-
<td data-title="Created">-</td>
5160
<td data-title="Trigger">-</td>
5261
</tr>
5362
</tbody>
@@ -107,8 +116,11 @@ <h3 ng-if="(deployments | hashSize) || (replicaSets | hashSize)">Deployment Conf
107116
<div row class="status">
108117
<status-icon status="replicationController | deploymentStatus" disable-animation></status-icon>
109118
<span flex>
110-
{{replicationController | deploymentStatus}}<span ng-if="(replicationController | deploymentStatus) == 'Active' || (replicationController | deploymentStatus) == 'Running'">,
111-
<span ng-if="replicationController.spec.replicas !== replicationController.status.replicas">{{replicationController.status.replicas}}/</span>{{replicationController.spec.replicas}} replica<span ng-if="replicationController.spec.replicas != 1">s</span></span>
119+
{{replicationController | deploymentStatus}}
120+
<span ng-if="(replicationController | deploymentStatus) == 'Active' || (replicationController | deploymentStatus) == 'Running'">,
121+
<span ng-if="replicationController.spec.replicas !== replicationController.status.replicas">{{replicationController.status.replicas}}/</span>
122+
{{replicationController.spec.replicas}} replica<span ng-if="replicationController.spec.replicas != 1">s</span>
123+
</span>
112124
</span>
113125
</div>
114126
<!-- TODO would be nice to have the deploymentStatusReason in a popup, when there is one -->

0 commit comments

Comments
 (0)